Anki/ts/lib/sass/base.scss
Damien Elmes 9f55cf26fc
Switch to SvelteKit (#3077)
* Update to latest Node LTS

* Add sveltekit

* Split tslib into separate @generated and @tslib components

SvelteKit's path aliases don't support multiple locations, so our old
approach of using @tslib to refer to both ts/lib and out/ts/lib will no
longer work. Instead, all generated sources and their includes are
placed in a separate out/ts/generated folder, and imported via @generated
instead. This also allows us to generate .ts files, instead of needing
to output separate .d.ts and .js files.

* Switch package.json to module type

* Avoid usage of baseUrl

Incompatible with SvelteKit

* Move sass into ts; use relative links

SvelteKit's default sass support doesn't allow overriding loadPaths

* jest->vitest, graphs example working with yarn dev

* most pages working in dev mode

* Some fixes after rebasing

* Fix/silence some svelte-check errors

* Get image-occlusion working with Fabric types

* Post-rebase lock changes

* Editor is now checked

* SvelteKit build integrated into ninja

* Use the new SvelteKit entrypoint for pages like congrats/deck options/etc

* Run eslint once for ts/**; fix some tests

* Fix a bunch of issues introduced when rebasing over latest main

* Run eslint fix

* Fix remaining eslint+pylint issues; tests now all pass

* Fix some issues with a clean build

* Latest bufbuild no longer requires @__PURE__ hack

* Add a few missed dependencies

* Add yarn.bat to fix Windows build

* Fix pages failing to show when ANKI_API_PORT not defined

* Fix svelte-check and vitest on Windows

* Set node path in ./yarn

* Move svelte-kit output to ts/.svelte-kit

Sadly, I couldn't figure out a way to store it in out/ if out/ is
a symlink, as it breaks module resolution when SvelteKit is run.

* Allow HMR inside Anki

* Skip SvelteKit build when HMR is defined

* Fix some post-rebase issues

I should have done a normal merge instead.
2024-03-31 09:16:31 +01:00

84 lines
1.5 KiB
SCSS

@use "vars" as *;
@use "root-vars";
@use "button-mixins" as button;
@use "./scrollbar";
$body-color: palette(darkgray, 9);
$body-color-dark: palette(lightgray, 0);
$body-bg: palette(lightgray, 2);
$body-bg-dark: palette(darkgray, 5);
$link-hover-decoration: none;
$utilities: (
"opacity": (
property: opacity,
values: (
0: 0,
25: 0.25,
50: 0.5,
75: 0.75,
100: 1,
),
),
);
@import "bootstrap/scss/bootstrap-reboot";
@import "bootstrap/scss/bootstrap-utilities";
/* Bootstrap "extensions" */
.flex-basis-100 {
flex-basis: 100%;
}
.flex-basis-75 {
flex-basis: 75%;
}
html,
body {
height: 100%;
}
html {
overscroll-behavior: none;
}
body {
overflow-x: hidden;
&:not(.isMac),
&:not(.isMac) * {
@include scrollbar.custom;
}
&.no-blur * {
backdrop-filter: none !important;
}
}
button:not(.btn, .btn-close) {
/* override transition for instant hover response */
transition: color var(--transition) ease-in-out,
box-shadow var(--transition) ease-in-out !important;
border-radius: prop(border-radius);
@include button.base;
}
pre,
code,
kbd,
samp {
unicode-bidi: normal !important;
}
label,
input[type="radio"],
input[type="checkbox"] {
cursor: pointer;
}
input[type="text"] {
border-radius: prop(border-radius);
outline: none;
border: 1px solid color(border);
&:focus {
border-color: color(border-focus);
}
}