• BoardColumn component's "more" icon position change slightly when the column is being renamed (editableText component's "isEditModeEnabled" property is set to true)
• The column name should be at the exact same place whether we are in edit mode or not
• Column name and more icon should have an hover style to let the user know they are interactive
• Remove scale animation when the user go hover a task
• Reduce font size
• Reduce padding to free some space
• Enforce uppercase for column name in order to have a clear hierarchy

A BoardColumn component shouldn't trigger an API call and display a notification when it's dropped on itself

In TaskEdit View, the board's name is shown instead of the column's name.

• Fix DropdownMenu component's position (no longer exact after fixing BoardColumn Style in #2 and Board style in #19)
• Use only one DropdownMenu component for the entire application
• Allow multiple alignements

Board page's main EditableText component has no value in it's "editedText" property when the page is accessed directly from the URL.

• Use CSS Grid
• Fix "more icon" position
• Add style to "more icon" on hover to indicate to the user it's interactive

On mobile, the Register and Login links don't show properly

Prevent the BoardColumn component's drag event on it's EditableText input.

This will allow the user to select freely the input's text.

Change "Minimal Valuable Product" to "Minimum Valuable Product"

• Rename classes using BEM methodology to improve CSS maintainability
• Use SCSS "&" instead of repeating the block's name when nesting element classes in block classes
• Order SCSS properties with a "Concentric" approach (cf : https://9elements.com/css-rule-order/)
• Use grid instead of flexbox when it's more relevant
• Implement Refactoring UI principles to ensure pleasant, structured and clear design
• Use the most relevant HTML tags for better SEO
• Define an order for vue object properties (data, props, methods...etc) and reorder every components properties accordingly
• Events naming convention

When the user wants to edit the text and he doesn't set any value (empty string or spaces), EditableText component doesn't reset it's "editedText" property to the orginal value.

The original value is contained in EditableText component's "text" property which is initialized on mount with the v-model value.

• Login & Register with JWT authentification
• CRUD boards
• CRUD columns
• CRUD tasks
• Move columns inside a board (drag n drop)
• Move tasks inside a column (drag n drop)
• Move tasks between columns (drag n drop)
• Enable / Disable board sharing with a link
• Share boards with unique link

In EditableText component the pointer cursor appear even when the user is not directly hover the text because the CSS property is set on the wrong element.
It must be on element with class "editable-text__text" instead of the container div of the component.

When editing a column's name, if we use an emoji it slighty moves the text in the input breaking the seemless transition between the text and the input.

A Task component shouldn't trigger an API call and display a notification when it's dropped on itself