style.scm (4013B)
1 (define-module (style) 2 #:export (stylesheet 3 background-color foreground-color 4 logo-ratio)) 5 6 (define background-color #x153e4f) 7 (define foreground-color #x118282) 8 (define error-color #xcc2936) 9 (define peach-color #xf1bf98) 10 (define bright-color #xf9fbf2) 11 (define logo-ratio 0.618034) 12 13 (define (color->string color) 14 (let ((str (number->string color 16))) 15 (string-append "#" (make-string (- 6 (string-length str)) #\0) str))) 16 17 (define stylesheet `( 18 (body 19 (font-size 0) 20 (font-family "monospace") 21 (margin 0) 22 (visibility "hidden")) 23 24 (rect 25 (transform-origin "50%" ,(string-append (number->string (* 50 logo-ratio)) "%")) 26 (animation "zoom 1.5s linear infinite")) 27 28 (rect (: (nth-of-type "odd")) 29 (fill ,(color->string foreground-color))) 30 31 (rect (: (nth-of-type "even")) 32 (fill ,(color->string bright-color))) 33 34 (@ (keyframes "zoom") 35 (from (transform (scale ,(/ 1 logo-ratio)))) 36 (to (transform (scale ,logo-ratio)))) 37 38 (.logo 39 (width "7rem")) 40 41 (.meta 42 (position "fixed") 43 (visibility "visible") 44 (top 0) 45 (left 0) 46 (width "100vw") 47 (height "100vh") 48 (z-index 1) 49 (object-fit "fill")) 50 51 (main 52 (visibility "visible") 53 (font-size "1.1rem") 54 (position "relative") 55 (padding "2rem") 56 (margin "1em auto") 57 (max-width "45rem") 58 (line-height "1.5") 59 (background ,(color->string bright-color)) 60 (z-index 2) 61 (overflow-x "hidden") 62 (mix-blend-mode "lighten")) 63 64 (header 65 (display "flex") 66 (flex-wrap "wrap") 67 (justify-content "space-around") 68 (align-items "center")) 69 70 (footer 71 (font-size "1rem") 72 (text-align "center")) 73 74 (table 75 (min-width "50%")) 76 77 (.textlogo 78 (font-size (min "2.2vw" "0.795rem"))) 79 80 (nav 81 (margin "1rem 0")) 82 83 (a 84 (color ,(color->string foreground-color))) 85 86 (a (: "visited") 87 (color ,(color->string foreground-color))) 88 89 (h1 90 (margin "2rem 0 0.8rem")) 91 92 (.navlink 93 (margin-right "1rem")) 94 95 (.text 96 (font-size "1rem") 97 (white-space "pre-wrap")) 98 99 (.problem-num 100 (font-size "2.5rem") 101 (float "left") 102 (line-height 1.1)) 103 104 (.button 105 (cursor "pointer") 106 (padding "0.5rem 0.7rem") 107 (margin "0.2rem 1rem 0.2rem 0.5rem") 108 (background ,(color->string foreground-color)) 109 (box-shadow ,(string-append (color->string foreground-color) "a0") "0.2rem" "0.2rem")) 110 111 (.block 112 (display "block") 113 (margin "auto")) 114 115 (.short 116 (width "9.5rem")) 117 118 (.small 119 (margin "1rem 0") 120 (font-size "0.8rem")) 121 122 (.error 123 (display "inline-block") 124 (color ,(color->string error-color)) 125 (border "0.1rem solid") 126 (padding "0 1rem") 127 (margin "1rem 0") 128 (line-height "3rem")) 129 130 (.login 131 (display "flex") 132 (flex-wrap "wrap") 133 (align-items "center")) 134 135 (input 136 (border "none") 137 (font "inherit") 138 (font-size "1.2rem") 139 (padding "0.2rem 0.5rem") 140 (margin "0.2rem 0.5rem") 141 (background "#000") 142 (color ,(color->string bright-color))) 143 144 (.stagit 145 (overflow-x "scroll") 146 (margin-bottom "2rem")) 147 148 (.line 149 (text-decoration "none")) 150 151 (.blob 152 (font-size "0.765rem")) 153 154 (.d 155 (color ,(color->string error-color)) 156 (text-decoration "none")) 157 158 (.d (: "visited") 159 (color ,(color->string error-color))) 160 161 (.i 162 (color ,(color->string foreground-color)) 163 (text-decoration "none")) 164 165 (.h 166 (color "#aaa") 167 (text-decoration "none")) 168 169 (.start 170 (margin "0.5em")) 171 172 (.good 173 (color ,(color->string foreground-color))) 174 175 (.bad 176 (color ,(color->string error-color))) 177 178 (.ghost 179 (visibility "hidden"))))