Put sass into repo directory (#1409)

Fix Sass build

qt/aqt/BUILD.bazel

@@ -14,7 +14,7 @@ genrule(
 genrule(
     name = "extract_sass_colors",
     srcs = [
-        "//ts/sass:_vars.scss",
+        "//sass:_vars.scss",
     ],
     outs = ["colors.py"],
     cmd = "$(location //qt:extract_sass_colors) $< $@",

qt/aqt/data/web/css/BUILD.bazel

@@ -9,10 +9,10 @@ compile_sass(
     ),
     group = "css_local",
     deps = [
-        "//ts/sass:core_lib",
+        "//sass:core_lib",
-        "//ts/sass:buttons_lib",
+        "//sass:buttons_lib",
-        "//ts/sass:scrollbar_lib",
+        "//sass:scrollbar_lib",
-        "//ts/sass:card_counts_lib",
+        "//sass:card_counts_lib",
     ],
     visibility = ["//visibility:private"],
 )

qt/aqt/data/web/css/deckbrowser.scss

@@ -1,7 +1,7 @@
 /* Copyright: Ankitects Pty Ltd and contributors
  * License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html */
 
-@use 'ts/sass/card-counts';
+@use 'sass/card-counts';
 
 a.deck {
     color: var(--text-fg);

qt/aqt/data/web/css/overview.scss

@@ -1,7 +1,7 @@
 /* Copyright: Ankitects Pty Ltd and contributors
  * License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html */
 
-@use 'ts/sass/card-counts';
+@use 'sass/card-counts';
 
 .smallLink {
     font-size: 10px;

qt/aqt/data/web/css/reviewer-bottom.scss

@@ -1,7 +1,7 @@
 /* Copyright: Ankitects Pty Ltd and contributors
  * License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html */
 
-@use 'ts/sass/card-counts';
+@use 'sass/card-counts';
 
 :root {
     --focus-color: #0078d7;

qt/aqt/data/web/css/webview.scss

@@ -1,9 +1,9 @@
 /* Copyright: Ankitects Pty Ltd and contributors
  * License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html */
 
-@use 'ts/sass/core';
+@use 'sass/core';
-@use 'ts/sass/scrollbar';
+@use 'sass/scrollbar';
-@use 'ts/sass/buttons';
+@use 'sass/buttons';
 
 // core.scss sets border-box, but we need to
 // keep the old behaviour for now to avoid breaking

qt/aqt/data/web/js/compile_ts.bzl

@@ -9,7 +9,7 @@ def compile_ts(group, srcs):
             name = name,
             src = ts_file,
             sourcemap = False,
-            deps = ["//ts/sass:core_lib"],
+            deps = ["//sass:core_lib"],
         )
 
     native.filegroup(

sass/BUILD.bazel

@@ -9,7 +9,7 @@ sass_library(
         "bootstrap-dark.scss",
     ],
     visibility = ["//visibility:public"],
-    deps = ["//ts/sass/bootstrap", "//ts/sass/codemirror"],
+    deps = ["//sass/bootstrap", "//sass/codemirror"],
 )
 
 sass_library(

ts/change-notetype/BUILD.bazel

@@ -11,9 +11,9 @@ compile_sass(
     group = "base_css",
     visibility = ["//visibility:public"],
     deps = [
-        "//ts/sass:base_lib",
+        "//sass:base_lib",
-        "//ts/sass:scrollbar_lib",
+        "//sass:scrollbar_lib",
-        "//ts/sass/bootstrap",
+        "//sass/bootstrap",
     ],
 )
 
@@ -71,8 +71,8 @@ svelte_check(
         "*.ts",
         "*.svelte",
     ]) + [
-        "//ts/sass:button_mixins_lib",
+        "//sass:button_mixins_lib",
-        "//ts/sass/bootstrap",
+        "//sass/bootstrap",
         "@npm//@types/bootstrap",
         "@npm//@types/lodash-es",
         "@npm//@types/marked",

ts/change-notetype/change-notetype-base.scss

@@ -1,15 +1,15 @@
-@use "vars";
+@use "sass/vars";
-@use "scrollbar";
+@use "sass/scrollbar";
-@use "bootstrap-dark";
+@use "sass/bootstrap-dark";
 
-@import "base";
+@import "sass/base";
 
-@import "bootstrap/scss/alert";
+@import "sass/bootstrap/scss/alert";
-@import "bootstrap/scss/forms";
+@import "sass/bootstrap/scss/forms";
-@import "bootstrap/scss/buttons";
+@import "sass/bootstrap/scss/buttons";
-@import "bootstrap/scss/button-group";
+@import "sass/bootstrap/scss/button-group";
-@import "bootstrap/scss/close";
+@import "sass/bootstrap/scss/close";
-@import "bootstrap/scss/grid";
+@import "sass/bootstrap/scss/grid";
 
 .night-mode {
     @include scrollbar.night-mode;

ts/compile_sass.bzl

@@ -15,8 +15,10 @@ def compile_sass(group, srcs, deps = [], visibility = ["//visibility:private"]):
             deps = deps,
             visibility = visibility,
             include_paths = [
-                "ts/sass",
+                ".",
-                "external/ankidesktop/ts/sass",
+                "sass",
+                "external/ankidesktop",
+                "external/ankidesktop/sass",
             ],
         )
 

ts/components/BUILD.bazel

@@ -31,10 +31,10 @@ svelte_check(
         "*.ts",
         "*.svelte",
     ]) + [
-        "//ts/sass:base_lib",
+        "//sass:base_lib",
-        "//ts/sass:button_mixins_lib",
+        "//sass:button_mixins_lib",
-        "//ts/sass:scrollbar_lib",
+        "//sass:scrollbar_lib",
-        "//ts/sass/bootstrap",
+        "//sass/bootstrap",
         "@npm//@types/bootstrap",
         "//ts/sveltelib:sveltelib_pkg",
     ],

ts/components/ButtonToolbar.svelte

@@ -95,7 +95,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 </div>
 
 <style lang="scss">
-    @use "scrollbar";
+    @use "sass/scrollbar";
 
     .nightMode {
         @include scrollbar.night-mode;

ts/components/DropdownItem.svelte

@@ -39,7 +39,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 </button>
 
 <style lang="scss">
-    @use "button-mixins" as button;
+    @use "sass/button-mixins" as button;
 
     button {
         display: flex;

ts/components/IconButton.svelte

@@ -51,7 +51,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 </button>
 
 <style lang="scss">
-    @use "button-mixins" as button;
+    @use "sass/button-mixins" as button;
 
     button {
         padding: 0;

ts/components/LabelButton.svelte

@@ -49,7 +49,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 </button>
 
 <style lang="scss">
-    @use "button-mixins" as button;
+    @use "sass/button-mixins" as button;
 
     button {
         padding: 0 calc(var(--buttons-size) / 3);

ts/components/SelectButton.svelte

@@ -39,7 +39,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 </select>
 
 <style lang="scss">
-    @use "button-mixins" as button;
+    @use "sass/button-mixins" as button;
 
     select {
         height: var(--buttons-size);

ts/congrats/BUILD.bazel

@@ -11,8 +11,8 @@ compile_sass(
     group = "base_css",
     visibility = ["//visibility:public"],
     deps = [
-        "//ts/sass:base_lib",
+        "//sass:base_lib",
-        "//ts/sass:scrollbar_lib",
+        "//sass:scrollbar_lib",
     ],
 )
 

ts/congrats/congrats-base.scss

@@ -1,5 +1,5 @@
-@use "core";
+@use "sass/core";
-@use "scrollbar";
+@use "sass/scrollbar";
 
 .night-mode {
     @include scrollbar.night-mode;

ts/deck-options/BUILD.bazel

@@ -12,9 +12,9 @@ compile_sass(
     group = "base_css",
     visibility = ["//visibility:public"],
     deps = [
-        "//ts/sass:base_lib",
+        "//sass:base_lib",
-        "//ts/sass:scrollbar_lib",
+        "//sass:scrollbar_lib",
-        "//ts/sass/bootstrap",
+        "//sass/bootstrap",
     ],
 )
 
@@ -73,9 +73,9 @@ svelte_check(
         "*.ts",
         "*.svelte",
     ]) + [
-        "//ts/sass:button_mixins_lib",
+        "//sass:button_mixins_lib",
-        "//ts/sass:night_mode_lib",
+        "//sass:night_mode_lib",
-        "//ts/sass/bootstrap",
+        "//sass/bootstrap",
         "@npm//@types/bootstrap",
         "@npm//@types/lodash-es",
         "@npm//@types/marked",

ts/deck-options/EnumSelector.svelte

@@ -24,8 +24,8 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 </select>
 
 <style lang="scss">
-    @use "night-mode" as nightmode;
+    @use "sass/night-mode" as nightmode;
-    @use "button-mixins" as button;
+    @use "sass/button-mixins" as button;
 
     .nightMode {
         @include nightmode.input;

ts/deck-options/SpinBox.svelte

@@ -34,7 +34,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 />
 
 <style lang="scss">
-    @use "night-mode" as nightmode;
+    @use "sass/night-mode" as nightmode;
 
     .nightMode {
         @include nightmode.input;

ts/deck-options/SpinBoxFloat.svelte

@@ -32,7 +32,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 />
 
 <style lang="scss">
-    @use "night-mode" as nightmode;
+    @use "sass/night-mode" as nightmode;
 
     .nightMode {
         @include nightmode.input;

ts/deck-options/StepsInput.svelte

@@ -28,7 +28,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 />
 
 <style lang="scss">
-    @use "night-mode" as nightmode;
+    @use "sass/night-mode" as nightmode;
 
     .nightMode {
         @include nightmode.input;

ts/deck-options/TextInputModal.svelte

@@ -96,7 +96,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 </div>
 
 <style lang="scss">
-    @use "night-mode" as nightmode;
+    @use "sass/night-mode" as nightmode;
 
     .nightMode {
         @include nightmode.input;

ts/deck-options/deck-options-base.scss

@@ -2,22 +2,22 @@ $tooltip-padding-y: 0.45rem;
 $tooltip-padding-x: 0.65rem;
 $tooltip-max-width: 300px;
 
-@use "vars";
+@use "sass/vars";
-@use "scrollbar";
+@use "sass/scrollbar";
 
-@import "base";
+@import "sass/base";
-@import "bootstrap/scss/containers";
+@import "sass/bootstrap/scss/containers";
-@import "bootstrap/scss/grid";
+@import "sass/bootstrap/scss/grid";
-@import "bootstrap/scss/dropdown";
+@import "sass/bootstrap/scss/dropdown";
-@import "bootstrap/scss/forms";
+@import "sass/bootstrap/scss/forms";
-@import "bootstrap/scss/buttons";
+@import "sass/bootstrap/scss/buttons";
-@import "bootstrap/scss/button-group";
+@import "sass/bootstrap/scss/button-group";
-@import "bootstrap/scss/transitions";
+@import "sass/bootstrap/scss/transitions";
-@import "bootstrap/scss/modal";
+@import "sass/bootstrap/scss/modal";
-@import "bootstrap/scss/close";
+@import "sass/bootstrap/scss/close";
-@import "bootstrap/scss/alert";
+@import "sass/bootstrap/scss/alert";
-@import "bootstrap/scss/tooltip";
+@import "sass/bootstrap/scss/tooltip";
-@import "bootstrap/scss/badge";
+@import "sass/bootstrap/scss/badge";
 
 .night-mode {
     @include scrollbar.night-mode;

ts/editable/BUILD.bazel

@@ -12,8 +12,8 @@ compile_sass(
     group = "editable_scss",
     visibility = ["//visibility:public"],
     deps = [
-        "//ts/sass:scrollbar_lib",
+        "//sass:scrollbar_lib",
-        "//ts/sass/codemirror",
+        "//sass/codemirror",
     ],
 )
 

ts/editable/editable-base.scss

@@ -1,4 +1,4 @@
-@use "scrollbar";
+@use "sass/scrollbar";
 
 anki-editable {
     display: block;

ts/editor/AutocompleteItem.svelte

@@ -46,7 +46,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 </button>
 
 <style lang="scss">
-    @use "button-mixins" as button;
+    @use "sass/button-mixins" as button;
 
     .autocomplete-item {
         padding: 1px 7px 2px;

ts/editor/BUILD.bazel

@@ -13,10 +13,10 @@ compile_sass(
     group = "base_css",
     visibility = ["//visibility:public"],
     deps = [
-        "//ts/sass:base_lib",
+        "//sass:base_lib",
-        "//ts/sass:button_mixins_lib",
+        "//sass:button_mixins_lib",
-        "//ts/sass:buttons_lib",
+        "//sass:buttons_lib",
-        "//ts/sass:scrollbar_lib",
+        "//sass:scrollbar_lib",
     ],
 )
 
@@ -28,8 +28,8 @@ compile_sass(
     group = "local_css",
     visibility = ["//visibility:public"],
     deps = [
-        "//ts/sass:button_mixins_lib",
+        "//sass:button_mixins_lib",
-        "//ts/sass/bootstrap",
+        "//sass/bootstrap",
     ],
 )
 
@@ -82,8 +82,8 @@ svelte_check(
         "*.ts",
         "*.svelte",
     ]) + [
-        "//ts/sass:button_mixins_lib",
+        "//sass:button_mixins_lib",
-        "//ts/sass/bootstrap",
+        "//sass/bootstrap",
         "@npm//@types/bootstrap",
         "//ts/components",
         "@npm//@types/codemirror",

ts/editor/Tag.svelte

@@ -44,7 +44,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 </button>
 
 <style lang="scss">
-    @use "button-mixins" as button;
+    @use "sass/button-mixins" as button;
 
     @keyframes flash {
         0% {

ts/editor/bootstrap.scss

@@ -1,13 +1,13 @@
-@import "bootstrap/scss/functions";
+@import "sass/bootstrap/scss/functions";
-@import "bootstrap/scss/variables";
+@import "sass/bootstrap/scss/variables";
-@import "bootstrap/scss/mixins";
+@import "sass/bootstrap/scss/mixins";
 
 $btn-disabled-opacity: 0.4;
 
-@import "bootstrap/scss/buttons";
+@import "sass/bootstrap/scss/buttons";
-@import "bootstrap/scss/button-group";
+@import "sass/bootstrap/scss/button-group";
-@import "bootstrap/scss/dropdown";
+@import "sass/bootstrap/scss/dropdown";
 
 $tooltip-max-width: 600px;
 
-@import "bootstrap/scss/tooltip";
+@import "sass/bootstrap/scss/tooltip";

ts/editor/fields.scss

@@ -1,9 +1,9 @@
 /* Copyright: Ankitects Pty Ltd and contributors
  * License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html */
 
-@use "base";
+@use "sass/base";
-@use "scrollbar";
+@use "sass/scrollbar";
-@use "button-mixins";
+@use "sass/button-mixins";
 
 html,
 body {

ts/graphs/BUILD.bazel

@@ -10,8 +10,8 @@ compile_sass(
     group = "base_css",
     visibility = ["//visibility:public"],
     deps = [
-        "//ts/sass:base_lib",
+        "//sass:base_lib",
-        "//ts/sass:scrollbar_lib",
+        "//sass:scrollbar_lib",
     ],
 )
 

ts/graphs/graphs-base.scss

@@ -1,5 +1,5 @@
-@use "base";
+@use "sass/base";
-@use "scrollbar";
+@use "sass/scrollbar";
 
 .night-mode {
     @include scrollbar.night-mode;

ts/svelte/svelte.bzl

@@ -78,5 +78,5 @@ def svelte_check(name = "svelte_check", srcs = []):
         data = [
             "@npm//sass",
         ] + srcs,
-        env = {"SASS_PATH": "ts/sass"},
+        env = {"SASS_PATH": "sass"},
     )

ts/svelte/svelte.ts

@@ -150,14 +150,13 @@ async function writeJs(
     const preprocessOptions = preprocess({
         scss: {
             includePaths: [
-                "ts/sass",
+                binDir,
-                `${binDir}/ts/sass`,
+                genDir,
-                `${genDir}/ts/sass`,
+                // a nasty hack to ensure sass/... resolves correctly
-                // a nasty hack to ensure ts/sass/... resolves correctly
                 // when invoked from an external workspace
-                `${binDir}/external/ankidesktop/ts/sass`,
+                `${binDir}/external/ankidesktop`,
-                `${genDir}/external/ankidesktop/ts/sass`,
+                `${genDir}/external/ankidesktop`,
-                `${binDir}/../../../external/ankidesktop/ts/sass`,
+                `${binDir}/../../../external/ankidesktop`,
             ],
         },
     });