NeoSkeleton to tailwindcss

[shashkovdanil]

Thank you for your contribution to the KodaDot - One Stop Shop for Polkadot NFTs.

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

PR Type

• Bugfix
• Feature
• Refactoring

Context

• Closes Migration UI kit to tailwindcss #8222
• Requires deployment <snek/rubick/worker>

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

Optional

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

Did your issue had any of the "$" label on it?

• Fill up your DOT address: Payout

Community participation

• Are you at KodaDot Ecosystem Telegram?

Screenshot 📸

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

Copilot Summary

🤖[deprecated] Generated by Copilot at 71d8568

Refactored the NeoSkeleton component to use tailwind.css instead of custom SCSS code, and updated the tailwind.config.js and tailwind.scss files to support opacity variations and theme compatibility for the skeleton component.

🤖[deprecated] Generated by Copilot at 71d8568

We're heaving away with Tailwind CSS
We're making our skeletons look the best
We're changing the colors and the themes
We're working as one, a mighty team

[kodabot]

WARNING @shashkovdanil PR for issue #8222 which isn't assigned to you. Please be warned that this PR may get rejected if there's another assignee for issue #8222

[netlify]

✅ Deploy Preview for koda-canary ready!

Name	Link
🔨 Latest commit	5276116
🔍 Latest deploy log	https://app.netlify.com/sites/koda-canary/deploys/658027fb3eaa7e00087b5447
😎 Deploy Preview	https://deploy-preview-8541--koda-canary.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 configuration.

[reviewpad]

AI-Generated Summary: This pull request transitions the UI from NeoSkeleton SCSS to the tailwind CSS framework. In the process, it removes the skeleton gradient function in the NeoSkeleton SCSS and replaces it with equivalent functionality using tailwind utilities. The color variables in the tailwind configuration file and SCSS file have also been updated to support this transition. Net changes include 12 additions and 27 deletions across 3 files.

[prury]

overall they are a bit brighter on deployed than on canary, both on dark/white mode, other than that looks ok
if @exezbcz is ok with it, let's go

[exezbcz]

did you add version for dark mode?

[shashkovdanil]

@exezbcz yes I did

[codeclimate]

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

View more on Code Climate.

[sonarqubecloud]

Quality Gate passed

Kudos, no new issues were introduced!

0 New issues
0 Security Hotspots
No data about Coverage
0.0% Duplication on New Code

See analysis details on SonarCloud

[roiLeo]

overall they are a bit brighter on deployed than on canary, both on dark/white mode, other than that looks ok

did you change something related to color?

[shashkovdanil]

No, I used the same colors, you can see it in the code

[shashkovdanil]

linear-gradient(90deg, rgb(219, 219, 219) 25%, rgba(219, 219, 219, 0.5) 50%, rgb(219, 219, 219) 75%) it's computed styles in this branch

linear-gradient(90deg, rgb(219, 219, 219) 25%, rgba(219, 219, 219, 0.5) 50%, rgb(219, 219, 219) 75%) it's computed styles in main branch

It's the same

[prury]

@roiLeo @shashkovdanil

[yangwao]

Thanks!
pay 30 usd

[yangwao]

😍 Perfect, I’ve sent the payout
💵 $30 @ 6.47 USD/DOT ~ 4.637 $DOT
🧗 16SpvdDgKNiQ3c53DxX7refnQcKUD3uRNim3Z1HBJLNGrtSP
🔗 0x8df44beeb2b87821b45d07f3cd78585065cd2421b2de4d928bdfb8a382a82627

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

[yangwao]

@prury feel free to make follow up

[prury]

@prury feel free to make follow up

only if @exezbcz thinks color change was significant