fix: profile dropdown text color in light mode

[daiagi]

Thank you for your contribution to the KodaDot NFT gallery.

👇 _ Let's make a quick check before the contribution.

PR Type

• Bugfix
• Feature
• Refactoring

Context

• Closes profile dropdown text color #4345
• Requires deployment <>

Before submitting pull request, please make sure:

• My contribution builds clean without any errors or warnings
• I've merged recent default branch -- main and I've no conflicts
• I've tried to respect high code quality standards
• I've didn't break any original functionality
• I've posted a screenshot of demonstrated change in this PR

Optional

• I've tested it at </bsx/collection>
• I've tested PR on mobile
• I've written unit tests 🧪
• I've found edge cases

Had issue bounty label?

• Fill up your KSM address: Payout

Community participation

• Are you at KodaDot Discord?

Screenshot 📸

• My fix has changed something on UI; a screenshot is best to understand changes for others.
  

[netlify]

✅ Deploy Preview for koda-nuxt ready!

Name	Link
🔨 Latest commit	203a8d9
🔍 Latest deploy log	https://app.netlify.com/sites/koda-nuxt/deploys/637a2dc160a76e00089faf09
😎 Deploy Preview	https://deploy-preview-4346--koda-nuxt.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site settings.

[kodabot]

SUCCESS @daiagi PR for issue #4345 which is assigned to you. Please wait for review and don't hesitate to grab another issue in the meantime!

[exezbcz]

its still showing the wrong color text color

[daiagi]

its still showing the wrong color text color

Done

[yangwao]

Hey, I guess we should more likely use scoped CSS than !important ?

@daiagi hey try your best and I'm willing raise bounty for this 😎

[roiLeo]

Hey, I guess we should more likely use scoped CSS than !important ?

[daiagi]

Hi guys
I didn't use scoped CSS
but i simplified _light.scss, removed dead css and removed !important

Visual Differences:
⚡ hover color on explore and on chain select (it was missing before)

⚡ text color in drop downs, as requested:

[roiLeo]

FYI there are sass variables that can be defined

[daiagi]

FYI there are sass variables that can be defined

Very good tip. thank you
unfortunately it only works if the variables are defined in global scope.

this doesn't work:

@import "abstracts/variables";
@import "abstracts/animations";
@import "abstracts/fonts";


html.light-mode{
    $navbar-item-color: $text-light-theme;
    $navbar-item-hover-color: $primary-light;
}


// FRAMEWORK (note: don't move this on top)
@import "~bulma";
@import "~buefy/src/scss/buefy";
@import "~@oruga-ui/oruga/src/scss/oruga";

[exezbcz]

not sure whether its related to this issue but in the deploy preview the color of text in wallet dropdown is incorrect

[codeclimate]

Code Climate has analyzed commit 203a8d9 and detected 0 issues on this pull request.

View more on Code Climate.

[daiagi]

not sure whether its related to this issue but in the deploy preview the color of text in wallet dropdown is incorrect

Jesus... how the ### did i miss that?!
it's fixed
sorry for wasting your time 😞

[yangwao]

lal nice identicon! love it

I mean, let's put it out to beta
pay 80 USD for extra will and quick reactions!

[yangwao]

oh need to replenish payout stuff >.>

[yangwao]

pay 80 usd

[yangwao]

😍 Perfect, I’ve sent the payout
💵 $80 @ 24.11 USD/KSM ~ 3.318 $KSM
🧗 EfmnRhHaQqfT3phm4cUCHCU3gFVDoSPR1U9WXzMRQBMqZ4L
🔗 0xdb9a64798e82ae71bf6afc5a4581af5d5ec0e6abf6dbdc6c2c641a949a04d202

🪅 Let’s grab another issue and get rewarded!
🪄 github.com/kodadot/nft-gallery/issues