Category "sass"

Rendering Overlay Containers when theming Angular Material?

According to this tutorial we should be able to add the class needed to render the overlay container that backs Angular Material Select, Snackbar, etc. like thi

SCSS: Getting compilation error when using grid: repeat(auto-fit, minmax(260px, 1fr));

I have valid css grid rule .grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px , 1fr)); } however, the scss compiler brings t

How can I set bootstrap-vue theme colors to css variables?

I'm using bootstrap-vue and would like to be able to override the theme colors dynamically at runtime (after compiling the scss). To do this I'm following this

How to convert these inline style in html into react?

Hi Inside the html people use these kind of styles to animate. I am actually following the pen from alphadex Link. I never see this kind of writing in HTML befo

Node Sass does not yet support your current environment: Windows 64-bit with Unsupported runtime (88)

I have tried to install gulp-sass latest version with npm i gulp-sass --save-dev in the begining I got a lot of errors but later solved them. But whenever I tr

Number of sibling elements in a calculation in SCSS

I'd like to customize an animation in SCSS based on how many sibling elements the animated element has. The full SCSS code is here for reference, however the re

sass merge selectors on ampersand

assuming I have an existing SASS rule like: [dir] .foo { background-image: ...; // ... some more } And I want to add specific behaviors for ltr / rtl lik

Sass is having hard time parsing a CSS RGB syntax

Just plugged in gulp-sass into an existing project, and I'm getting an error when I try to write an RGB syntax as follows: rgb(70 168 255 / 0.05) The log: [17

How to create color shades using CSS variables similar to darken() of Sass?

I'm looking a way of modifying a CSS variable as you would in SCSS Define a color like primary - and automatically I would get shades for focus and actives sta

Browserslist: caniuse-lite is outdated. Please run next command `npm update caniuse-lite browserslist`

Recently, when I compile my scss files I get an error. The error message says: Browserslist: caniuse-lite is outdated. Please run next command npm update ca

what is the correct way to use Sass and React JS?

I have a question. I´m Learning how to use React JS 18v. My question is: what is the best way to use Sass with React? how do you compile it? I don't want

webpack file-loader does not load background image

I've been having this problem for a while and I see that other people have it too, but even though I have the same code as them it is still not working and I do

How to solve unexpected errors from a CSS selector

I am learning SASS. I am trying to make a webpage using SASS. There is some error showing in the CSS file generated from the SASS file. Here is the CSS code: .l

Why don't my class styles apply to dynamically created elements? Angularjs

My question is simple; why don't my class styles apply to dynamically created elements? I am creating a search bar here where I generate an li per matching resu

Error: argument `$color-2` of `mix($color-1, $color-2, $weight: 50%)` must be a color when compile my own bootstrap theme

i try to build my own theme. i change color theme to my style. but i got error when compile my own theme, this is my theme was created. // 1. core variables an

CSS sourceMap with sass-loader, postcss-loader, and MiniCssExtractPlugin in Webpack 5

Seems like I've followed all the instructions to generate CSS source maps, but still not finding them in the output CSS (I expect to see something like /*# sour

Remove Unused CSS on Angular 9 build process

I have an Angular 9 project which I added Bulma on angular.json > projects.projectName.architect.build.options.styles so it bundles up the framework on style

editor.component.scss:17:100: ERROR: Unterminated string token - Angular + Scss

I am getting unterminated string token error in my angular application that uses scss as stringUrl. @import "~bootstrap/scss/bootstrap"; .view-container, .modu

How to assigning multiple properties at a time in SASS, then individual ones?

In SASS for CSS, I'm trying find a way to save redundancy in the code. .language #russian width: 97px

SCSS data-theme="dark" variables doesnt load

im currently working on a dark mode for my site and the JS is working fine, it adds the data-theme="dark" parameter to the html tag and stores it in the local s