skinnyK
KPCKevin Powell - Community
•Created by Disco on 6/23/2023 in #front-end
Is there anything wrong with defining custom variables in html instead of :root?
But it does give context to how custom variables can be used.
Thanks for the feedback 👌
7 replies
KPCKevin Powell - Community
•Created by Satya on 6/20/2023 in #front-end
Styling sibling elements on hover
Be careful with :has firefox is only using it when the user has it flagged
Caniuse.com
29 replies
KPCKevin Powell - Community
•Created by Sushi34 on 6/23/2023 in #front-end
Responsive design
Do you have a design file? For example figma
5 replies
KPCKevin Powell - Community
•Created by Disco on 6/23/2023 in #front-end
Is there anything wrong with defining custom variables in html instead of :root?
Another option is locally defined variables.
Easier to tweak with js for example.
7 replies
KPCKevin Powell - Community
•Created by Kashimoto on 6/22/2023 in #front-end
Automatic scroll for showcase
This one is unfortunately not from Mr. Powell. But with js
https://youtu.be/yq4BeRtUHbk
55 replies
KPCKevin Powell - Community
•Created by Kashimoto on 6/22/2023 in #front-end
Automatic scroll for showcase
55 replies
KPCKevin Powell - Community
•Created by Kashimoto on 6/22/2023 in #front-end
Automatic scroll for showcase
That stuff gets a lot easier to manage with js, but you can get creative with different selectors and pseudo classes.
Kevin nailed it in the video @kashimotoo linked to
55 replies
KPCKevin Powell - Community
•Created by Kashimoto on 6/22/2023 in #front-end
Automatic scroll for showcase
You can have multiple anchortag/id relationships.
55 replies
KPCKevin Powell - Community
•Created by Kashimoto on 6/22/2023 in #front-end
Automatic scroll for showcase
You can tweak it to your liking. Kevin does a trick with z-index and :target pseudoclass I think.
The takeaway should be how the anchor tags are working with the id that you are scrolling to
55 replies
KPCKevin Powell - Community
•Created by Kashimoto on 6/22/2023 in #front-end
Automatic scroll for showcase
yes. it is a reset.
also you need all three selectors because the "*" selector does not apply to pseudo elements
also you need all three selectors because the "*" selector does not apply to pseudo elements
55 replies
KPCKevin Powell - Community
•Created by Kashimoto on 6/22/2023 in #front-end
Automatic scroll for showcase
55 replies
KPCKevin Powell - Community
•Created by Kashimoto on 6/22/2023 in #front-end
Automatic scroll for showcase
55 replies
KPCKevin Powell - Community
•Created by Kashimoto on 6/22/2023 in #front-end
Automatic scroll for showcase
There is also a vertical snapp with using href which can be annoying
55 replies
KPCKevin Powell - Community
•Created by Kashimoto on 6/22/2023 in #front-end
Automatic scroll for showcase
On my way home from work. Will put a codepen here
55 replies
KPCKevin Powell - Community
•Created by Kashimoto on 6/22/2023 in #front-end
Automatic scroll for showcase
But will not be as smooth as using js to just translateX with js.
55 replies
KPCKevin Powell - Community
•Created by Kashimoto on 6/22/2023 in #front-end
Automatic scroll for showcase
You can use an href to scroll with only css. If your arrows are anchor Tags that have the id of what you want to scroll to is the href.
55 replies
KPCKevin Powell - Community
•Created by Avinash on 3/11/2023 in #front-end
[Responsive design] [browser is not reducing in width]
F12
8 replies
KPCKevin Powell - Community
•Created by Avinash on 3/11/2023 in #front-end
[Responsive design] [browser is not reducing in width]
Looks like you are not in responsive mode? Looks like you are just changing the window size of the browser.
8 replies
KPCKevin Powell - Community
•Created by skinnyK on 2/23/2023 in #front-end
:checked deep dive
#noted
14 replies
KPCKevin Powell - Community
•Created by skinnyK on 2/23/2023 in #front-end
:checked deep dive
Ok. I disagree, but i see your point.
14 replies