toad.social is one of the many independent Mastodon servers you can use to participate in the fediverse.
Mastodon server operated by David Troy, a tech pioneer and investigative journalist addressing threats to democracy. Thoughtful participation and discussion welcome.

Administered by:

Server stats:

218
active users

#SCSS

0 posts0 participants0 posts today
Ana Tudor 🐯<p>Because someone just hearted a 5 year old <span class="h-card" translate="no"><a href="https://fosstodon.org/@codepen" class="u-url mention" rel="nofollow noopener" target="_blank">@<span>codepen</span></a></span> demo <a href="https://codepen.io/thebabydino/pen/GRooBJm?editors=0100" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">codepen.io/thebabydino/pen/GRo</span><span class="invisible">oBJm?editors=0100</span></a> I made using a <a href="https://mastodon.social/tags/Sass" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>Sass</span></a> function + looping to generate a <a href="https://mastodon.social/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>CSS</span></a> 🌈: we don't need *any* Sass for this anymore! 🎉</p><p>We can now do it with</p><p>background: <br> linear-gradient(in hsl longer hue 90deg, <br> hsl(0, 95%, 65%) 0 0)</p><p><a href="https://mastodon.social/tags/SCSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>SCSS</span></a> <a href="https://mastodon.social/tags/loop" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>loop</span></a> <a href="https://mastodon.social/tags/looping" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>looping</span></a> <a href="https://mastodon.social/tags/newCSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>newCSS</span></a> <a href="https://mastodon.social/tags/rainbow" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>rainbow</span></a> <a href="https://mastodon.social/tags/cssGradient" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>cssGradient</span></a> <a href="https://mastodon.social/tags/coding" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>coding</span></a> <a href="https://mastodon.social/tags/code" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>code</span></a> <a href="https://mastodon.social/tags/frontend" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>frontend</span></a> <a href="https://mastodon.social/tags/web" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>web</span></a> <a href="https://mastodon.social/tags/dev" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>dev</span></a> <a href="https://mastodon.social/tags/webDev" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webDev</span></a> <a href="https://mastodon.social/tags/webDevelopment" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webDevelopment</span></a> <a href="https://mastodon.social/tags/hueInterpolation" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>hueInterpolation</span></a></p>
Jay 🆘<p>I preferred Neat personally <a href="https://social.coop/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>CSS</span></a> <a href="https://social.coop/tags/SCSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>SCSS</span></a></p>
Jay 🆘<p>Which if any of these <a href="https://social.coop/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>CSS</span></a> / <a href="https://social.coop/tags/SCSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>SCSS</span></a> grid libraries did you use before flex and grid became widely adopted?</p>
Tykayn<p>mes blogs sont faits avec <a href="https://mastodon.cipherbliss.com/tags/orgmodeToGemini" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>orgmodeToGemini</span></a> un outil maison qui transforme mes pages au format orgmode en un blog html statique naviguable par tags. Plusse d'infos dans le readme.</p><p><a href="https://forge.chapril.org/tykayn/orgmode-to-gemini-blog" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">forge.chapril.org/tykayn/orgmo</span><span class="invisible">de-to-gemini-blog</span></a></p><p><a href="https://mastodon.cipherbliss.com/tags/orgmode" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>orgmode</span></a> <a href="https://mastodon.cipherbliss.com/tags/blog" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>blog</span></a> <a href="https://mastodon.cipherbliss.com/tags/staticgenerator" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>staticgenerator</span></a> <a href="https://mastodon.cipherbliss.com/tags/scss" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>scss</span></a> <a href="https://mastodon.cipherbliss.com/tags/python" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>python</span></a> <a href="https://mastodon.cipherbliss.com/tags/pandoc" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>pandoc</span></a></p>
Christophe<p>There is a nice tool to explore your mastodon archive called <a href="https://toots.niark.nexus/tags/MARL" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>MARL</span></a> </p><p>You can also get some insight on your interactions, like who do you boost the most or what hashtag you use the most.</p><p><a href="https://s427.github.io/MARL/dist/index.html" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">s427.github.io/MARL/dist/index</span><span class="invisible">.html</span></a></p><p>Thanks to <span class="h-card" translate="no"><a href="https://lou.lt/@s427" class="u-url mention" rel="nofollow noopener" target="_blank">@<span>s427</span></a></span> for making such a neat thing !</p><p><a href="https://toots.niark.nexus/tags/archive" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>archive</span></a> <a href="https://toots.niark.nexus/tags/mastodon" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>mastodon</span></a> <a href="https://toots.niark.nexus/tags/openSource" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>openSource</span></a> <a href="https://toots.niark.nexus/tags/tool" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>tool</span></a> <a href="https://toots.niark.nexus/tags/web" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>web</span></a> <a href="https://toots.niark.nexus/tags/javascript" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>javascript</span></a> <a href="https://toots.niark.nexus/tags/js" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>js</span></a> <a href="https://toots.niark.nexus/tags/dev" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>dev</span></a> <a href="https://toots.niark.nexus/tags/fedi" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>fedi</span></a> <a href="https://toots.niark.nexus/tags/scss" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>scss</span></a></p>
Marijke Luttekes<p>People who replaced their SCSS stylesheets with regular CSS:</p><p>Do you still use `@import`, or put all the CSS lines into a single file, or use another approach entirely?</p><p><a href="https://fosstodon.org/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>CSS</span></a> <a href="https://fosstodon.org/tags/SCSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>SCSS</span></a> <a href="https://fosstodon.org/tags/WebDev" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>WebDev</span></a></p>
William Killerud<p>Excited to share that the Some Sass language server now has support for the indented syntax 🥳 </p><p><a href="https://github.com/wkillerud/some-sass#readme" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">github.com/wkillerud/some-sass</span><span class="invisible">#readme</span></a></p><p><a href="https://social.lol/tags/sass" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>sass</span></a> <a href="https://social.lol/tags/scss" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>scss</span></a> <a href="https://social.lol/tags/lsp" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>lsp</span></a></p>
Michal Bryxí 🌱<p>I'm now contributing to a project that uses <a href="https://veganism.social/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>CSS</span></a> / <a href="https://veganism.social/tags/SCSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>SCSS</span></a> for styling. Coming from a place / projects that have exclusively used <a href="https://veganism.social/tags/TailwindCSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>TailwindCSS</span></a> for past ~3 years: This is a nightmare. The guesswork of "what happens if I do X" is equivalent to playing a minesweeper on an expert mode. And I have to constantly switch focus between N files to hopefully make sense of what is that one line of HTML going to look like.</p>
Justin Ferrell<p>I’ve been opposed to our team using any kind of build system for our <a href="https://mastodon.social/tags/Wordpress" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>Wordpress</span></a> theme work. Wherever possible, we write code and that code “ships” as written. My one exception is WP SCSS, a Wordpress plugin for compiling SCSS to <a href="https://mastodon.social/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>CSS</span></a> on the server side. It has options for compression level and mapping, etc. and even conditional compiles to only regenerate styles when the <a href="https://mastodon.social/tags/SCSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>SCSS</span></a> directory has been modified. </p><p><a href="https://github.com/ConnectThink/WP-SCSS" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">github.com/ConnectThink/WP-SCS</span><span class="invisible">S</span></a></p>
Nicol Wistreich<p>For years I've resisted <a href="https://social.coop/tags/SCSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>SCSS</span></a>/#SASS, often from an instinctive sense it's Javascript devs trying to make <a href="https://social.coop/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>CSS</span></a> javascripty, rather than learning to write CSS minimally. Or worse to create an expertise ringfence around something open &amp; easy.</p><p>Today had a perfect example.</p><p>57 lines of SCSS that I would normally have written as 20 lines or less of CSS…</p><p>The advance of the CSS spec to include calc, variables, container queries, conditionals and now nesting makes SCSS/SASS really hard to justify imho.</p>
Mike-麥-Mai-v1.618 😎<p>Hey CSS gurus, is there a way to do transparency with <a href="https://mastodon.social/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>CSS</span></a> var right now? I am kind of hacking it.</p><p>```<br>$brandcolor: cyan;</p><p>:root {<br> --brandcolor: $brandcolor;<br>}</p><p>.transparent-element {<br> background: rgba($brandcolor, 0.5);<br>}<br>```</p><p><a href="https://mastodon.social/tags/WebDev" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>WebDev</span></a> <a href="https://mastodon.social/tags/scss" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>scss</span></a></p>
Joseph Kohlmann<p>Extremely unimpressed with the ways in which Sass integrations seem like a complete afterthought in 2024. Sass is a beautiful, powerful language, made and maintained by smart, caring people. It’s really sad to see it done dirty like this. <a href="https://mastodon.social/tags/Sass" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>Sass</span></a> <a href="https://mastodon.social/tags/SCSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>SCSS</span></a> <a href="https://mastodon.social/tags/WebDevelopment" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>WebDevelopment</span></a></p>
Gustavo<p>I've updated vidadelafuerza.com quite a bit. Yesterday (Saturday), I learned how to use <a href="https://hachyderm.io/tags/javascript" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>javascript</span></a> fetch() to GET some pages I had as <a href="https://hachyderm.io/tags/json" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>json</span></a>. The JSON is generated by <a href="https://hachyderm.io/tags/powershell" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>powershell</span></a> listening with Register-ObjectEvent for file changes to <a href="https://hachyderm.io/tags/html" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>html</span></a> in a "parts" folder. I also made all my <a href="https://hachyderm.io/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>CSS</span></a> (back) into <a href="https://hachyderm.io/tags/scss" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>scss</span></a> (sass), and I used a <a href="https://hachyderm.io/tags/nodejs" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>nodejs</span></a> app for a local <a href="https://hachyderm.io/tags/http" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>http</span></a> server to test the fetch(). (Much of this could be powered by a framework, but less is more for this learning / fun project.)</p>
Adrian Gadient-Brügger<p>Dear <a href="https://fediscience.org/tags/Quarto" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>Quarto</span></a> <a href="https://fediscience.org/tags/rstats" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>rstats</span></a> users: I’m trying to write my first custom template/ extension. In some examples I looked at there are <a href="https://fediscience.org/tags/css" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>css</span></a> and <a href="https://fediscience.org/tags/scss" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>scss</span></a> files. </p><p>Can anyone explain me what their purpose and difference is? What should I put in which of them?</p><p>Links to tutorials / documentation are highly welcomed!</p>
devolute<p>Thanks to <span class="h-card" translate="no"><a href="https://mastodon.social/@jimniels" class="u-url mention" rel="nofollow noopener" target="_blank">@<span>jimniels</span></a></span> for this article on setting rgba values from <a href="https://mastodon.social/tags/SCSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>SCSS</span></a> hex values. Saved me from re-writing my entire color system this morning: <a href="https://blog.jim-nielsen.com/2019/generating-shades-of-color-using-css-variables/" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">blog.jim-nielsen.com/2019/gene</span><span class="invisible">rating-shades-of-color-using-css-variables/</span></a></p>
Pez Pengelly<p>It's been on my mind that with all the new features of <a href="https://mastodon.social/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>CSS</span></a> it might be time to migrate away from <a href="https://mastodon.social/tags/SCSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>SCSS</span></a>.</p><p>Problem is I'd like to implement the changes as I go. Historically CSS has worked as a subset but with nesting those rules are broken – <a href="https://sass-lang.com/blog/sass-and-native-nesting/" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">sass-lang.com/blog/sass-and-na</span><span class="invisible">tive-nesting/</span></a> – which means migrating away from SCSS is now an all-or-nothing proposition.</p><p>Has enyone else done this? What are some solutions? I've been looking at <a href="https://lightningcss.dev/" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="">lightningcss.dev/</span><span class="invisible"></span></a> as a potential build replacement</p>
Roni Laukkarinen<p>Doing legacy code... <a href="https://mementomori.social/tags/SCSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>SCSS</span></a> <a href="https://mementomori.social/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>CSS</span></a> <a href="https://mementomori.social/tags/Coding" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>Coding</span></a> <a href="https://mementomori.social/tags/WebDev" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>WebDev</span></a></p>
Dale Emery<p>I've spent most of my vacation catching up on what's new(-ish) in <a href="https://mstdn.social/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>CSS</span></a>, and applying it to my websites. It's all part of my project to move everything from <a href="https://mstdn.social/tags/jekyll" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>jekyll</span></a> to <a href="https://mstdn.social/tags/hugo" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>hugo</span></a>.</p><p>I'm quite surprised to find that, for my relatively simple needs, CSS custom properties do everything I was using <a href="https://mstdn.social/tags/SCSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>SCSS</span></a> for. And 'display: grid’ makes layout so much simpler.</p><p>Kevin Powell's YouTube channel has been very, very helpful: <a href="https://www.youtube.com/@KevinPowell" rel="nofollow noopener" target="_blank"><span class="invisible">https://www.</span><span class="">youtube.com/@KevinPowell</span><span class="invisible"></span></a></p>
Doce :verinb:<p>I'm officially open to work! 🚨 BoostOK</p><p>If you're looking for someone with mad frontend skills and ~5 years EXP, look no further!</p><p>🎨 I love working with <a href="https://bolha.us/tags/typescript" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>typescript</span></a>, <a href="https://bolha.us/tags/svelte" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>svelte</span></a>, <a href="https://bolha.us/tags/react" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>react</span></a> and <a href="https://bolha.us/tags/scss" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>scss</span></a></p><p>🧰 I also have experience with Node.js (SvelteKit, Next, SocketIO, etc)</p><p>🤝 Most of my projects are open-source (link below)!</p><p>If you want to see more of my work or get in touch:</p><p>🌐 Website: <a href="https://doceazedo.com" rel="nofollow noopener" target="_blank"><span class="invisible">https://</span><span class="">doceazedo.com</span><span class="invisible"></span></a><br>💼 LinkedIn: <a href="https://linkedin.com/in/doceazedo" rel="nofollow noopener" target="_blank"><span class="invisible">https://</span><span class="">linkedin.com/in/doceazedo</span><span class="invisible"></span></a><br>🐙 GitHub: <a href="https://github.com/doceazedo" rel="nofollow noopener" target="_blank"><span class="invisible">https://</span><span class="">github.com/doceazedo</span><span class="invisible"></span></a></p><p>Thanks! blobcathearthug</p>
Freeeeeeeeeeeeeeeeeeeeee :ablobfoxbongohyper:‮‮‮‮‮<p><span>I don't understnyad :( </span><a href="https://bz.pawdev.me/tags/css" rel="nofollow noopener" target="_blank">#css</a><span> </span><a href="https://bz.pawdev.me/tags/scss" rel="nofollow noopener" target="_blank">#scss</a></p>