kausban.com

Source of www.kausban.com
git clone https://git.kausban.com/kausban.com/raw/.git
Log | Files | Refs

retro.css (2311B)


      1 /* Base */
      2 html,
      3 body {
      4     background-color: #222;
      5     min-height: 100%;
      6     line-height: 1.5;
      7 }
      8 
      9 body {
     10     color: #fafafa;
     11     font-family: "Courier New";
     12 }
     13 
     14 ::selection {
     15     background-color:  #2ecc40;
     16     color: white;
     17 }
     18 
     19 /* Responsive content positioning */
     20 @media only screen and (min-width: 1020px) /* Large screens */
     21 {
     22     body{
     23         padding: 10vh 25vw;
     24     }
     25 }
     26 
     27 @media only screen and (max-width: 1020px) and (min-width: 750px) /* Small screens */
     28 {
     29     body{
     30         padding: 5vh 10vw;
     31     }
     32 }
     33 
     34 @media only screen and (max-width: 750px) /* Small screens */
     35 {
     36     body{
     37         padding: 2vh 5vw;
     38     }
     39 }
     40 
     41 /* Headers */
     42 h1{font-size: 2.5rem;}
     43 h2{font-size: 1.7rem;}
     44 h1 > .subtitle, h3, h4, h5, h6{font-size: 1.3rem;}
     45 
     46 .title{
     47     margin-bottom: 2.5rem;
     48 }
     49 
     50 /* Padding & Margin */
     51 * {margin: 0; padding: 0;}
     52 pre, blockquote, ul, ol, p, table{
     53     margin: 1rem 0;
     54 }
     55 
     56 h1, h2{margin-top: 2rem; line-height: 2rem;}
     57 h3, h4, h5, h6{margin-top: 1rem;}
     58 
     59 
     60 /* Links  */
     61 a, a:visited {
     62     color: #01ff70;
     63     text-decoration: underline;
     64 }
     65 
     66 a:hover, a:focus, a:active {
     67     color: #2ecc40;
     68 }
     69 
     70 /* Code */
     71 pre {
     72     font-family: "Courier New";
     73     padding: .5rem;
     74     background-color: #333;
     75     padding: 0.5rem;
     76     border-radius: 0.2rem;
     77     font-size: 0.9rem;
     78     color: #EEE;
     79     overflow-x: auto;
     80 }
     81 
     82 .org-keyword{
     83     color: #01ff70;
     84 }
     85 
     86 .org-rainbow-delimiters-depth-1{
     87     color: #2ecc40;
     88 }
     89 
     90 .org-rainbow-delimiters-depth-2{
     91     color: #01ff70;
     92 }
     93 
     94 /* Blockquotes */
     95 blockquote {
     96     border-left: 3px solid #01ff70;
     97     padding-left: 1rem;
     98 }
     99 
    100 li{
    101     list-style-position: inside;
    102 }
    103 
    104 /* Tags */
    105 .tag{
    106     margin-top: 0.5rem;
    107     display: block;
    108     color: white;
    109     font-size: var(--font-size-xsmall);
    110 }
    111 
    112 .tag > span{
    113 		font-weight: 400;
    114     font-size: 0.8rem;
    115     background-color: #444;
    116     text-transform: uppercase;
    117     border-radius: 2px;
    118     width: fit-content;
    119     height: auto;
    120     padding: 1px 5px;
    121 }
    122 
    123 /* Keywords */
    124 .todo{
    125     color: #2ecc40;
    126 }
    127 
    128 .done{
    129     color: #444;
    130 }
    131 
    132 /* Overflows */
    133 .outline-text-2, .outline-text-3, .outline-text-4{
    134 	  max-width: 100%;
    135 	  overflow-x: auto;
    136 }
    137 
    138 /* Table */
    139 tr:nth-child(even) {
    140     background-color: #333;
    141 }
    142 
    143 th, td{
    144     padding: 0.5rem;
    145     text-align: center;
    146 }
    147 
    148 .underline{
    149     text-decoration: underline;
    150 }
    151 
    152 img{
    153     max-width: 100%;
    154     height: auto;
    155 }