📚 node [[css]]

Cool tricks with CSS.

Codepens

https://codepen.io/Mamboleoo/pen/MWyNZYr rainbow hypercube https://codepen.io/jh3y/pen/LYNZwGm impossible checkbox https://webdevtrick.com/html-css-glitch-effect/ https://codepen.io/jh3y/pen/yLYXVJa -- snorlax https://codepen.io/a-trost/pen/BaoZgaK -- neat animation! https://codersblock.com/blog/using-css-to-control-text-selection/ -- using css to control text selection https://codepen.io/lukes611/pen/dyyYXqP -- Tamagochi!!! https://codepen.io/KilledByAPixel/pen/BaowKzv -- synth https://codepen.io/YusukeNakaya/pen/dyYzRVx snakes, airpods or something https://codepen.io/fossheim/pen/jObGxQQ nintendo switch through only css https://codepen.io/chrisgannon/pen/RwWVJWd this man is rolling https://codepen.io/chris22smith/pen/wvKqMOR -- make new fish! https://codepen.io/jordirue/pen/NWGjwzz https://codepen.io/collection/njYZRV image hovers! https://codepen.io/RominaMartin/pen/OJVdvRm -- cool blood donation UI! https://codepen.io/pavlovsk/pen/OJymPmd tree generation https://codepen.io/pavlovsk/pen/OJymPmd -- braun radio design in css https://codepen.io/KilledByAPixel/pen/abvqydY bloodflow codepen! https://codepen.io/jkantner/pen/vYNRdJL catbread! https://codepen.io/jkantner/pen/vYNRdJL https://codepen.io/hailedev/pen/OJyvvVQ minecraft in css https://codepen.io/cobra_winfrey/pen/LYpeKrd flowing letters !! https://codepen.io/wendko/pen/jObajYq choosing cats ! https://codepen.io/cybercountess/pen/gOaoWmX isabelle's day off https://www.virtualgoodsdealer.com/: copy the css from this page. it's what i want to emulate the mac windows!!!! john carmack's archive lasso reg amenity detection this word not exist blog i like the look of this week's finds ! cool content! wp blog for above https://codepen.io/toshiya-marukubo/pen/oNbgPRX neat orbit thing https://codepen.io/oliviale/pen/BaoXOOP fake newspaper ! https://thomaspark.co/2020/06/the-mad-magazine-fold-in-effect-in-css/ mad magazine folding simulation! https://www.simplified.guide/ssh/disable-timeout ssh timeout :: good reference.

https://shibumi.dev/posts/ good blog, some useful information and things to learn here https://www.tessera.li/ math visualizations in js

https://avanier.now.sh/ i love this website https://avanier.now.sh/w/bucket.html make a bucket list ! https://avanier.now.sh/w/glossary.html words i like https://avanier.now.sh/w/links.html curated links and resources https://avanier.now.sh/w/orion.html programming on android? https://avanier.now.sh/w/navire.html use all of these technologies -- check them out! https://avanier.now.sh/w/natalie.html very cool; look into bringing this to class instead of a laptop for taking notes! https://avanier.now.sh/w/navire.html please do use this style for a website. http://evenunto.net/ yooo https://hraew.autophagy.io/ project and personal information repostiory. very cool interface https://hraew.autophagy.io/antimber/ very cool; a uniform switch for theming and system configuration that integrates with a set of personal preferences https://kaemura.com/ incredible website and experiments https://avanier.now.sh/w/work.html incredible interface https://avanier.now.sh/w/holly.html computer console; used as a portable ocmputer at school? very cool! https://avanier.now.sh/w/rabbit.html great idea https://avanier.now.sh/w/josh.html i love this https://avanier.now.sh/w/malin.html firefox theme? https://anxl.faith/ nut my pants https://heracl.es/ cool projects found below; navigation of films, diy kit for router, etc https://shards.lectronice.com/ this is pcool. https://ellugar.co/ mexican game developer! https://shoelace.style/ a minimal css starter kit latex in css! responsive css framework relearn css layout """Esoteric"" ""Programming"" ""Language"" transpiler for converting SQL to CSS "

fun css

slider inherit! wow animation! pinboard Windows 95 UI Kit and Windows 95 UI Kit brainrape/win95.css: Responsive Bootstrap 4 windows 95/98 theme & landing t Ten modern layouts in one line of CSS Tailwind Toolbox - Free Starter Templates and Components for Tailwind CSS

simple css line hover animations for links!

Convention

Don't use Margin

Don't use Margin Margin breaks component encapsulation because components impact everything surrounding them and external to them. It also makes reusability difficult and impacts external components. The stack component, similar to other spacer components, is useful for adding arbitrary spaces internal to and external from different components. THese help define discrete units for space as well which can be standardized across the application.

vulnerabilities

saizai/cssfingerprint: a research project to see how well the CSS history hack can fingerprint a user all of the different CSS easing functions https://codepen.io/MrBlank/pen/JjXxovL cool css animation with envelope opening https://tympanus.net/codrops/2020/10/05/recreating-the-100-days-of-poetry-effect-with-shader-scrolltriger-and-css-grid/ https://polypane.app/css-3d-transform-examples/ count in CSS

Security

Do not blindly copy paste

source

In this code segment, it's trivial to hide the truth of the text that's being copied, thus resulting in a blind paste into terminal being malicious:


fuck

One way the author recommends safe pasting is via this command:

alias prepaste='builtin fc -e "vim -c %d -c \"set paste\""'

This opens the line pasted in vim before sending it to the browser, encouraging you to preview and edit it.

css modules: https://github.com/css-modules/css-modules. a specification and convention for how we should interface with CSS.

CSS, short for //Cascade Style Sheet//, is a good companion for [[HTML]].

= Links => https://www.artlebedev.ru/colors/ | Таблица «безопасных» цветов

Цвета из нашей палитры везде будут отображаться правильным образом и без искажений. Любой из 216 цветов «безопасной» палитры может быть использован для графики, текста и фонов. Ограниченный список цветов. Поможет, когда важна совместимость с плохими экранами. Почти всегда, то есть.

=> https://warmedal.se/~bjorn/posts/2021-11-13-default-browser-styles.html | Björn: Default Browser Styles

Apart from that I rely very much on how browsers present my site, from the default font and size to the paragraph distance and the emoji set used. HTML was actually made to be responsive. It's a reflowing format that theoretically works on any screen size. But of course that won't be the case when there's things like sidebars or banners and stuff. And there pretty much always is.

=> https://www.joshwcomeau.com/css/surprising-truth-about-pixels-and-accessibility/ | The Surprising Truth About Pixels and Accessibility

The truth is, if you want to build the most-accessible product possible, you need to use both pixels and ems/rems. It's not an either/or situation. There are circumstances where rems are more accessible, and other circumstances where pixels are more accessible.

Receiving pushes... (requires JavaScript)
Loading context... (requires JavaScript)
📖 stoas (collaborative spaces) for [[css]]