Declarations with CSS

20th of January 2025

• interactive behaviour being invented for the browser.
• Showing a lot of stuff that is hidden by default: script { display: none
• Clip path: what draws the shape through coordinates
• gsap.com
• Interpolation
• Repainting: changing the look of the page
• Reflow - look up definition
• webkit- is a browser engine, every browser has a render engine (browser engine) that renders css declaration (text) into visual, pixel (chromes render engine is called -webkit-, other browsers like brave use chromes render engine too, that means that a CSS property is interpreted exactly the same) there are only a few notable browser engines, webkit (chrome, safari) and gecko (mozilla)
• webkit- used in CSS is a prefix this is added when properties are not in the standard yet (but are in the browser engine) -> by the time W3C decides to take it into the standard, you can use property without prefix (for retro compatibility, property with prefix will still be working)
• every browser engine has its own prefix: firefox has -moz- 
• Martina: css companion page with a text by Imre: she used CSS property clip-path to create an animation between shapes. shapes are made from a path with anchor points (polygon), but clip path can also be used with url(.svg)
• interpolation with CSS happens not so much by algorithm but you have to manually add or remove points to have a  transition between shapes (but there are libraries that have smarter algorithms, like GSAP https://gsap.com/)
• repaint event happens when a page has to reload what was already there (often happens with image loading), you ideally want to have everything loading on one first page load
• https://pad.xpub.nl/p/declarative-companions
• https://four.otherti.me/s/

- https://otherti.me/

Display:

• "Display" describes if and/or how an element appears on the site relatively to other elements. This can be used to arrange or lay out more than one element at once. We usually use one display keyword per element (or group of elements), and different keywords can coexist on the same page.
• Constraints
• The formatting of the information that is being communicated
• Doriane was talking about/ asking about our preferred social media platforms. She described how these platforms are used locally, you can view them on the map/ see where they are mostly used and said that “Tools are culturally situated”.
• https://lurk.org/
• Mastodon
• https://sunny.garden/explore/tags
• https://nettime.org/
• Dina kelberman, I’m google

13th of January 2025

• CSS giving up its control - given the context of the execution.
• Visual and gestural approach to CSS.
• Designing with web standards is more natural to describe than actually executing it.
• Styling context in order to produce content.
• Designing with language.

Note to keep in mind: document anything which reminds you of display, position, block, line and grid.