Scott and Wes chomp through CSS Mixins and Functions, discussing the latest features making their way into CSS. From Tailwind-like classes to fluid typography, join us as we explore the possibilities and practical applications of these new tools. <a id= "Show_Notes_2"></a>Show Notes <ul> <li class="has-line-data" data-line-start="4" data-line-end="5"> <a href="#t=00:00">00:00</a> Welcome to Syntax!</li> <li class="has-line-data" data-line-start="5" data-line-end="6"> <a href="#t=01:24">01:24</a> Brought to you by <a href="www.sentry.io/syntax">Sentry.io</a></li> <li class="has-line-data" data-line-start="6" data-line-end="7"> <a href="#t=03:00">03:00</a> CSS Is getting Functions and Mixins!</li> <li class="has-line-data" data-line-start="7" data-line-end="8"> <a href="https://css.oddbird.net/sasslike/mixins-functions/">CSS Mixins and Functions Explainer</a></li> <li class="has-line-data" data-line-start="8" data-line-end="9"> <a href= "https://github.com/w3c/csswg-drafts/issues/9350#issuecomment-1939628591"> CSS Working Group Discussion</a></li> <li class="has-line-data" data-line-start="9" data-line-end="10"> <a href="#t=06:19">06:19</a> Functions and mixins, how are they different?</li> <li class="has-line-data" data-line-start="10" data-line-end="11"> <a href="#t=07:26">07:26</a> Don’t get hung up on the syntax, or maybe do.</li> <li class="has-line-data" data-line-start="11" data-line-end="12"> <a href="#t=09:12">09:12</a> CSS Functions.</li> <li class="has-line-data" data-line-start="12" data-line-end="13"> <a href="#t=12:02">12:02</a> Some use-cases.</li> <li class="has-line-data" data-line-start="13" data-line-end="14"> <a href="#t=15:58">15:58</a> CSS Mixins.</li> <li class="has-line-data" data-line-start="14" data-line-end="15"> <a href="#t=16:31">16:31</a> Tailwind-like classes.</li> <li class="has-line-data" data-line-start="15" data-line-end="16"> <a href="#t=17:53">17:53</a> Tailwind-like arbitrary syntax.</li> <li class="has-line-data" data-line-start="16" data-line-end="17"> <a href="#t=20:08">20:08</a> Fluid typography.</li> <li class="has-line-data" data-line-start="17" data-line-end="19"> <a href="#t=21:13">21:13</a> Let’s talk about logic.</li> </ul> <a id="Hit_us_up_on_Socials_19"></a>Hit us up on Socials! Syntax: <a href="https://twitter.com/syntaxfm">X</a> <a href= "https://www.instagram.com/syntax_fm/">Instagram</a> <a href= "https://www.tiktok.com/@syntaxfm">Tiktok</a> <a href= "https://www.linkedin.com/company/96077407/admin/feed/posts/">LinkedIn</a> <a href="https://www.threads.net/@syntax_fm">Threads</a> Wes: <a href="https://twitter.com/wesbos">X</a> <a href= "https://www.instagram.com/wesbos/">Instagram</a> <a href= "https://www.tiktok.com/@wesbos">Tiktok</a> <a href= "https://www.linkedin.com/in/wesbos/">LinkedIn</a> <a href= "https://www.threads.net/@wesbos">Threads</a> Scott:<a href="https://twitter.com/stolinski">X</a> <a href= "https://www.instagram.com/stolinski/">Instagram</a> <a href= "https://www.tiktok.com/@stolinski">Tiktok</a> <a href= "https://www.linkedin.com/in/stolinski/">LinkedIn</a> <a href= "https://www.threads.net/@stolinski">Threads</a> Randy: <a href="https://twitter.com/randyrektor">X</a> <a href= "https://www.instagram.com/randyrektor/">Instagram</a> <a href= "https://www.youtube.com/@randyrektor">YouTube</a> <a href= "https://www.threads.net/@randyrektor">Threads</a>

Podurama

Home

Trending

Personal

Your Podcasts

New Episodes

My Files

Favourite Episodes

Tags (Folders)

Recently Played

Bookmarks

Followed Playlists

756: CSS Is Getting Mixins + Functions

Syntax - Tasty Web Development Treats