27,709 questions
0
votes
1
answer
206
views
how to change from @import to @use in scss
I've broken some code by changing from import to use. The idea is to create a flexible & reusable typography style file which can be used to generate a bunch of classes to style the app.
...
- 1,733
0
votes
0
answers
115
views
Dropdown menu is showing white background "Wordpress"
I am using the Klinta - Cleaning Services Elementor Template Kit
https://preview.themeforest.net/item/klinta-cleaning-services-elementor-template-kit/full_screen_preview/35243306
Since my website is ...
- 11
1
vote
2
answers
486
views
SCSS Module Styles Only Work with next dev --turbo
I’m using Next.js 15 (with the app directory) and Mantine 7 in my project. I'm styling Mantine components using SCSS modules (*.module.scss), but the styles behave inconsistently depending on how I ...
- 271
1
vote
1
answer
71
views
P-Dialog content is getting cut when zooming in
I added a PrimeNG dialog with an image inside. I want to zoom in and out of the image using the scroll. It seems like the p-dialog has the overflow property set to auto, but my content keeps getting ...
- 31
2
votes
1
answer
117
views
Overwriting a Sass Color Map with @use ... with Fails: Undefined Variable
This is our repository structure. In public/scss/ are all default SCSS files that provide basic styling to the website. And everything that comes from base/themes can overwrite the stuff in src. So ...
- 375
1
vote
1
answer
51
views
How not to access second last two elements by CSS
How can I add "," separated content: "," to all ul > li not the last two lists
<style>
ul li:nth-last-child(2)::after { content: "," }
</style>
is not ...
- 13
0
votes
0
answers
227
views
How to have named imports and custom file names with Vite, React, Typescript and SCCS modules
I have a Vite/React/Typescript app configured with sass and I would like to:
Import the styles as named imports:
import { styles } from "my-component.styles.scss";
Configure Vite (or sass) ...
- 11
1
vote
1
answer
253
views
CSS files have a lot of unwanted code after running npm run build
I have created Webpack 5 demo for plain HTML, CSS and JS using TailwindCSS v4.
GitHub: sanketpbhamre/tailwind-4-webpack-5
Webpack CSS configuration
module: {
rules: [
{
test: /\.(s[ac]|c)...
- 644
0
votes
1
answer
30
views
Centering slider navigation arrows according to the image not parent container
How can I center slider navigation buttons based on the images inside each slide instead of the parent container? I have a slider section displaying products with names and prices. The prev/next ...
- 658
0
votes
0
answers
52
views
Overriding CSS settings in a Jekyll Gem-based theme
I have Jekyll running locally with a theme I like, no-style-please. Everything is working as expected.
However, on some content, the overall page width is a little smushed. I hunted around in the ...
- 513
2
votes
1
answer
2k
views
How to use SCSS in a rails 8 project?
I just started a new Rails 8 (Ruby 3.4.1) project with the new propshaft asset pipeline and I can't get SCSS to work. I've tried adding the sassc-rails gem to my gemfile, like in my recent Rails 7 ...
- 143
0
votes
0
answers
29
views
Set a Blazor variable in scss
Is it possible to set a Blazor variable in scss. I'm trying to show/hide a component on hover. Something like:
Scss File
Frame {
&:active {
ShowCopyIcon {
display: none;
}
...
- 1
1
vote
1
answer
110
views
How to Access Quasar CSS Variables Within Script?
I'm using Quasar 2.17.7.
If I have the below styles in my quasar.variables.scss file:
$company-base: #3c3c3b;
$company-accent: #89c3ce;
$primary: #1976d2;
$secondary: #26a69a;
$accent: #9c27b0;
How ...
- 91
2
votes
2
answers
3k
views
Angular material 19 - mat-typography not applying in custom theme
I set up a new angular project with angular 19 and ran into the issue mentioned in the title.
Added material with the ng add cli command, and selected "yes" to the prompt if I wanted to use ...
- 73
0
votes
0
answers
161
views
How can I replace node-sass module?
I'm trying to start my website again after few years but can not change the code because my gulpfile.js for the compiler does not start.
Terminal says that the reasoin is that node-sass I used before ...
- 1
0
votes
1
answer
67
views
Visual studio Code using Sass is not compiling
I tried to compile sass using Visual Studio with the “live sass compiler” extension, I'm a bit confused about how to set Sass with CSS. kindly check to see if this correct setting compares with the ...
- 41
0
votes
1
answer
36
views
How to Apply Background Color for Children in a Repeating Pattern (Blue, Purple, Red) [duplicate]
I have a parent div, with a varying number of child divs. The child divs will always be within a parent div.
I want to color the child divs in an order, so that the 1st child is blue, the 2nd is ...
- 1,752
1
vote
1
answer
47
views
My SCSS files are not getting saved in css folder with Gulp
I am running my gulp task for compiling my scss files and then convert them to css.
The scss files are getting compiled correctly in the cli. But the css files are not getting saved.
Below is my scss ...
0
votes
0
answers
561
views
Jekyll: How to use automatic SASS migrator?
I get a lot of deprecation warnings on my jekyll sites.
I have found out this article, that shows automataed migration:
Automatic Migration
You can use the Sass migrator to automatically update your ...
- 1,416
0
votes
0
answers
102
views
Angular SSR stylesheet is being loaded but not applied
I am creating an angular app using server side rendering and will have multiple clients using it, so I want the page to have different styles or themes.
I'm trying to load the themes in the page but ...
22
votes
9
answers
29k
views
How to upgrade TailwindCSS?
I'm currently using Tailwind v3 in my Angular project (https://github.com/edissyum/opencapture/tree/dev_nch).
Today I tried to upgrade to Tailwind v4, but without success.
I didn't use PostCSS, I just ...
- 1,093
0
votes
1
answer
58
views
Unable to Apply CSS Styles to Angular Material mat-icon in Nested Components
I am trying to apply custom styles to a mat-icon element inside an Angular Material component, but no matter what I do, the styles won't take effect. Here's a simplified version of my code:
Html:
<...
- 973
0
votes
0
answers
39
views
How to generate random numbers in percentage? [duplicate]
I read this topic about random numbers. I'm interested in how to add "%" for random number in SCSS or CSS.
My variant of code doesn't work:
.star{
position: absolute;
background-color: #...
- 284
0
votes
1
answer
2k
views
Vite, React, SCSS - Can't add SCSS (Embedded Dart Sass couldn't find the embedded compiler executable)
Current setup is below.
Using this in package.json / devDependancies:
"sass-embedded": "^1.83.4",
Folder setup:
component.tsx
component.scss
In component.tsx:
import './component....
- 1,041
0
votes
0
answers
128
views
Can't import SCSS modules after migrating from Webpack v4 to v5
After upgrading to Webpack 5 and Node 20, I'm facing an issue where SCSS files are not being properly loaded in my React project. When I try to import a SCSS file like import styles from './...
