diff --git a/dist/scales.css b/dist/scales.css deleted file mode 100644 index 183a2fd..0000000 --- a/dist/scales.css +++ /dev/null @@ -1,220 +0,0 @@ -:root { - --theme-h: 207; - --theme-s: 50%; - --theme-l: 50%; - - --theme: hsl(var(--theme-h), var(--theme-s), var(--theme-l)); - --muted: hsl(var(--theme-h), 15%, 15%); - - --font-family: sans-serif, "Roboto"; - --line-height: 1.5; - --font-weight: 400; - --font-size: 20px; - --border-color: var(--theme); - --border-radius: 0rem; - --border-width: 1px; - --spacing: 1rem; -} - -[data-theme="light"], -:root:not([data-theme="dark"]) { - --theme-light: hsl(var(--theme-h), var(--theme-s), calc(var(--theme-l) + 35%)); - --theme-dark: hsl(var(--theme-h), var(--theme-s), calc(var(--theme-l) - 35%)); - - --background: hsl(var(--theme-h), 0%, 95%); - --foreground: hsl(var(--theme-h), 0%, 5%); - - --muted: hsl(var(--theme-h), 15%, 75%); -} - -[data-theme="dark"] { - --theme-light: hsl(var(--theme-h), var(--theme-s), calc(var(--theme-l) - 35%)); - --theme-dark: hsl(var(--theme-h), var(--theme-s), calc(var(--theme-l) + 35%)); - - --background: hsl(var(--theme-h), 50%, 5%); - --foreground: hsl(var(--theme-h), 20%, 90%); -} - -*, *:before, *:after { box-sizing: border-box; } - -html,body { - background: var(--background); - color: var(--foreground); - margin: 0; - padding: 0; - font-family: var(--font-family); - font-size: var(--font-size); - font-weight: var(--font-weight); - line-height: var(--line-height); - box-sizing: border-box; - padding: 0; -} - -img,embed,iframe,object,audio,video { - height: auto; - max-width: 100%; - border: none; -} - -main { - margin: calc((100vh / 25) * 1.5) calc((100vw / 25) * 1.5); - padding: var(--spacing); - height:100vh; -} - -table { - background-color: var(--background); - border-collapse: collapse; - border-spacing: 0; - width: 100%; -} - -tbody { - border-top: 2px solid var(--theme); - border-top: 2px solid var(--theme); -} - -th {text-align: left;color: var(--theme-dark)} - -th, td { - padding: calc(var(--spacing) / 2); - border-bottom: 1px solid var(--theme) -} - -a {color: var(--theme)} -a:hover {color: var(--foreground)} - -blockquote { - margin: var(--spacing) 0; - border-left: calc(var(--spacing) / 2) solid var(--theme-dark); - background: hsl(var(--theme-h) var(--theme-s) var(--theme-l)); - color: var(--background); - padding: var(--spacing); -} - -pre, code, kbd { - font-family: monospace; - display: inline-block; - white-space: pre; - margin: 0; - padding: 0; -} - -code { - margin: 0 calc(var(--spacing) / 4); - padding: 0 calc(var(--spacing) / 4); - background: var(--background); -} - -hr { - color: var(--theme); - border: 1px solid; -} - -h1,h2,h3,h4,h5,h6 {text-transform: capitalize;} -h1 {font-size: calc(var(--font-size) * 2); color: var(--theme-dark)} -h2 {color: var(--theme)} -h3 {border-bottom: 1px solid var(--theme);} - -small {color: var(--muted)} - -section { - margin-bottom: var(--spacing); -} - -article { - padding: var(--spacing); - background-color: var(--theme-light); -} - -label { - font-size: var(--font-size); - font-weight: 600; - text-transform: capitalize; - color: var(--foreground); - margin: 0 calc(var(--spacing) / 2); -} - -input { - display: block; - outline: none; - box-sizing: border-box; - font-size: var(--font-size); - background-color: var(--background); - color: var(--foreground); - width: 100%; - height: calc(var(--font-size) * 3); - border: 1px solid var(--theme); - border-radius: var(--border-radius); - padding: var(--spacing); - margin-bottom: var(--spacing); - margin-right: var(--spacing); -} - -input:disabled { - background: var(--muted); - color: var(--background); - cursor:not-allowed; -} - -input[type="checkbox"], -input[type="radio"] { - display: inline-block; - padding: 0; - margin: 0; - width: var(--spacing); - height: var(--spacing); -} - -input[type="submit"] { - font-size: var(--font-size); - height: calc(var(--font-size) * 3); - padding: var(--spacing) calc(var(--spacing) / 2); - margin: var(--spacing) 0; - cursor: pointer; -} - -input[type="submit"] { - background-color: var(--theme); - color: var(--background); -} - -button, select, textarea { - display: inline-block; - outline: none; - font-family: var(--font-family); - font-size: var(--font-size); - height: calc(var(--font-size) * 3); - width: 100%; - border: 1px solid var(--theme); - color: var(--theme); - background-color: var(--background); - border-radius: var(--border-radius); - padding: var(--spacing); - margin-bottom: var(--spacing); - cursor: pointer; -} - -select { - background: var(--background) no-repeat 100%; - color: var(--foreground); - appearance: none; - background-size: 1ex; - background-origin: content-box; - background-image: url("data:image/svg+xml;utf8,"); -} - -textarea { - overflow: auto; - resize: vertical; - border: 1px solid var(--theme); - height: calc(var(--line-height) * 6rem); - cursor: text; - color: var(--foreground); -} - -.grid { - display: grid; - gap: var(--spacing); - grid-template-columns: repeat(auto-fit, minmax(0%, 1fr)); -} \ No newline at end of file