There does not seem to be clear examples of custom storefronts or custom styling/themes for Spartacus. I would like to understand how I implement a custom theme where we have different colours and theme defaults. I cannot find any examples on how to do this correctly with Spartacus. Am I missing anything? Any feedback would ..
Category : sass

I’m using Angular and scss, but when I try to import a variable, I get this error: SassError: Undefined variable. border: $color-red 2px solid; But I have defined that variable in my file: And I’m using it in this way: I have tried setting the path like this: @import url("./global/_colors.scss");, with an underscore, but it ..
I would like to put these stylesheets inside SASS structure but for same reason doesn’t work,do you have any ideas? Thanks in advance. /* works input:disabled::-webkit-input-placeholder, input:focus::-webkit-input-placeholder { color:red } /* doesn’t work input,textarea { &:disabled { … &::-webkit-input-placeholder { color: red; } } &:focus { …. &::-webkit-input-placeholder { color: red; } } } Source: ..

I’m, trying to figure out, how to align mat-panel-description Angular Material component description name to right side: <mat-expansion-panel-header> <mat-panel-description class="right-side"> {{ myText }} </mat-panel-description> </mat-expansion-panel-header> here is a the only way which works for me, aligns text to the right, but not enough close to the border: .mat-expansion-panel-header-description { flex-basis: 0; display: flex; justify-content: flex-end; ..
I m trying to make an expandable input field to push other div when its expanded. So far its only covering the div which it supposed to push. Any ideas how to achieve that with css ? input[type="text"] { border-radius: 0; height: 24px; line-height: 24px; outline: none; position: absolute; right: 10rem; top: 5rem; -webkit-transition: width ..
With in my project, I can run npm run sass to trigger sassDoc, but it would be great if I could get that to work on every change to a scss file. I don’t even know where to start with this. Source: Angular..
I have a util scss file for my breakpoints to reuse them through my Angular project: $breakpoints: ( sm: 768px, md: 1024px, lg: 1280px, xl: 1400px ); $bp-sm: get-bp(‘sm’); $bp-md: get-bp(‘md’); $bp-lg: get-bp(‘lg’); $bp-xl: get-bp(‘xl’); @function get-bp($bp) { @if $bp { $bp: map-get($breakpoints, $bp); } @else { @error "Parameter #{$bp} is unknown or empty."; } ..
I would like to have a footer that is not sticky and at the bottom of the screen. I have tried absolute positioning the footer against a wrapper (relative positioning) w/ the router-outlet being positioned above it. My router-outlet is generating dynamic content that is overflowing and the wrapper height is not accommodating for it ..
I’m trying to figure out, how completely isolate group of components and pages from styles.scss in Angular application, and use different style setting for separated group I’m not able to remove or change styles.scss content on my need, but it is completely destroys my design, and most destructive is @import "assets/styles/set";, which loads everything I ..
In Angular application, using of Angular Material I’ve changed color for <mat-checkbox>My Checkbox</mat-checkbox> checked background and border like this: ::ng-deep .mat-checkbox .mat-checkbox-frame { border-color: rgb(130, 238, 148); } ::ng-deep .mat-checkbox-checked .mat-checkbox-background { background-color: rgb(251, 255, 0) !important; } but I can’t find the way to do the same with checkbox: <mat-selection-list> <mat-list-option *ngFor="let dt of ..
Recent Comments