How to override SASS variable with @include meta.load-css()?
My PWA adjusts the variables in a .scss
file like this:
How can I loop through my media query mixin to produce some grid column start and end
I’m struggling with a SCSS mixin to apply grid-column-start
and grid-column-end
based on some predefined breakpoints with media queries. I can loop through without the media query for the desired result in outputting 1 from 12 but how can I also use the same @each
loop to loop through my media query sc
mixin?
How to ‘re-export’ @use … with vars from a SASS partial
I have a situation where I am using @use ... with
to load styles from a component library and customise some of the values
How to simulate a Gaussian shadow with CSS gradients, using SASS?
I want to make an SCSS function that creates gradient color stops that transition between two colors, using a Gaussian curve. This would be useful to simulate things like shadows and glows where box-shadow
can’t do the job or is not ideal (for example, masks).
about scss variable references?
I have three files: a.scss,b.scss,c.scss;
The relationship between these three files:
c @use b as *
b @use a as *
How to define a variable in @each block (according to other variable name)?
$colors: ( red: “red” ); @each $key, $value in $colors { $key: $value; } I want to be able to define a scss variable $red: “red”;, but it failed. Or is there any way to destructure $colors? sass
Does scss have a function similar to js Array.prototype.find()?
I have a nest map and want to use a value to find the object and return an object
Image base path not taking in sass
we are using sass nowadays. here when we tried to add src img path like “/us/products/sites/default/files/2024-05/error-invalid_3.png” which is in dam not taking getting error in map.js file
SassError: Module loop: this module is already being loaded
I have the following SASS directory structure:
SASS variable generation with looping
I am thinking on an approach:
I have 5 fonts I am using, for precise approach, two Poppins and three Nunito. Nunito with 3 font-weight values, and Poppins is with two. I can generate 5 classes using them as variables, that is a basic step to say so. But with it, I have to create classes, update the Angular templates, or create more classes and use extend, etc… I was thinking and since I am making a lot of mixins and similar functional staff.. something came to my mind.
Is it possible to create re-usable variable declarations with mixins-loops-functions in SASS? I was not able to find proper answer to my question but I am deeply intriguied. Anyone here could answer my question or point to some direction with possible solutions maybe?