📦 EqualifyEverything / equalify

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82/* @layer theme, base, components, utilities;
@import "tailwindcss/theme.css" layer(theme);
@import "tailwindcss/utilities.css" layer(utilities);
 */
@use "./global-styles/variables.module";
@use "./global-styles/fonts";
@use "./global-styles/tables";
@use "./global-styles/icons";
@use "./global-styles/tooltip";
@use "./global-styles/charts"; 
@use "./global-styles/sr-only";
@use "./global-styles/drawer";
@use "./global-styles/selects";
@use "./global-styles/labels";
@use "./global-styles/inputs";
@use "./global-styles/flex";
@use "./global-styles/navigation.scss";

html {
  scrollbar-gutter: auto !important;
    -webkit-text-size-adjust: 100%;
  text-rendering: optimizeLegibility;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

body {
  margin: 0;
  color: variables.$black;
  @include fonts.raleway-medium;
  @include fonts.font-size-normal;
  line-height: 1.4em;

  a,
  a:visited {
    color: variables.$red;
    text-decoration: underline;
  }

  &.dark {
    background: variables.$black;
    color:  variables.$paper;
  }
}

.app-container {
  //max-width: variables.$max-width;
  max-width:100%;
  margin:0 auto;
  min-height:100dvh;
}

.container {
  width: 100%;
  max-width: variables.$max-width;
  padding-right: variables.$spacing;
  padding-left: variables.$spacing;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  min-height:calc(100dvh - 60px);
}

/* Suppress focus outline */
[tabindex="-1"]:focus {
  outline: none;
}

[tabindex="-1"]:focus-visible {
  outline: 2px solid variables.$red;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}