Hello kids
diff --git a/src/style.css b/src/style.css index e0c88d1..e0eb2d7 100644 --- a/src/style.css +++ b/src/style.css @@ -790,6 +790,10 @@ video { margin-top: 1.5rem; } +.ml-8 { + margin-left: 2rem; +} + .box-border { box-sizing: border-box; } @@ -1187,6 +1191,11 @@ video { border-color: rgb(var(--background) / 0.95); } +.border-black { + --tw-border-opacity: 1; + border-color: rgb(var(--black) / var(--tw-border-opacity)); +} + .border-cursor { --tw-border-opacity: 1; border-color: rgb(var(--cursor) / var(--tw-border-opacity)); @@ -1382,21 +1391,11 @@ video { border-color: rgb(var(--selection_background) / 0.95); } -.border-brightwhite { - --tw-border-opacity: 1; - border-color: rgb(var(--brightwhite) / var(--tw-border-opacity)); -} - .border-white { --tw-border-opacity: 1; border-color: rgb(var(--white) / var(--tw-border-opacity)); } -.border-black { - --tw-border-opacity: 1; - border-color: rgb(var(--black) / var(--tw-border-opacity)); -} - .bg-background { --tw-bg-opacity: 1; background-color: rgb(var(--background) / var(--tw-bg-opacity)); @@ -1467,9 +1466,14 @@ video { background-color: rgb(var(--black) / var(--tw-bg-opacity)); } -.bg-blue { +.bg-brightblack { --tw-bg-opacity: 1; - background-color: rgb(var(--blue) / var(--tw-bg-opacity)); + background-color: rgb(var(--brightblack) / var(--tw-bg-opacity)); +} + +.bg-brightwhite { + --tw-bg-opacity: 1; + background-color: rgb(var(--brightwhite) / var(--tw-bg-opacity)); } .bg-cursor { @@ -1602,6 +1606,21 @@ video { background-color: rgb(var(--foreground) / 0.95); } +.bg-green { + --tw-bg-opacity: 1; + background-color: rgb(var(--green) / var(--tw-bg-opacity)); +} + +.bg-magenta { + --tw-bg-opacity: 1; + background-color: rgb(var(--magenta) / var(--tw-bg-opacity)); +} + +.bg-red { + --tw-bg-opacity: 1; + background-color: rgb(var(--red) / var(--tw-bg-opacity)); +} + .bg-selection_background { --tw-bg-opacity: 1; background-color: rgb(var(--selection_background) / var(--tw-bg-opacity)); @@ -1672,34 +1691,22 @@ video { background-color: rgb(var(--selection_foreground) / var(--tw-bg-opacity)); } -.bg-brightwhite { - --tw-bg-opacity: 1; - background-color: rgb(var(--brightwhite) / var(--tw-bg-opacity)); -} - -.bg-red { - --tw-bg-opacity: 1; - background-color: rgb(var(--red) / var(--tw-bg-opacity)); -} - -.bg-brightblack { - --tw-bg-opacity: 1; - background-color: rgb(var(--brightblack) / var(--tw-bg-opacity)); -} - -.bg-green { - --tw-bg-opacity: 1; - background-color: rgb(var(--green) / var(--tw-bg-opacity)); -} - .bg-yellow { --tw-bg-opacity: 1; background-color: rgb(var(--yellow) / var(--tw-bg-opacity)); } -.bg-magenta { +.bg-white { --tw-bg-opacity: 1; - background-color: rgb(var(--magenta) / var(--tw-bg-opacity)); + background-color: rgb(var(--white) / var(--tw-bg-opacity)); +} + +.bg-opacity-50 { + --tw-bg-opacity: 0.5; +} + +.bg-opacity-0 { + --tw-bg-opacity: 0; } .p-1 { @@ -1718,6 +1725,10 @@ video { padding: 1rem; } +.p-1\.5 { + padding: 0.375rem; +} + .px-1 { padding-left: 0.25rem; padding-right: 0.25rem; @@ -1992,9 +2003,9 @@ video { color: rgb(var(--black) / var(--tw-text-opacity)); } -.text-blue { +.text-brightred { --tw-text-opacity: 1; - color: rgb(var(--blue) / var(--tw-text-opacity)); + color: rgb(var(--brightred) / var(--tw-text-opacity)); } .text-brightwhite { @@ -2067,11 +2078,6 @@ video { color: rgb(var(--cursor) / 0.95); } -.text-cyan { - --tw-text-opacity: 1; - color: rgb(var(--cyan) / var(--tw-text-opacity)); -} - .text-foreground { --tw-text-opacity: 1; color: rgb(var(--foreground) / var(--tw-text-opacity)); @@ -2217,16 +2223,6 @@ video { color: rgb(var(--white) / var(--tw-text-opacity)); } -.text-brightred { - --tw-text-opacity: 1; - color: rgb(var(--brightred) / var(--tw-text-opacity)); -} - -.text-brightblack { - --tw-text-opacity: 1; - color: rgb(var(--brightblack) / var(--tw-text-opacity)); -} - .underline { text-decoration-line: underline; } @@ -2239,16 +2235,6 @@ video { text-underline-offset: 4px; } -.placeholder-blue::-moz-placeholder { - --tw-placeholder-opacity: 1; - color: rgb(var(--blue) / var(--tw-placeholder-opacity)); -} - -.placeholder-blue::placeholder { - --tw-placeholder-opacity: 1; - color: rgb(var(--blue) / var(--tw-placeholder-opacity)); -} - .placeholder-brightwhite::-moz-placeholder { --tw-placeholder-opacity: 1; color: rgb(var(--brightwhite) / var(--tw-placeholder-opacity)); @@ -2259,8 +2245,14 @@ video { color: rgb(var(--brightwhite) / var(--tw-placeholder-opacity)); } -.opacity-50 { - opacity: 0.5; +.placeholder-white::-moz-placeholder { + --tw-placeholder-opacity: 1; + color: rgb(var(--white) / var(--tw-placeholder-opacity)); +} + +.placeholder-white::placeholder { + --tw-placeholder-opacity: 1; + color: rgb(var(--white) / var(--tw-placeholder-opacity)); } .outline { @@ -2288,6 +2280,16 @@ video { transition-duration: 150ms; } +.transition-colors { + transition-property: color, background-color, border-color, text-decoration-color, fill, stroke; + transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); + transition-duration: 150ms; +} + +.duration-200 { + transition-duration: 200ms; +} + .hover\:bg-background:hover { --tw-bg-opacity: 1; background-color: rgb(var(--background) / var(--tw-bg-opacity)); @@ -2298,16 +2300,6 @@ video { background-color: rgb(var(--brightblack) / var(--tw-bg-opacity)); } -.hover\:bg-foreground:hover { - --tw-bg-opacity: 1; - background-color: rgb(var(--foreground) / var(--tw-bg-opacity)); -} - -.hover\:bg-green:hover { - --tw-bg-opacity: 1; - background-color: rgb(var(--green) / var(--tw-bg-opacity)); -} - .hover\:bg-brightgreen:hover { --tw-bg-opacity: 1; background-color: rgb(var(--brightgreen) / var(--tw-bg-opacity)); @@ -2318,9 +2310,9 @@ video { background-color: rgb(var(--brightmagenta) / var(--tw-bg-opacity)); } -.hover\:bg-selection_foreground:hover { +.hover\:bg-foreground:hover { --tw-bg-opacity: 1; - background-color: rgb(var(--selection_foreground) / var(--tw-bg-opacity)); + background-color: rgb(var(--foreground) / var(--tw-bg-opacity)); } .hover\:bg-selection_background:hover { @@ -2328,6 +2320,15 @@ video { background-color: rgb(var(--selection_background) / var(--tw-bg-opacity)); } +.hover\:bg-white:hover { + --tw-bg-opacity: 1; + background-color: rgb(var(--white) / var(--tw-bg-opacity)); +} + +.hover\:fill-black:hover { + fill: rgb(var(--black) / 1); +} + .hover\:text-background:hover { --tw-text-opacity: 1; color: rgb(var(--background) / var(--tw-text-opacity)); @@ -2343,6 +2344,11 @@ video { color: rgb(var(--selection_foreground) / var(--tw-text-opacity)); } +.hover\:text-black:hover { + --tw-text-opacity: 1; + color: rgb(var(--black) / var(--tw-text-opacity)); +} + .focus\:outline-none:focus { outline: 2px solid transparent; outline-offset: 2px; @@ -2368,6 +2374,13 @@ video { border-right-width: 0px; } +@media (prefers-color-scheme: dark) { + .dark\:text-white { + --tw-text-opacity: 1; + color: rgb(var(--white) / var(--tw-text-opacity)); + } +} + @media (min-width: 640px) { .sm\:my-1 { margin-top: 0.25rem;