yosup/css/utils.css
Thomas Mathews a78d80d118 This repo now only contains the web app.
I did this because they are 2 separate concerns and I have diverged
so far from the original repo. I didn't start a new repo because it
contains valuable history of all the people who contributed to it.

Additionally if there is an issue with this we can revert, but I
rather not. Forks are forks.
2022-12-22 11:07:35 -08:00

92 lines
1.3 KiB
CSS

.flex-fill {
flex: auto;
}
.flex-noshrink {
/*flex-shrink: 0;*/
flex: none;
}
.hide {
display: none !important;
}
.loader {
font-size: 24px;
}
button.action:disabled {
cursor: default;
background-color: var(--clrTextLight);
}
button {
background: #171717;
cursor: pointer;
}
button.icon {
border: none;
background: transparent;
padding: 0;
margin: 0;
}
button.icon > img.icon {
/* Remove the space below the image. */
display: block;
margin: 0 auto;
}
button.action {
border: none;
border-radius: 50px;
background: var(--clrBgAction);
padding: 10px 15px;
font-size: 16px;
color: var(--clrTextAction);
font-weight: 800;
}
img.icon {
width: var(--iconSize);
height: var(--iconSize);
}
img.icon.small {
width: var(--iconSizeSmall);
height: var(--iconSizeSmall);
}
.float-right {
float: right;
}
.clickable {
cursor: pointer;
}
.bottom-border { /* TODO rename to bdr-bottom */
border-bottom: solid 1px var(--clrBorder);
}
.sticky {
position: sticky;
top: 0;
}
.event-message {
background: var(--clrEvMsg);
padding: 7px;
border-radius: 12px;
color: var(--clrTextEvMsg);
}
.flex {
display: flex;
}
/* Icon */
img.invert {
/* This class is good for white on black icons; */
filter: invert(1);
}
@media (prefers-color-scheme: dark) {
img.dark-invert {
filter: invert(1);
}
img.invert, img.svg.invert {
filter: initial;
}
}