Shiv
@undrthegraveyardAll solutions
⚜️Time Tracking Dashboard⚜️
Submitted 11 months agoI would love some advice on how you guys test your component on different screens to ensure that it's responsive. I do use google dev tools, but I suppose it is not completely cut out for this. This time, I used Mozilla for the first time, and I think it is better than chrome for sure in this regard.
☘️ A Responsive Article Preview Component ☘️
Submitted 12 months agoI would love the community's feedback on accessibility. I have included ARIA labels, alt descriptions, and made it keyboard accessible. 💪🏻
☘️ A Responsive Landing Page with a JS enabled error state.☘️
Submitted 12 months agoI would love your feedback on accessibility. How could I maybe make my code more accessible? ⭐️
💎 Responsive Huddle Landing Page with Alternating Feature Blocks 💎
Submitted about 1 year agoOne specific piece of advice I would like is on accessibility. ☘️
How could I improve my overall code for higher accessibility, I try to put the right HTML semantic elements but still, I think there is much more room for improvement. 😀
🖥️Responsive Fylo Landing Page 🖥️
Submitted about 1 year agoOne specific issue in which I could probably use some help is in the way I declare classes. Whenever I write the HTML code, I end up declaring a lot of classes, and then it becomes an issue to remember them while writing the CSS for it. 😅
🖥️ A responsive and interactive FAQ Design Component 🖥️
Submitted about 1 year agoI have one particular doubt, more like curiosity. Writing @media queries at the end can sometimes feel like double work.
Now, this might sound silly but I'll ask anyway. 😛
To all my experienced developers mates. Is there an alternative practice of writing code that could minimize it, or is it just inevitable? 😅
📈A Responsive Result Card Preview📈
Submitted about 1 year agoI would love to know your opinion. How would you have done it differently (with only CSS)?
HTML Code:
... Reaction 80 / 100 ...continuedCSS Code:
.... card__summary-categories{ display: grid; grid-template-columns: 1fr; gap: 1rem; } .categories{ display: flex; flex-direction: row; justify-content: space-between; align-items: center; border-radius: 0.5rem; width: 100%; padding: 0.8rem 1rem; } .categories-name{ display: flex; flex-direction: row; justify-content: center; align-items: center; gap: 0.75rem; font-weight: var(--fw-medium); } .categories-name .Reaction { color: var(--clr-primary-red); } .categories-name .Memory { color: var(--clr-primary-yellow); } .categories-name .Verbal { color: var(--clr-primary-green); } .categories-name .Visual { color: var(--clr-primary-blue); } #c1{ background-color: hsla(0, 100%, 67%, 0.1); } #c2{ background-color: hsla(39, 100%, 56%, 0.1); } #c3{ background-color: hsla(166, 100%, 37%, 0.1); } #c4{ background-color: hsla(234, 85%, 45%, 0.1); } .categories span{ font-weight: var(--fw-medium); color: var(--clr-dark-gray-blue); opacity: 0.5; } ...✌🏻A Responsive Stats Preview Card Component✌🏻
Submitted about 1 year agoIn my styles.css file, at the end, there is two line of code
.card__image{ order: 2; } .card__content{ order: 1; }The purpose of this was to switch the position of the image and the content on the card. I was wondering is there a better way to implement this into my code more efficiently.
I would really appreciate your feedback as always! 😁
💰 Responsive NFT Card Preview 💰
Submitted about 1 year agoJust one very specific part:
In styles.css, there is a particular section of .nft__overlay, along with its hover interaction code.
I would love to hear your thoughts on how that interaction could have been implemented more efficiently. 😃
💸A Responsive Order Summary Card 💸
Submitted about 1 year agoany general feedback would be appreciated since I don't have a specific thing in my mind
👨🏻💻 Responsive 3-Column Card Component 👨🏻💻
Submitted about 1 year ago- I would love your feedback on maybe could I have used child combinator selectors in a more efficient way.
