gitshow

Log | Files | Refs

style.css (1739B)

      1 :root {
      2   font-family: monospace;
      3   --color-gray: #D7D9D7;
      4   --color-lightgreen: #109648;
      5   --color-green: #334139;
      6   --color-purple: #8A4FFF;
      7   --color-lightpurple: #D6C2FF;
      8   --color-brown: #6E4555;
      9 
     10   --chroma-kw: var(--color-purple);
     11   --chroma-const: var(--color-lightgreen);
     12 }
     13 
     14 #reponame {
     15   cursor: pointer;
     16 }
     17 
     18 /* Tree page */
     19 .tree-file {
     20   cursor: pointer;
     21 }
     22 
     23 .tree-kind {
     24   color: gray;
     25   padding-right: 10px;
     26 }
     27 
     28 /* Commit page */
     29 .commit-hash {
     30   cursor: pointer;
     31   color: gray;
     32   padding-right: 20px;
     33 }
     34 
     35 .commit-message {
     36   width: 30em;
     37 }
     38 
     39 /* Inspired from HTMX tab example */
     40 #tab-list {
     41   border-bottom: solid 3px lightgray;
     42 }
     43 
     44 #tab-list button {
     45   border: none;
     46   padding: 5px 10px;
     47   cursor: pointer;
     48 }
     49 
     50 #tab-list button.selected {
     51   background: lightgray;
     52 }
     53 
     54 /* Various things that hover */
     55 
     56 .tree-file:hover,
     57 .commit-hash:hover,
     58 #tab-list button:hover,
     59 .chroma .lnlinks:hover,
     60 #reponame:hover
     61 {
     62   transition: 0.2s;
     63   color: var(--color-purple);
     64 }
     65 
     66 .tree-file,
     67 .commit-hash,
     68 #tab-list button,
     69 .chroma .lnlinks,
     70 #reponame {
     71   transition: 0.2s;
     72 }
     73 
     74 /* Chroma related styles for file highlighting */
     75 .chroma .lnlinks {
     76   padding-right: 10px;
     77   text-decoration: none;
     78   color: gray;
     79 }
     80 
     81 /* This allows to easily see the link that has a link to it */
     82 .chroma span.line:has(span.ln:target) {
     83    background-color: var(--color-lightpurple);
     84 }
     85 
     86 .chroma .k {
     87   color: var(--chroma-kw);
     88 }
     89 
     90 .chroma .kc {
     91   color: var(--chroma-const);
     92 }
     93 
     94 .chroma .s {
     95   color: var(--chroma-const);
     96 }
     97 
     98 .chroma .o {
     99   color: var(--color-brown);
    100 }
    101 
    102 .chroma .kd {
    103   color: var(--chroma-kw);
    104 }
    105 
    106 .chroma .kn {
    107   color: var(--chroma-kw);
    108 }
    109 
    110 .chroma .kp {
    111   color: var(--chroma-kw);
    112 }
    113 
    114 .chroma .kr {
    115   color: var(--chroma-kw);
    116 }
    117 
    118 .chroma .c1 {
    119   color: gray;
    120 }