Skip to content

SVG Refactor + Icon Hotfix#83

Merged
ArsalaBangash merged 17 commits intomasterfrom
svg-refactor
Nov 7, 2020
Merged

SVG Refactor + Icon Hotfix#83
ArsalaBangash merged 17 commits intomasterfrom
svg-refactor

Conversation

@dlqqq
Copy link
Contributor

@dlqqq dlqqq commented Nov 3, 2020

Summary

  • call vue-svg-loader via webpack to import SVGs as Vue components. this also optimizes SVGs via svgo in the build process, greatly improving load times of SVG assets. (will extend this to other SVG assets later)
  • extensively refactor PracticeCard to use the QCard component shipped with Quasar.
  • fix spacing and margin issues, resolves 🐛 Bug: Difficulty icon bleeds outside of customize card on mobile screens #77
  • preserves current UI and appearance

Preview

20201103-141528

@dlqqq dlqqq requested a review from ArsalaBangash November 3, 2020 22:16
Copy link
Member

@ArsalaBangash ArsalaBangash left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Solid iteration

Great work! Here are some points I have:

  • Realign the spacing in the customize practice card

How it was before

image

How it is now

image

  • We use the kebab-case notation for directories, so let's rename assets//difficulty_icons to assets/difficulty-icons/
  • I think CustomizePracticeCard or CustomizePractice would be a better name for the component since PracticeCard implies it's a card component where the practice occurs

Copy link
Member

@ArsalaBangash ArsalaBangash left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great work!

@ArsalaBangash ArsalaBangash merged commit 5b911bc into master Nov 7, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

🐛 Bug: Difficulty icon bleeds outside of customize card on mobile screens

2 participants