stargazer-ui 1.5.21 → 1.5.23

package/src/styles/_reset.scss

@@ -0,0 +1,239 @@
+@use "sass:color";
+@use "sass:map";
+
+:root {
+  --sg-body-bg: #212529;
+  --sg-body-color: white;
+  --sg-nav-color: #1a1b1d;
+  --sg-code-color: #fc5d5d;
+  --sg-font-monospace: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
+  --sg-highlight-bg: #fff3cd;
+  --sg-link-color: #fc5d5d;// #4D9DE0;// #0d6efd;
+  --sg-link-hover-color: color.mix(black, #E15554, 15%);// #62a4da;// #0a58ca;
+
+  --sg-primary: rgb(73, 149, 213);
+  --sg-secondary: rgb(108, 117, 125);
+  --sg-success: rgb(31, 173, 97); //hsl(148, 50%, 46%)
+  --sg-info: rgb(145, 132, 189);
+  --sg-warning: rgb(224, 188, 41);
+  --sg-danger: rgb(252, 95, 95);
+  --sg-light: rgb(248, 249, 250);
+  --sg-dark: rgb(33, 37, 41);
+
+  --red-2: rgb(248, 113, 113);
+  --orange-2: rgb(251 146 60);
+  --yellow-2: rgb(251 191 36);
+
+  --nav-bar-height: 3.5rem;
+  --tab-controls-height: 2.5rem;
+  --column-header-height: 2rem;
+
+	//font-size: 18px;
+	line-height: 1.4;
+	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
+		'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
+		sans-serif;
+	-webkit-font-smoothing: antialiased;
+	-moz-osx-font-smoothing: grayscale;
+}
+
+html {
+    overflow: hidden;
+}
+body {
+	margin: 0;
+	padding: 0;
+    height: 100dvh;
+	color: var(--sg-body-color);
+	background-color: var(--sg-body-bg);
+}
+
+
+#root {
+	height: 100%;
+	overflow: auto;
+}
+
+.visually-hidden {
+	border: 0;
+	clip: rect(0 0 0 0);
+	height: auto;
+	margin: 0;
+	overflow: hidden;
+	padding: 0;
+	position: absolute;
+	width: 1px;
+	white-space: nowrap;
+}
+
+::-webkit-scrollbar {
+	display: none;
+}
+
+.full-width {
+	width: 100%;
+}
+.top-left-grid {
+	border-top-left-radius: 0.375rem;
+	border-bottom-left-radius: 0;
+}
+.top-right-grid {
+	border-top-right-radius: 0.375rem;
+	border-bottom-right-radius: 0;
+}
+.middle-grid {
+	border-radius: 0;
+}
+.bottom-left-grid {
+	border-bottom-left-radius: 0.375rem;
+	border-top-left-radius: 0;
+}
+.bottom-right-grid {
+	border-bottom-right-radius: 0.375rem;
+	border-top-right-radius: 0;
+}
+
+:focus-visible {
+  //z-index: 9999;
+}
+.flex-column {
+  display: flex;
+  flex-direction: column;
+}
+.flex-row {
+  display: flex;
+  flex-direction: row;
+}
+
+.test-red {
+  background-color: red;
+}
+
+* {
+  box-sizing: border-box;
+  scrollbar-color: var(--sg-link-color) rgba(0,0,0,0);
+  scrollbar-width: thin;
+}
+
+dialog {
+  padding: 0;
+  margin: 0;
+  color: inherit
+}
+
+input, textarea, select {
+  font-size: 1rem * 0.85;
+  font-family: inherit;
+}
+
+button {
+  cursor: pointer;
+  font-size: calc(1rem * 0.85);
+  font-family: inherit;
+}
+
+hr {
+  margin: 0.5rem 0;
+  color: inherit;
+  border: 0;
+  border-top: 1px solid;
+  opacity: 0.25;
+}
+
+h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1 {
+    margin-top: 0;
+    margin-bottom: 0.5rem;
+    font-weight: 500;
+    line-height: 1.2;
+}
+
+h1, .h1 {
+    --unit: 1rem;
+    font-size: calc(1.375*var(--unit) + 1.5vw);
+}
+h2, .h2 {
+    --unit: 1rem;
+    font-size: calc(1.325*var(--unit) + 0.9vw);
+}
+h3, .h3 {
+    --unit: 1rem;
+    font-size: calc(1.3*var(--unit) + 0.6vw);
+}
+h4, .h4 {
+    --unit: 1rem;
+    font-size: calc(1.275*var(--unit) + 0.3vw);
+}
+h5, .h5 {
+    --unit: 1rem;
+    font-size: calc(1.25*var(--unit));
+}
+h6, .h6 {
+    --unit: 1rem;
+    font-size: calc(1*var(--unit));
+}
+@media (min-width: 1200px) {
+    h1, .h1 {
+        font-size: calc(2.5*var(--unit));
+    }
+    h2, .h2 {
+        font-size: calc(2*var(--unit));
+    }
+    h3, .h3 {
+        font-size: calc(1.75*var(--unit));
+    }
+    h4, .h4 {
+        font-size: calc(1.5*var(--unit));
+    }
+}
+
+p {
+  margin-top: 0;
+  margin-bottom: 1rem;
+}
+
+ol, ul, dl {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+
+dt {
+  font-weight: 700;
+}
+
+dd {
+  margin-bottom: 0.5rem;
+  margin-left: 0;
+}
+
+b, strong {
+  font-weight: bolder;
+}
+
+a {
+  color: var(--sg-link-color);
+  text-decoration: underline;
+}
+a:hover {
+  color: var(--sg-link-hover-color);
+}
+
+img, svg {
+  vertical-align: middle;
+}
+
+label {
+  display: inline-block;
+}
+
+fieldset {
+    min-width: 0;
+    text-overflow: ellipsis;
+    overflow: hidden;
+}
+legend {
+    min-width: 0;
+    max-width: 100%;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    overflow: hidden;
+}