vite theme build

hakimel · Oct 17, 2024 · 6b7698d · 6b7698d
1 parent 9fe6d8d
commit 6b7698d
Show file tree

Hide file tree

Showing 40 changed files with 2,341 additions and 2,129 deletions.
diff --git a/css/theme/beige.scss b/css/theme/beige.scss
@@ -6,15 +6,16 @@
 
 
 // Default mixins and settings -----------------
+@use "sass:color";
 @import "./template/mixins";
 @import "./template/settings";
 // ---------------------------------------------
 
 
 
 // Include theme-specific fonts
-@import url(./fonts/league-gothic/league-gothic.css);
-@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic);
+@import url("/theme/fonts/league-gothic/league-gothic.css");
+@import url("https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic");
 
 
 // Override theme settings (see ../template/settings.scss)
@@ -23,7 +24,7 @@ $headingColor: #333;
 $headingTextShadow: none;
 $backgroundColor: #f7f3de;
 $linkColor: #8b743d;
-$linkColorHover: lighten( $linkColor, 20% );
+$linkColorHover: color.scale( $linkColor, $lightness: 20% );
 $selectionBackgroundColor: rgba(79, 64, 28, 0.99);
 $heading1TextShadow: 0 1px 0 #ccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0,0,0,.1), 0 0 5px rgba(0,0,0,.1), 0 1px 3px rgba(0,0,0,.3), 0 3px 5px rgba(0,0,0,.2), 0 5px 10px rgba(0,0,0,.25), 0 20px 20px rgba(0,0,0,.15);
 

diff --git a/css/theme/black-contrast.scss b/css/theme/black-contrast.scss
@@ -9,13 +9,14 @@
 
 
 // Default mixins and settings -----------------
+@use "sass:color";
 @import "./template/mixins";
 @import "./template/settings";
 // ---------------------------------------------
 
 
 // Include theme-specific fonts
-@import url(./fonts/source-sans-pro/source-sans-pro.css);
+@import url("/theme/fonts/source-sans-pro/source-sans-pro.css");
 
 
 // Override theme settings (see ../template/settings.scss)
@@ -32,8 +33,8 @@ $headingLetterSpacing: normal;
 $headingTextTransform: uppercase;
 $headingFontWeight: 600;
 $linkColor: #42affa;
-$linkColorHover: lighten( $linkColor, 15% );
-$selectionBackgroundColor: lighten( $linkColor, 25% );
+$linkColorHover: color.scale( $linkColor, $lightness: 15% );
+$selectionBackgroundColor: color.scale( $linkColor, $lightness: 25% );
 
 $heading1Size: 2.5em;
 $heading2Size: 1.6em;

diff --git a/css/theme/black.scss b/css/theme/black.scss
@@ -6,6 +6,7 @@
 
 
 // Default mixins and settings -----------------
+@use "sass:color";
 @import "./template/mixins";
 @import "./template/settings";
 // ---------------------------------------------
@@ -29,7 +30,7 @@ $headingLetterSpacing: normal;
 $headingTextTransform: uppercase;
 $headingFontWeight: 600;
 $linkColor: #42affa;
-$linkColorHover: lighten( $linkColor, 15% );
+$linkColorHover: color.scale( $linkColor, $lightness: 15% );
 $selectionBackgroundColor: rgba( $linkColor, 0.75 );
 
 $heading1Size: 2.5em;

diff --git a/css/theme/blood.scss b/css/theme/blood.scss
@@ -11,13 +11,14 @@
  */
 
  // Default mixins and settings -----------------
+@use "sass:color";
 @import "./template/mixins";
 @import "./template/settings";
 // ---------------------------------------------
 
 // Include theme-specific fonts
 
-@import url(https://fonts.googleapis.com/css?family=Ubuntu:300,700,300italic,700italic);
+@import url("https://fonts.googleapis.com/css?family=Ubuntu:300,700,300italic,700italic");
 
 // Colors used in the theme
 $blood: #a23;
@@ -40,7 +41,7 @@ $heading1TextShadow: 0 1px 0 #ccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b
 
 // Links
 $linkColor: $blood;
-$linkColorHover: lighten( $linkColor, 20% );
+$linkColorHover: color.scale( $linkColor, $lightness: 20% );
 
 // Text selection
 $selectionBackgroundColor: $blood;

diff --git a/css/theme/dracula.scss b/css/theme/dracula.scss
@@ -5,6 +5,7 @@
 
 
 // Default mixins and settings -----------------
+@use "sass:color";
 @import "./template/mixins";
 @import "./template/settings";
 // ---------------------------------------------

diff --git a/css/theme/league.scss b/css/theme/league.scss
@@ -8,15 +8,16 @@
 
 
 // Default mixins and settings -----------------
+@use "sass:color";
 @import "./template/mixins";
 @import "./template/settings";
 // ---------------------------------------------
 
 
 
 // Include theme-specific fonts
-@import url(./fonts/league-gothic/league-gothic.css);
-@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic);
+@import url("/theme/fonts/league-gothic/league-gothic.css");
+@import url("https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic");
 
 // Override theme settings (see ../template/settings.scss)
 $headingTextShadow: 0px 0px 6px rgba(0,0,0,0.2);

