mirror of
https://github.com/godotengine/godot-website.git
synced 2025-12-31 09:48:43 +03:00
Fix Sass deprecations (#1080)
* Fix building with Jekyll on Ruby 3.4 Ruby 3.4 removed several standard library packages, so they have to be installed as gems instead. This also updates Jekyll to use a version that's supported in Ruby 3.4. The minimum required Ruby version is now 3.2. * Fix Sass deprecations This allows the website to build on Ruby 3.4.0 + Jekyll 4.4.1. More information: - https://sass-lang.com/blog/import-is-deprecated/
This commit is contained in:
Hugo Locurcio
GitHub
@@ -1,36 +1,36 @@
|
||||
$color-godot-blue: #478CBF;
|
||||
$godot-blue: #478CBF;
|
||||
|
||||
$color-code-symbol--light: #00009c;
|
||||
$color-code-symbol--dark: #ABC9FF;
|
||||
$color-code-keyword--light: #e62282;
|
||||
$color-code-keyword--dark: #FF7085;
|
||||
$color-code-controlflow--light: #bd1fcc;
|
||||
$color-code-controlflow--dark: #FF8CCC;
|
||||
$color-code-basetype--light: #009933;
|
||||
$color-code-basetype--dark: #42FFC2;
|
||||
$color-code-enginetype--light: #1c8c66;
|
||||
$color-code-enginetype--dark: #8FFFDB;
|
||||
$color-code-usertype--light: #2e7366;
|
||||
$color-code-usertype--dark: #C7FFED;
|
||||
$color-code-string--light: #996b00;
|
||||
$color-code-string--dark: #FFEDA1;
|
||||
$color-code-background--light: #ffffff;
|
||||
$color-code-background--dark: #1D2229;
|
||||
$color-code-text--light: #393939;
|
||||
$color-code-text--dark: #CDCFD2;
|
||||
$color-code-function--light: #0039e6;
|
||||
$color-code-function--dark: #57B3FF;
|
||||
$color-code-membervariable--light: #0066ad;
|
||||
$color-code-membervariable--dark: #BCE0FF;
|
||||
$color-code-gdscript-function--light: #009999;
|
||||
$color-code-gdscript-function--dark: #66E6FF;
|
||||
$color-code-gdscript-globalfunction--light: #5c2eb8;
|
||||
$color-code-gdscript-globalfunction--dark: #A3A3F5;
|
||||
$color-code-gdscript-nodepath--light: #2e8c00;
|
||||
$color-code-gdscript-nodepath--dark: #B8C47D;
|
||||
$color-code-gdscript-nodereference--light: #008000;
|
||||
$color-code-gdscript-nodereference--dark: #63C259;
|
||||
$color-code-gdscript-annotation--light: #cc5e00;
|
||||
$color-code-gdscript-annotation--dark: #FFB373;
|
||||
$color-code-gdscript-stringname--light: #cc8f73;
|
||||
$color-code-gdscript-stringname--dark: #FFC2A6;
|
||||
$code-symbol--light: #00009c;
|
||||
$code-symbol--dark: #ABC9FF;
|
||||
$code-keyword--light: #e62282;
|
||||
$code-keyword--dark: #FF7085;
|
||||
$code-controlflow--light: #bd1fcc;
|
||||
$code-controlflow--dark: #FF8CCC;
|
||||
$code-basetype--light: #009933;
|
||||
$code-basetype--dark: #42FFC2;
|
||||
$code-enginetype--light: #1c8c66;
|
||||
$code-enginetype--dark: #8FFFDB;
|
||||
$code-usertype--light: #2e7366;
|
||||
$code-usertype--dark: #C7FFED;
|
||||
$code-string--light: #996b00;
|
||||
$code-string--dark: #FFEDA1;
|
||||
$code-background--light: #ffffff;
|
||||
$code-background--dark: #1D2229;
|
||||
$code-text--light: #393939;
|
||||
$code-text--dark: #CDCFD2;
|
||||
$code-function--light: #0039e6;
|
||||
$code-function--dark: #57B3FF;
|
||||
$code-membervariable--light: #0066ad;
|
||||
$code-membervariable--dark: #BCE0FF;
|
||||
$code-gdscript-function--light: #009999;
|
||||
$code-gdscript-function--dark: #66E6FF;
|
||||
$code-gdscript-globalfunction--light: #5c2eb8;
|
||||
$code-gdscript-globalfunction--dark: #A3A3F5;
|
||||
$code-gdscript-nodepath--light: #2e8c00;
|
||||
$code-gdscript-nodepath--dark: #B8C47D;
|
||||
$code-gdscript-nodereference--light: #008000;
|
||||
$code-gdscript-nodereference--dark: #63C259;
|
||||
$code-gdscript-annotation--light: #cc5e00;
|
||||
$code-gdscript-annotation--dark: #FFB373;
|
||||
$code-gdscript-stringname--light: #cc8f73;
|
||||
$code-gdscript-stringname--dark: #FFC2A6;
|
||||
|
||||
@@ -1,8 +1,11 @@
|
||||
@use "sass:color";
|
||||
@use "sass:list";
|
||||
@use "sass:map";
|
||||
//
|
||||
// Functions
|
||||
//
|
||||
@function offset-hue($color, $offset, $i: 1) {
|
||||
@return adjust-hue($color, $offset * $i);
|
||||
@return color.adjust($color, $hue: $offset * $i);
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -10,49 +13,49 @@
|
||||
* it will return a map of sections with the $base-category being assigned with
|
||||
* a specific $base-color, and will $offset each section by n degrees.
|
||||
*/
|
||||
@function r-generate-sections($sections, $base-category, $base-color, $offset) {
|
||||
@function generate-sections($sections, $base-category, $base-color, $offset) {
|
||||
$return-value: ();
|
||||
$base-category-i: index($sections, $base-category);
|
||||
$base-category-i: list.index($sections, $base-category);
|
||||
@each $section in $sections {
|
||||
$i: index($sections, $section);
|
||||
$i: list.index($sections, $section);
|
||||
$diff: $i - $base-category-i;
|
||||
$base-color-top: offset-hue($base-color, $offset, $diff);
|
||||
$base-color-bottom: adjust-color(
|
||||
$base-color-bottom: color.adjust(
|
||||
offset-hue($base-color, $offset, $diff + 1),
|
||||
$lightness: -10
|
||||
$lightness: -10%
|
||||
);
|
||||
$color-top: adjust-color($base-color-top, $saturation: -10);
|
||||
$color-bottom: adjust-color($base-color-bottom, $saturation: -10);
|
||||
$color-top-muted: adjust-color($base-color-top, $saturation: -25);
|
||||
$color-bottom-muted: adjust-color($base-color-bottom, $saturation: -25);
|
||||
$color-selection: adjust-color($base-color-bottom, $saturation: -30);
|
||||
$color-selection--light: adjust-color(
|
||||
$color-top: color.adjust($base-color-top, $saturation: -10%);
|
||||
$color-bottom: color.adjust($base-color-bottom, $saturation: -10%);
|
||||
$color-top-muted: color.adjust($base-color-top, $saturation: -25%);
|
||||
$color-bottom-muted: color.adjust($base-color-bottom, $saturation: -25%);
|
||||
$color-selection: color.adjust($base-color-bottom, $saturation: -30%);
|
||||
$color-selection--light: color.adjust(
|
||||
$base-color-bottom,
|
||||
$lightness: 40,
|
||||
$saturation: 30
|
||||
$lightness: 40%,
|
||||
$saturation: 30%
|
||||
);
|
||||
$color-invert: adjust-color(
|
||||
$color-invert: color.adjust(
|
||||
$base-color-top,
|
||||
$hue: 180,
|
||||
$lightness: 0,
|
||||
$saturation: 30
|
||||
$hue: 180deg,
|
||||
$lightness: 0%,
|
||||
$saturation: 30%
|
||||
);
|
||||
$color-highlight: adjust-color(
|
||||
$color-highlight: color.adjust(
|
||||
$base-color-top,
|
||||
$lightness: 0,
|
||||
$saturation: 30
|
||||
$lightness: 0%,
|
||||
$saturation: 30%
|
||||
);
|
||||
$color-highlight--dark: adjust-color(
|
||||
$color-highlight--dark: color.adjust(
|
||||
$base-color-top,
|
||||
$lightness: 30,
|
||||
$saturation: 30
|
||||
$lightness: 30%,
|
||||
$saturation: 30%
|
||||
);
|
||||
$color-invert-highlight: adjust-color(
|
||||
$color-invert-highlight: color.adjust(
|
||||
$color-invert,
|
||||
$lightness: 20,
|
||||
$saturation: 30
|
||||
$lightness: 20%,
|
||||
$saturation: 30%
|
||||
);
|
||||
$return-value: map-merge(
|
||||
$return-value: map.merge(
|
||||
$return-value,
|
||||
(
|
||||
#{$section}: (
|
||||
@@ -73,16 +76,16 @@
|
||||
@return $return-value;
|
||||
}
|
||||
|
||||
@function r-desktop-mobile($sizes...) {
|
||||
@return ("desktop": nth($sizes, 1), "mobile": nth($sizes, 2));
|
||||
@function desktop-mobile($sizes...) {
|
||||
@return ("desktop": list.nth($sizes, 1), "mobile": list.nth($sizes, 2));
|
||||
}
|
||||
|
||||
@function r-get-desktop($value) {
|
||||
@return map-get($value, "desktop");
|
||||
@function get-desktop($value) {
|
||||
@return map.get($value, "desktop");
|
||||
}
|
||||
|
||||
@function r-get-mobile($value) {
|
||||
@return map-get($value, "mobile");
|
||||
@function get-mobile($value) {
|
||||
@return map.get($value, "mobile");
|
||||
}
|
||||
|
||||
//
|
||||
|
||||
Reference in New Issue
Block a user