diff --git a/frontend/vue.js b/frontend/vue.js
index e9c16fd..1cacc64 100644
--- a/frontend/vue.js
+++ b/frontend/vue.js
@@ -546,8 +546,143 @@ vm.$destroy()
* ******************************************************************************************* */
+// --- Updates the element’s textContent.
+// --- If you need to update the part of textContent, you should use {{ Mustache }} interpolations.
+//
+
+
+// --- Updates the element’s innerHTML. Note that the contents are inserted as plain HTML -
+// --- they will not be compiled as Vue templates. If you find yourself trying to compose templates
+// --- using v-html, try to rethink the solution by using components instead.
+
+
+//
+
+
+// --- Toggle’s the element’s display CSS property based on the truthy-ness of the expression value.
+// --- This directive triggers transitions when its condition changes.
+
+
+//
+
+
+// --- Conditionally render the element based on the truthy-ness of the expression value.
+// --- The element and its contained directives / components are destroyed and re-constructed
+// --- during toggles. If the element is a element, its content will be extracted as
+// --- the conditional block. This directive triggers transitions when its condition changes.
+
+
+//
+//
+//
+
+
+// --- Render the element or template block multiple times based on the source data.
+// --- The directive’s value must use the special syntax alias in expression to provide an alias
+// --- for the current element being iterated on:
+
+
+//
{{ item.text }}
+
+
+// --- Alternatively, you can also specify an alias for the index (or the key if used on an Object):
+
+
+//
+//
+//
+
+
+// --- Attaches an event listener to the element. The event type is denoted by the argument.
+// --- The expression can be a method name, an inline statement, or omitted if there are modifiers present.
+
+
+// .stop: Call event.stopPropagation().
+// .prevent: Call event.preventDefault().
+// .capture: Add event listener in capture mode.
+// .self: Only trigger handler if event was dispatched from this element.
+// .{keyCode | keyAlias}: Only trigger handler on certain keys.
+// .native: Listen for a native event on the root element of component.
+// .once: Trigger handler at most once.
+// .left: (2.2.0+) only trigger handler for left button mouse events.
+// .right: (2.2.0+) only trigger handler for right button mouse events.
+// .middle: (2.2.0+) only trigger handler for middle button mouse events.
+// .passive: (2.3.0+) attaches a DOM event with { passive: true }.
+
+// Method handler:
+// Object syntax (2.4.0+):
+// Inline statement:
+// Shorthand:
+// Stop propagation:
+// Prevent default:
+// Prevent default without expression:
+// Chain modifiers:
+// Key modifier using keyAlias:
+// Key modifier using keyCode:
+// The click event will be triggered at most once:
+
+
+// --- Dynamically bind one or more attributes, or a component prop to an expression.
+// --- When used to bind the class or style attribute, it supports additional value types such as
+// --- Array or Objects. See linked guide section below for more details.
+
+
+// .prop: Bind as a DOM property instead of an attribute.
+// .camel: (2.1.0+) transform the kebab-case attribute name into camelCase.
+// .sync: (2.3.0+) a syntax sugar that expands into a v-on handler for updating the bound value.
+
+// Bind an attribute:
+// Shorthand:
+// With inline string concatenation:
+// Class binding:
+// Style binding:
+// Binding an object of attributes
+// DOM attribute binding with prop modifier:
+// Prop binding. "prop" must be declared in my-component:
+// Pass down parent props in common with a child component:
+// XLink:
+
+
+// --- Create a two-way binding on a form input element or a component.
+// --- For detailed usage and other notes, see the Guide section linked below.
+
+
+// .lazy: Listen to change events instead of input
+// .number: Cast input string to numbers
+// .trim: Trim input
+
+//
+//
+//
+
+
+// --- Skip compilation for this element and all its children.
+// --- You can use this for displaying raw mustache tags.
+// --- Skipping large numbers of nodes with no directives on them can also speed up compilation.
+
+
+// {{ this will not be compiled }}
+
+
+// --- This directive will remain on the element until the associated Vue instance finishes
+// --- compilation. Combined with CSS rules such as [v-cloak] { display: none }, this directive
+// --- can be used to hide un-compiled mustache bindings until the Vue instance is ready.
+
+
+//
{{ message }}
+// [v-cloak] { display: none; }
+
+
+// --- Render the element and component once only. On subsequent re-renders, the element/component
+// --- and all its children will be treated as static content and skipped. This can be used to
+// --- optimize update performance.
+
+
+// This will never change: {{msg}}
+//
+
/* *******************************************************************************************
* SPECIAL ATTRIBUTES