zed/crates/collab/styles.css
Nathan Sobo ab8204368c Rename zed-server to collab
Over time, I think we may end up having multiple services, so it seems like a good opportunity to name this one more specifically while the cost is low. It just seems like naming it "zed" and "zed-server" leaves it a bit open ended.
2022-04-09 08:30:42 -06:00

137 lines
2.4 KiB
CSS

/* This file is compiled to /assets/styles/tailwind.css via script/tailwind */
@import url("https://fonts.googleapis.com/css2?family=Spectral:ital,wght@0,200;0,300;1,200;1,300&display=swap");
@import url("https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,100;0,300;0,600;1,100;1,300;1,600&display=swap");
@tailwind base;
@tailwind components;
@tailwind utilities;
@layer base {
html {
font-size: 110%;
text-rendering: geometricPrecision;
}
@media screen and (min-width: 1024px) {
html {
font-size: 125%;
}
}
h1 {
@apply text-4xl;
@apply tracking-tighter;
}
h2 {
@apply text-3xl;
@apply tracking-tighter;
}
h3 {
@apply text-2xl;
@apply tracking-tighter;
}
h4 {
@apply text-xl;
}
.underline,
.hover\:underline:hover {
text-underline-offset: 6px;
}
@media screen and (min-width: 1024px) {
.text-columns-2 {
column-count: 2;
column-gap: 3rem;
}
}
.site-nav a:not(.active) .nav-active-arrow {
display: none;
}
.site-nav a.active .nav-active-arrow {
display: flex;
}
.site-mobile-nav a.active {
font-weight: bold;
}
.text-columns-2 {
-webkit-column-break-inside: avoid;
page-break-inside: avoid;
break-inside: avoid;
}
.text-columns-2 p {
break-inside: avoid;
}
.alternate-bg:nth-of-type(even) {
background-color: rgba(255,255,255,0.06);
}
/* div:not(.type-prose) code {
background-color: rgba(255,255,255,0.15);
padding: 0px 4px;
border-radius: 2px;
color: #eee;
} */
/* This fixes scrollbar jump */
@media screen and (min-width: 960px) {
html {
margin-left: calc(100vw - 100%);
margin-right: 0;
}
}
:root {
--color: white;
--disabled: #959495;
}
.checkbox {
color: var(--color);
}
.checkbox--disabled {
color: var(--disabled);
}
.checkbox__control {
width: 30px;
height: 30px;
}
.checkbox__control svg {
transform: scale(0);
transform-origin: center center;
}
.checkbox__brackets {
left: -1px;
top: -1px;
}
.checkbox__input input {
opacity: 0;
width: 30px;
height: 30px;
}
.checkbox__input input:focus + .checkbox__control {
box-shadow: 0 0 0 2px #000, 0 0 0 4px #3b57bc99
}
.checkbox__input input:checked + .checkbox__control svg {
transform: scale(1);
}
.checkbox__input input:disabled + .checkbox__control {
color: var(--disabled);
}
}