ch4o5/locomotive-boilerplate
Template
1
0
Fork 0
mirror of https://github.com/locomotivemtl/locomotive-boilerplate.git synced 2026-01-15 00:55:08 +08:00
Code Issues Projects Releases Wiki Activity

Upgrade sass package to v1.79 (#183)

Browse Source 
* Update sass to v1.79

* Fix broken node_modules import

* Fix conflict with new sass color() function

color() -> colorCode()

* build:styles - Remove deprecated sass.render()

* build:styles - remove infile + outfile from sass.compile options
This commit is contained in:
Michel Descoteaux
2024-10-16 10:07:10 -04:00
committed by GitHub
parent d593fe5409
commit 1ec1229fe4
8 changed files with 507 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
assets/styles/components/_form.scss
View File

@@ -27,7 +27,7 @@ $input-icon-color: 424242; // No #
.c-form_input {
padding: rem(10px);
border: 1px solid lightgray;
background-color: color(lightest);
background-color: colorCode(lightest);
&:hover {
border-color: darkgray;
@@ -71,7 +71,7 @@ $checkbox-icon-color: $input-icon-color;
}
&::before {
background-color: color(lightest);
background-color: colorCode(lightest);
border: 1px solid lightgray;
}

2
assets/styles/components/_scrollbar.scss
View File

@@ -25,7 +25,7 @@
position: absolute;
top: 0;
right: 0;
background-color: color(darkest);
background-color: colorCode(darkest);
opacity: 0.5;
width: 7px;
border-radius: 10px;

2
assets/styles/main.scss
View File

@@ -32,7 +32,7 @@
// Vendors
// ==========================================================================
@import "node_modules/locomotive-scroll/dist/locomotive-scroll";
@import "../../node_modules/locomotive-scroll/dist/locomotive-scroll";
// Elements
// ==========================================================================

16
assets/styles/settings/_config.colors.scss
View File

@@ -1,3 +1,5 @@
@use 'sass:color';
// ==========================================================================
// Settings / Config / Colors
// ==========================================================================
@@ -18,7 +20,7 @@ $colors: (
//
// ```scss
// .c-box {
// color: color(primary);
// color: colorCode(primary);
// }
// ```
//
@@ -26,7 +28,7 @@ $colors: (
// @param {number} $alpha - The alpha for the color value.
// @return {color}
@function color($key, $alpha: 1) {
@function colorCode($key, $alpha: 1) {
@if not map-has-key($colors, $key) {
@error "Unknown '#{$key}' in $colors.";
}
@@ -44,13 +46,13 @@ $colors: (
// ==========================================================================
// Link
$color-link: color(primary);
$color-link-focus: color(primary);
$color-link-hover: darken(color(primary), 10%);
$color-link: colorCode(primary);
$color-link-focus: colorCode(primary);
$color-link-hover: color.adjust(colorCode(primary), $lightness: -10%);
// Selection
$color-selection-text: color(darkest);
$color-selection-background: color(lightest);
$color-selection-text: colorCode(darkest);
$color-selection-background: colorCode(lightest);
// Socials
$color-facebook: #3B5998;

2
assets/styles/settings/_config.scss
View File

@@ -17,7 +17,7 @@ $assets-path: "../" !default;
// Base
$font-size: 16px;
$line-height: math.div(24px, $font-size);
$font-color: color(darkest);
$font-color: colorCode(darkest);
// Weights
$font-weight-light: 300;