KapteynUniverse
@KapteynUniverseAll solutions
Browser Extensions Manager UI
#accessibility#react#tailwind-css#typescript#viteSubmitted 4 days agoAny feedback is appreciated. Is there a way to change only the text color of the logo SVG, or is the dark mode logo missing? Also, is there a better way to fetch data, toggle states, and handle dark mode?
Product List w/ Cart
#accessibility#react#vite#typescriptSubmitted 15 days agoAny feedback is appreciated. I’m not sure about my aria-live and description list usage.
Real-time and partly CRUD interactive comment section
#accessibility#react#tailwind-css#firebaseSubmitted 4 months agoI wrote my answers in the comments, but again, any feedback is appreciated.
Sign-Up Form
#accessibilitySubmitted 4 months agoAny feedback is appreciated. Probably white texts on the light red background also has bad contrast but i can't see that on the dev tools.
Space tourism with some custom animations + framer motion
#accessibility#framer-motion#react#react-router#tailwind-cssSubmitted 4 months agoAny feedback is appreciated.
I feel like there is a way to create a reusable component for all pages to avoid redundancy, but I couldn’t manage it due to differences in order and styling.
I wasn’t sure whether to use the or tag for the numbers on different pages. Since screen reader users will already know what page they’re on, I went with .
I am very beginner to the React. Is the folder structure good?
Sunnyside Landing Page
#accessibility#animationSubmitted 5 months agoI tried using the tag for the modal in the final stage, but it caused styling issues that i couldn't fix, so i switched back.
Any feedback is appreciated. Please tell me anything to improve or if i missed something.
E-Commerce Product Page
#accessibility#animationSubmitted 5 months agoAny feedback is appreciated.
Just found a bug before posting, it is possible to focus some hidden element and modal with tab button.
Landing Page
Submitted 5 months agoAny feedback is appreciated but i would especially like to get feedback about accesibility, semantics and grid.
NFT Card Component
#tailwind-css#accessibilitySubmitted 5 months agoAny feedback is appreciated but i would like to get feedback about accesibility and semantics. Also i can see font family is correct on computed tab of the dev tools and can toggle on styles but for some reason on console there is a 404 error for the font.
News Homepage
Submitted 6 months agoI would like to get feedback about grid (had some troubles with imgs), accesibility and semantics. I didn't put aria-labels to anchor elements (except the read more button) because i tought they have enough text information inside them. Is that a right approach?
Also one thing i couldn't manage is when the navigation bar opened, it is possible to focus background elements like read more button, news. with tab key, which i do not want.
Contact Form
Submitted 6 months agoI would like to see feedback about accessibility. There are a lot to digest in this learning path.
Time Tracking Dashboard
Submitted 6 months agoI think only thing i couldn't manage is to change the background color of the card to the initial state when hovering the ellipsis icon.
Newsletter Sign Up
Submitted 6 months agoI like to do these basic validations with css instead of js but this time, this doesn't work. I couldn't figure out the reason
input { position: relative } input:not(:placeholder-shown):invalid::after { content: "Valid email required"; height: 16px; width: 16px; position: absolute; top:0; right:0; }
Article Preview
Submitted 6 months agoI think i am having trouble with images all the time. Couldn't adjust text section height like %70 of the card because img height didn't reduce (
height = 100%
wasn't there at start ) Tried flex .3, max-height etc. Also couldn't find how to crop img either. Maybeoverflow = hidden
would work normally but here i used flex.Testimonial Grid Section
Submitted 6 months agoNeed to work on grid more. Any feedback is appreciated
Product Card Component
Submitted 6 months agoFor the "PERFUME" word i used figcaption tag first but couldn't figure out how to put it right side on the desktop version.
Fifth Challenge: Sign-Up Form
Submitted 7 months agoAre there range norms for media queries or it depends for every project? While doing this challange my approach felt very wrong.
Fourth Challenge: Interactive Rating Component
Submitted 7 months agoEven tho i tried some deg values, couldn't manage to get exact gradient background.