utils.css (1370B)
1 .flex-fill { 2 flex: auto; 3 } 4 .flex-noshrink { 5 /*flex-shrink: 0;*/ 6 flex: none; 7 } 8 9 .hide { 10 display: none !important; 11 } 12 13 .loader { 14 font-size: 24px; 15 } 16 17 button.action:disabled { 18 cursor: default; 19 background-color: var(--clrTextLight); 20 } 21 button { 22 background: #171717; 23 cursor: pointer; 24 } 25 button.icon { 26 border: none; 27 background: transparent; 28 padding: 0; 29 margin: 0; 30 } 31 button.icon > img.icon { 32 /* Remove the space below the image. */ 33 display: block; 34 margin: 0 auto; 35 } 36 button.action { 37 border: none; 38 border-radius: 50px; 39 background: var(--clrBgAction); 40 padding: 10px 15px; 41 font-size: 16px; 42 color: var(--clrTextAction); 43 font-weight: 800; 44 } 45 46 img.icon { 47 width: var(--iconSize); 48 height: var(--iconSize); 49 } 50 img.icon.small { 51 width: var(--iconSizeSmall); 52 height: var(--iconSizeSmall); 53 } 54 55 .float-right { 56 float: right; 57 } 58 .clickable { 59 cursor: pointer; 60 } 61 .bottom-border { /* TODO rename to bdr-bottom */ 62 border-bottom: solid 1px var(--clrBorder); 63 } 64 .sticky { 65 position: sticky; 66 top: 0; 67 } 68 .event-message { 69 background: var(--clrEvMsg); 70 padding: 7px; 71 border-radius: 12px; 72 color: var(--clrTextEvMsg); 73 } 74 .flex { 75 display: flex; 76 } 77 78 /* Icon */ 79 80 img.invert { 81 /* This class is good for white on black icons; */ 82 filter: invert(1); 83 } 84 85 @media (prefers-color-scheme: dark) { 86 img.dark-invert { 87 filter: invert(1); 88 } 89 img.invert, img.svg.invert { 90 filter: initial; 91 } 92 }