diff --git a/css/theme/moon.scss b/css/theme/moon.scss
@@ -5,15 +5,16 @@
 
 
 // Default mixins and settings -----------------
+@use "sass:color";
 @import "./template/mixins";
 @import "./template/settings";
 // ---------------------------------------------
 
 
 
 // Include theme-specific fonts
-@import url(./fonts/league-gothic/league-gothic.css);
-@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic);
+@import url("/theme/fonts/league-gothic/league-gothic.css");
+@import url("https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic");
 
 /**
  * Solarized colors by Ethan Schoonover
@@ -43,7 +44,7 @@ $headingColor: $base2;
 $headingTextShadow: none;
 $backgroundColor: $base03;
 $linkColor: $blue;
-$linkColorHover: lighten( $linkColor, 20% );
+$linkColorHover: color.scale( $linkColor, $lightness: 20% );
 $selectionBackgroundColor: $magenta;
 
 // Change text colors against light slide backgrounds

diff --git a/css/theme/night.scss b/css/theme/night.scss
@@ -6,22 +6,23 @@
 
 
 // Default mixins and settings -----------------
+@use "sass:color";
 @import "./template/mixins";
 @import "./template/settings";
 // ---------------------------------------------
 
 
 // Include theme-specific fonts
-@import url(https://fonts.googleapis.com/css?family=Montserrat:700);
-@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700,400italic,700italic);
+@import url("https://fonts.googleapis.com/css?family=Montserrat:700");
+@import url("https://fonts.googleapis.com/css?family=Open+Sans:400,700,400italic,700italic");
 
 
 // Override theme settings (see ../template/settings.scss)
 $backgroundColor: #111;
 
 $mainFont: 'Open Sans', sans-serif;
 $linkColor: #e7ad52;
-$linkColorHover: lighten( $linkColor, 20% );
+$linkColorHover: color.scale( $linkColor, $lightness: 20% );
 $headingFont: 'Montserrat', Impact, sans-serif;
 $headingTextShadow: none;
 $headingLetterSpacing: -0.03em;

diff --git a/css/theme/serif.scss b/css/theme/serif.scss
@@ -7,6 +7,7 @@
 
 
 // Default mixins and settings -----------------
+@use "sass:color";
 @import "./template/mixins";
 @import "./template/settings";
 // ---------------------------------------------
@@ -22,7 +23,7 @@ $headingTextShadow: none;
 $headingTextTransform: none;
 $backgroundColor: #F0F1EB;
 $linkColor: #51483D;
-$linkColorHover: lighten( $linkColor, 20% );
+$linkColorHover: color.scale( $linkColor, $lightness: 20% );
 $selectionBackgroundColor: #26351C;
 
 $overlayElementBgColor: 0, 0, 0;

diff --git a/css/theme/simple.scss b/css/theme/simple.scss
@@ -8,15 +8,16 @@
 
 
 // Default mixins and settings -----------------
+@use "sass:color";
 @import "./template/mixins";
 @import "./template/settings";
 // ---------------------------------------------
 
 
 
 // Include theme-specific fonts
-@import url(https://fonts.googleapis.com/css?family=News+Cycle:400,700);
-@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic);
+@import url("https://fonts.googleapis.com/css?family=News+Cycle:400,700");
+@import url("https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic");
 
 
 // Override theme settings (see ../template/settings.scss)
@@ -28,7 +29,7 @@ $headingTextShadow: none;
 $headingTextTransform: none;
 $backgroundColor: #fff;
 $linkColor: #00008B;
-$linkColorHover: lighten( $linkColor, 20% );
+$linkColorHover: color.scale( $linkColor, $lightness: 20% );
 $selectionBackgroundColor: rgba(0, 0, 0, 0.99);
 
 $overlayElementBgColor: 0, 0, 0;

diff --git a/css/theme/sky.scss b/css/theme/sky.scss
@@ -6,15 +6,16 @@
 
 
 // Default mixins and settings -----------------
+@use "sass:color";
 @import "./template/mixins";
 @import "./template/settings";
 // ---------------------------------------------
 
 
 
 // Include theme-specific fonts
-@import url(https://fonts.googleapis.com/css?family=Quicksand:400,700,400italic,700italic);
-@import url(https://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,400,700);
+@import url("https://fonts.googleapis.com/css?family=Quicksand:400,700,400italic,700italic");
+@import url("https://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,400,700");
 
 
 // Override theme settings (see ../template/settings.scss)
@@ -26,7 +27,7 @@ $headingLetterSpacing: -0.08em;
 $headingTextShadow: none;
 $backgroundColor: #f7fbfc;
 $linkColor: #3b759e;
-$linkColorHover: lighten( $linkColor, 20% );
+$linkColorHover: color.scale( $linkColor, $lightness: 20% );
 $selectionBackgroundColor: #134674;
 
 $overlayElementBgColor: 0, 0, 0;

diff --git a/css/theme/solarized.scss b/css/theme/solarized.scss
@@ -5,15 +5,16 @@
 
 
 // Default mixins and settings -----------------
+@use "sass:color";
 @import "./template/mixins";
 @import "./template/settings";
 // ---------------------------------------------
 
 
 
 // Include theme-specific fonts
-@import url(./fonts/league-gothic/league-gothic.css);
-@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic);
+@import url("/theme/fonts/league-gothic/league-gothic.css");
+@import url("https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic");
 
 
 /**
@@ -48,7 +49,7 @@ $headingColor: $base01;
 $headingTextShadow: none;
 $backgroundColor: $base3;
 $linkColor: $blue;
-$linkColorHover: lighten( $linkColor, 20% );
+$linkColorHover: color.scale( $linkColor, $lightness: 20% );
 $selectionBackgroundColor: $magenta;
 
 $overlayElementBgColor: 0, 0, 0;

diff --git a/css/theme/white-contrast.scss b/css/theme/white-contrast.scss
@@ -9,13 +9,14 @@
 
 
 // Default mixins and settings -----------------
+@use "sass:color";
 @import "./template/mixins";
 @import "./template/settings";
 // ---------------------------------------------
 
 
 // Include theme-specific fonts
-@import url(./fonts/source-sans-pro/source-sans-pro.css);
+@import url("/theme/fonts/source-sans-pro/source-sans-pro.css");
 
 
 // Override theme settings (see ../template/settings.scss)
@@ -32,8 +33,8 @@ $headingLetterSpacing: normal;
 $headingTextTransform: uppercase;
 $headingFontWeight: 600;
 $linkColor: #2a76dd;
-$linkColorHover: lighten( $linkColor, 15% );
-$selectionBackgroundColor: lighten( $linkColor, 25% );
+$linkColorHover: color.scale( $linkColor, $lightness: 15% );
+$selectionBackgroundColor: color.scale( $linkColor, $lightness: 25% );
 
 $heading1Size: 2.5em;
 $heading2Size: 1.6em;

diff --git a/css/theme/white.scss b/css/theme/white.scss
@@ -6,13 +6,14 @@
 
 
 // Default mixins and settings -----------------
+@use "sass:color";
 @import "./template/mixins";
 @import "./template/settings";
 // ---------------------------------------------
 
 
 // Include theme-specific fonts
-@import url(./fonts/source-sans-pro/source-sans-pro.css);
+@import url("/theme/fonts/source-sans-pro/source-sans-pro.css");
 
 
 // Override theme settings (see ../template/settings.scss)
@@ -29,8 +30,8 @@ $headingLetterSpacing: normal;
 $headingTextTransform: uppercase;
 $headingFontWeight: 600;
 $linkColor: #2a76dd;
-$linkColorHover: lighten( $linkColor, 15% );
-$selectionBackgroundColor: lighten( $linkColor, 25% );
+$linkColorHover: color.scale( $linkColor, $lightness: 15% );
+$selectionBackgroundColor: color.scale( $linkColor, $lightness: 25% );
 
 $heading1Size: 2.5em;
 $heading2Size: 1.6em;

diff --git a/demo.html b/demo.html
@@ -14,9 +14,9 @@
 
 		<meta name="viewport" content="width=device-width, initial-scale=1.0">
 
-		<link rel="stylesheet" href="dist/reset.css">
-		<link rel="stylesheet" href="dist/reveal.css">
-		<link rel="stylesheet" href="dist/theme/black.css" id="theme">
+		<link rel="stylesheet" href="css/reset.css">
+		<link rel="stylesheet" href="css/reveal.scss">
+		<link rel="stylesheet" href="css/theme/black.scss" id="theme">
 
 		<!-- Theme used for syntax highlighting of code -->
 		<link rel="stylesheet" href="plugin/highlight/monokai.css">