* style progress bar/range
* add progress percentage next to bar
* Linting
* Separate GameProgress and GameProgressModal markup
* Display process percentage within/on top of range
* refactor progress element
* add missing gameprogress
it got lost in the rebase
* add margin and center progress on mobile
* Replaced bus events with actions and mutations
* textarea specific styles
* Moved contact actions to its own component
* Misc clean up
* Rename placeholder class
* Refactored game notes, added preview, mutations, classes, etc...
* only center actions on mobile
* Removed unused class
* Added notes label
* Remove bus event for progresses
* Remove progress pie for now
* Progress mutations
* progress actions
* Additional translations
* Fix indentation
* Update getter to get value from platform-specific progress
* Modal clean up, make close button fixed always
* update sort logic to get values from platform-specific
* Use native progress element for view only
* Removed completed todo
* Added desktop media query
* Added todo to sync notes and progresses
* Cleaned up gameProgress component
* Todo
* Show progress on top and button next to other actions
* remove deprecated hollow button class
* Update accent color for default theme
* Cleaned up gameCardGrid a bit
* linter fix
* removed computed prop
* Fix typo
* space out actions
* null check
* don't show drag icons if sorting is enabled
Sorting overwrites the dragging order. Therefore the drag icons should only be visible if sorting is disabled.
* reverse initial attempt
* Add custom sort icons
* use `sort-amount-down` as default
* Linting
* params are kebab case
it's a ~~Jersey~~Vue thing
* Copy GameNotes and use it as boilerplate
* Save and display progress data
* Save and display progress data
* Mobile adjustments and add label
* Mobile adjustments and add label
* save progress as integer
* Add sorting by progress
* Display progress on select GameCards
* Fix `progress()` return
* Reduce amount of props
* Copy change
* remove unnecessary check
* use `input[type=range]`
* remove unnecessary check
* Add progress-pie in the Grid view
Credit goes to @oliviale for her lovely CSS progress pie
* Save and display progress data
* Add progress-pie in the Grid view
Credit goes to @oliviale for her lovely CSS progress pie
* fix rebase conflict
* add translation
* Fixed merge conflict typo
I wanted to add this commit to a bigger branch where I would add custom rating and display that alongside the IGDB rating.
But with #152 not working as intended I'm fairly certain I'm gonna fall into the same problem with this feature, so I'll wait until there's a solution.
* add focusInput functions
`autofocus` on inputs doesn't seem to work. So I manually set `focus()` whenever `open()`/`clear()`/`reset()` is called.
* set focus to searchInput after adding a game (WIP)
I know too little about Vue.js, but I'm certain that it's a bad practice to look 2 parents up to find the `searchInput` ref. Either the ref needs to be added to its children or `focusInput()` needs to be added to `GameCard.js` to use as a mixin.
* linting
* remove unnecessary if statements
* remove comments
Disclaimer: This is bad practice!
HOWEVER! I noticed that the spinning animation was sorta off. It took me a while to figure it out, but eventually I noticed that the spinning icon provided by FontAwesome had the dimensions 28x29.
Since width and height wasn't the same it create a sort of jumping (?) and made the animation less smooth.
To fix it I checked what font-size it currently had and literally tried some numbers above and below it.
My first attempt was `2.072`, which made the icon 29x29 - which didn't solve the issue, since the animation wasn't perfectly centered anymore.
`1.99999999`, as unfortunate it is, turned the icon into 28x28 and fixed the animation.
Mobile view is a bit icky to navigate.
I'm planning to work on an app-like mobile styling. But for now this would make it already a lot less annoying to use on mobile.
When first loading the new version that has different themes, or joining the website with a new account, the theme setting was showing a blank dropdown.
The website's theme was set to `theme-default` but the dropdown didn't show anything.
