cq

Distributed social media platform
git clone git://git.finwo.net/app/cq
Log | Files | Refs

global.css (2097B)

      1 :root {
      2   --col-bg: black;
      3   --col-fg: white;
      4 }
      5 
      6 @media (prefers-color-scheme: light) {
      7   :root {
      8     --col-bg: white;
      9     --col-fg: black;
     10   }
     11 }
     12 
     13 :root {
     14   background: var(--col-bg);
     15   color: var(--col-fg);
     16   font-family: Karla, sans-serif;
     17   font-size: x-large;
     18   font-optical-sizing: auto;
     19   font-weight: 400;
     20   font-style: normal;
     21   line-height:1.414em;
     22 }
     23 
     24 * {
     25   box-sizing: border-box;
     26   font-size: inherit;
     27   font-weight: inherit;
     28 }
     29 
     30 body {
     31   margin: 0;
     32   padding: 0;
     33 }
     34 
     35 h1 { font-size: 2.828rem; }
     36 h2 { font-size: 2.000rem; }
     37 h3 { font-size: 1.414rem; }
     38 h4 { font-size: 1.000rem; }
     39 h5 { font-size: 0.841rem; }
     40 h6 { font-size: 0.707rem; }
     41 
     42 h1, h2, h3, h4, h5, h6, legend, label {
     43   font-weight: 500;
     44 }
     45 
     46 small {
     47   font-size: 0.75em;
     48   font-weight: 500;
     49   color: color-mix(in srgb, var(--col-fg), transparent 30%);
     50 }
     51 
     52 a {
     53   color: inherit;
     54   text-decoration: underline;
     55 }
     56 
     57 input:focus,
     58 select:focus,
     59 textarea:focus,
     60 button:focus,
     61 .btn:focus {
     62     outline: none;
     63 }
     64 
     65 .main {
     66   max-width: 640px;
     67   margin: 0 auto;
     68   position: relative;
     69   > * {
     70     margin: 1rem;
     71   }
     72 }
     73 
     74 .btn, button {
     75   border: 2px solid var(--col-fg);
     76   background: var(--col-fg);
     77   color: var(--col-bg);
     78   margin: 1em;
     79   padding: 0.25em 0.5em;
     80   cursor: pointer;
     81   text-decoration: none;
     82   &:active {
     83     background: var(--col-bg);
     84     color: var(--col-fg);
     85   }
     86 }
     87 
     88 input {
     89   background: transparent;
     90   padding: 0.5em 0px;
     91   color: inherit;
     92   border: none;
     93   border-radius: 0;
     94   border-bottom: 2px solid var(--col-fg);
     95 }
     96 
     97 .entry-list {
     98   > a {
     99     cursor: pointer;
    100     text-decoration: none;
    101   }
    102   > * {
    103     padding: 1em;
    104     border-top: 1px solid color-mix(in srgb, var(--col-fg), transparent 50%);
    105     &:hover {
    106       background: color-mix(in srgb, var(--col-fg), transparent 90%);
    107     }
    108   }
    109 }
    110 
    111 /*
    112 .accountListDeleteButton {
    113   display: none;
    114   cursor: pointer;
    115   float: right;
    116   &:hover {
    117     stroke: #F00 !important;
    118   }
    119 }
    120 #accountSelectList > * {
    121   padding: 1em;
    122   border-top: 1px solid #FFF8;
    123   cursor: pointer;
    124   &:hover {
    125     background: #FFF2;
    126     > .accountListDeleteButton {
    127       display: inline-block;
    128     }
    129   }
    130 }
    131 */