All solutions

Any feedback is appreciated

Accessible accordion.

Please critique how accessible my accordions are + review markup, css, and javascript . thanks!

i added an extra little feature that lets you choose if you want to have one accordion open at a time or not.

there's an accessibility issue with the design with color contrast. normally i would ask the client/designer to change but i think it's ok since this is just practice.

any critiques are apprecieated

used local storage to persist themes as well as saving your last inputs/results

please test, critique, and anything else. thanks!

i messed around with the url for this project. so whenever the user enters something in the search bar and submits, the search gets added to the url. so, whenever the user refreshes the same page will come up. did the same thing with the theme changer.

what do you guys think? any tips/critiques are much appreciated.

couldn't match up the text to the design :'(

any thoughts or critiques are much appreciated

how would you animate the advice text every time you fetch it? for example i wanted the advice to slide in from the left each time the button is clicked, but i can't seem to do it.

first project in the junior section after doing a bunch of newbie ones.

any critique would be much appreciated!!!!

let's go

How did you guys do the middle section with the phone and textbox? i feel like i took a super convoluted approach lol i.e used flex in desktop with some margins, then i set the phone img to absolute positioning in medium sized screens, and then finally removed the absolute positioning and did flex-direction: column on mobile.

couldn't match the text with the design no matter how hard I tried :'( guess i failed in matching my solution with the design. feels bad man.

pros / cons please.

I had one issue with the footer, specifically with the background img blending with the cyan color. how did you guys do it?

this is what i did: background-image: url("./assets/desktop/image-footer.jpg"); background-size: cover; background-position: center; background-color: #4d96a9; background-blend-mode: multiply;

yeah, i didn't get the images working right, but least the accordion is on point

how's my javascript, fellas? tried to make it as reusable as possible.

some troubles with this one

1. for the cards, how do i keep all of the cta buttons to the bottom consistently? some cards the text is longer than others so that leads to inconsistent placement for the cta

2. would it be ok to wrap a div around all my elements(nav, main, footer) to act as a container? it'd help me make me write less code.

whattya think, boys?

how do i do responsive imgs when i'm using background-image? i couldn't figure it out so i just had to do <img/> instead and thus the weird overlay color.

sure it worked with absolute units, but the background-image wouldn't show up if i used max-width or percents.

pros/cons please. go hard as possible on my code. also how's my accessibility? is my semantic html all good?

when using css grid, the content starts to overflow on screens less than 375px. one solution i suppose is overflow:hidden but the content starts to disappear. any tips here?

i solved it by using flex and flex-direction: column and it starts scaling nicely on smaller screens, but i was wondering if there was a css grid approach to this

pros and cons of my css please.

critique me. i dare you

is my Js good? how can i make it better?

Please critique my CSS. any tips and tricks would be much appreciated

Please critique my css