d0tsearch

custom d3.js startpage
Log | Files | Refs | README | LICENSE

style.css (1893B)

      1 @font-face {
      2     font-family: "Roboto Mono";
      3     src: url("../fonts/roboto-mono-medium.ttf");
      4 }
      5 
      6 :root {
      7     --font: "Roboto Mono";
      8     --background: #0f0e17;
      9     --foreground: #fffffe;
     10     --pink: #e53170;
     11     --red: #f25f4c;
     12     --orange: #ff8906;
     13     --branch: 1px solid #a7a9be;
     14 }
     15 
     16 html {
     17     font-size: 18px;
     18     overflow: hidden;
     19 }
     20 
     21 body {
     22     background: var(--background);
     23     width: 100vw;
     24     height: 100vh;
     25     margin: 0;
     26     display: flex;
     27     justify-content: center;
     28     align-items: center;
     29 }
     30 
     31 .prompt {
     32     font-family: var(--font);
     33     color: var(--foreground);
     34 }
     35 
     36 .prompt~.prompt {
     37     padding: 1.5rem 0 0.3125rem;
     38 }
     39 
     40 span {
     41     color: var(--pink);
     42 }
     43 
     44 h1 {
     45     display: inline;
     46     font-family: var(--font);
     47     font-size: 1rem;
     48     font-weight: normal;
     49     color: var(--red);
     50     cursor: pointer;
     51 }
     52 
     53 .tree>ul {
     54     margin: 0;
     55     padding-left: 1rem;
     56 }
     57 
     58 ul {
     59     list-style: none;
     60     padding-left: 2.5rem;
     61 }
     62 
     63 li {
     64     position: relative;
     65 }
     66 
     67 li.hideChildren>ul {
     68     display: none;
     69 }
     70 
     71 li::before,
     72 li::after {
     73     content: "";
     74     position: absolute;
     75     left: -0.75rem;
     76 }
     77 
     78 li::before {
     79     border-top: var(--branch);
     80     top: 0.75rem;
     81     width: 0.5rem;
     82 }
     83 
     84 li::after {
     85     border-left: var(--branch);
     86     height: 100%;
     87     top: 0.25rem;
     88 }
     89 
     90 li:last-child::after {
     91     height: 0.5rem;
     92 }
     93 
     94 a {
     95     font-family: var(--font);
     96     font-size: 1rem;
     97     color: var(--foreground);
     98     text-decoration: none;
     99     outline: none;
    100 }
    101 
    102 a:hover,
    103 a:focus {
    104     color: var(--background);
    105     background: var(--orange);
    106 }
    107 
    108 form h1 {
    109     padding-left: 0.125rem;
    110 }
    111 
    112 /* you can fill the texarea above/below? the Viewport */
    113 #search {
    114     font-family: var(--font);
    115     font-size: 1rem;
    116     color: var(--foreground);
    117     background-color: var(--background);
    118     border: none;
    119     outline: none;
    120     position: absolute;
    121     width: 50vw;
    122     height: 50vh;
    123     word-break: break-all;
    124     resize: none;
    125 }