diff options
Diffstat (limited to 'static')
| -rw-r--r-- | static/logo-hor.svg | 55 | ||||
| -rw-r--r-- | static/style.css | 119 |
2 files changed, 162 insertions, 12 deletions
diff --git a/static/logo-hor.svg b/static/logo-hor.svg new file mode 100644 index 0000000..35082a1 --- /dev/null +++ b/static/logo-hor.svg @@ -0,0 +1,55 @@ +<?xml version="1.0" standalone="no"?> +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN" + "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd"> +<svg version="1.0" xmlns="http://www.w3.org/2000/svg" + width="333.000000pt" height="161.000000pt" viewBox="0 0 333.000000 161.000000" + preserveAspectRatio="xMidYMid meet"> +<g transform="translate(0.000000,161.000000) scale(0.100000,-0.100000)" +fill="#352a2e" stroke="none"> +<path d="M360 1568 c-41 -21 -51 -34 -108 -143 -34 -65 -85 -150 -112 -187 +-84 -115 -95 -150 -65 -208 18 -35 103 -86 157 -95 80 -14 188 68 249 186 l19 +38 462 3 c504 3 492 2 528 61 24 39 27 141 6 191 -27 64 -38 66 -469 66 l-385 +0 -19 38 c-21 43 -60 60 -158 68 -50 5 -68 2 -105 -18z"/> +<path d="M2043 1571 c-19 -12 -34 -31 -38 -50 l-7 -31 -113 0 c-126 0 -156 -7 +-180 -43 -22 -34 -29 -114 -16 -165 18 -65 43 -76 185 -82 l120 -5 8 -32 c5 +-18 12 -33 16 -33 4 0 75 34 157 76 225 114 282 113 507 -13 65 -36 126 -66 +135 -67 13 -1 19 8 23 34 l5 35 120 5 c143 6 168 17 186 82 13 51 6 131 -16 +165 -24 36 -54 43 -179 43 l-113 0 -6 30 c-10 48 -57 70 -150 70 -101 0 -141 +-16 -157 -64 l-12 -36 -92 0 -92 0 -9 33 c-15 48 -61 67 -165 67 -66 0 -92 -4 +-117 -19z"/> +<path d="M2355 1223 c-44 -11 -632 -319 -657 -344 -22 -21 -28 -37 -28 -69 0 +-78 68 -170 125 -170 19 0 32 30 40 94 12 92 63 116 242 116 l113 0 21 45 c29 +62 73 87 164 93 141 9 205 -17 243 -97 l17 -36 135 -5 c110 -4 141 -9 168 -25 +38 -23 72 -87 72 -136 0 -19 6 -43 13 -53 13 -18 15 -17 54 2 45 24 66 50 83 +109 28 91 -7 130 -203 229 -84 42 -211 110 -284 151 -169 95 -237 116 -318 96z"/> +<path d="M534 1088 c-11 -13 -33 -42 -48 -66 -36 -53 -93 -105 -145 -132 -27 +-13 -46 -32 -55 -54 -14 -33 -16 -34 -80 -38 -46 -3 -74 -10 -93 -24 -62 -46 +-69 -189 -13 -246 24 -23 37 -28 78 -28 28 0 54 -6 60 -13 8 -9 7 -44 -4 -121 +-7 -60 -11 -127 -7 -150 8 -51 54 -100 108 -115 63 -17 889 -14 938 3 85 31 +107 77 118 245 9 133 12 140 64 141 63 1 85 41 85 153 0 102 -17 131 -83 144 +l-42 9 -5 111 c-4 93 -9 116 -26 140 -43 57 -46 58 -454 61 l-376 3 -20 -23z +m302 -52 c77 -27 219 -102 251 -132 29 -27 33 -38 33 -80 0 -62 -44 -150 -90 +-181 -58 -40 -101 -32 -258 47 -94 47 -145 79 -158 97 -27 40 -23 99 12 163 +49 92 117 119 210 86z m67 -459 c185 -89 218 -145 155 -267 -41 -81 -85 -114 +-144 -107 -63 7 -314 137 -341 177 -41 59 -27 141 37 213 61 70 121 66 293 +-16z"/> +<path d="M700 961 c-49 -52 -61 -101 -33 -139 22 -30 218 -131 270 -139 62 +-10 123 56 123 134 0 36 -5 46 -32 66 -55 42 -196 107 -243 114 -43 5 -47 4 +-85 -36z"/> +<path d="M662 574 c-54 -37 -70 -134 -29 -171 40 -38 246 -133 288 -133 43 0 +79 35 99 95 25 75 -7 108 -167 181 -104 47 -154 54 -191 28z"/> +<path d="M2324 929 c-42 -12 -63 -38 -72 -90 l-8 -44 -163 -5 c-182 -6 -184 +-6 -196 -81 -14 -81 12 -119 59 -84 32 24 102 29 150 11 50 -19 141 -102 157 +-143 6 -17 8 -53 4 -89 l-6 -62 -47 -5 c-30 -3 -52 -12 -63 -26 -37 -45 -35 +-165 2 -202 17 -17 35 -19 180 -19 176 0 216 9 238 56 7 15 11 87 11 188 0 +158 1 163 25 197 76 103 187 133 287 77 20 -12 43 -18 51 -15 34 13 28 135 -9 +172 -22 22 -43 25 -204 28 l-145 2 -3 30 c-6 65 -12 76 -55 95 -45 21 -138 25 +-193 9z"/> +<path d="M1975 580 c-21 -8 -169 -157 -217 -218 -83 -104 35 -264 176 -238 48 +9 126 80 126 114 0 76 40 137 97 148 41 8 58 40 42 81 -13 35 -34 58 -83 94 +-40 30 -97 38 -141 19z"/> +<path d="M2712 563 c-18 -8 -44 -29 -57 -45 -61 -72 -44 -129 76 -253 107 +-110 154 -145 207 -152 53 -7 96 17 133 75 34 54 38 113 11 152 -21 30 -197 +200 -232 223 -31 21 -95 21 -138 0z"/> +</g> +</svg> diff --git a/static/style.css b/static/style.css index 1dc0bc2..c08277e 100644 --- a/static/style.css +++ b/static/style.css @@ -5,8 +5,12 @@ body { color: #352a2e; } +* { + box-sizing: border-box; +} + .container { - max-width: 76rem; + max-width: 82.5rem; margin: 0 auto; } @@ -31,10 +35,18 @@ body { margin-bottom: 2rem; } +.menu-mobile { + display: none; +} + .menu a { color: blue; } +.menu a.active { + text-decoration: none; +} + .list { display: flex; flex-wrap: wrap; @@ -53,8 +65,8 @@ body { margin-top: 0; } -.tile img { - width: 100%; +.tile .img { + width: 12.5rem; height: 12.5rem; object-fit: cover; object-position: center; @@ -65,24 +77,25 @@ body { margin-bottom: 0.25rem; } -.paginator-numbers { - width: 100%; -} - -.paginator-numbers a { - text-decoration: none; -} - .paginator { display: flex; gap: 0.5rem; flex-wrap: wrap; + max-width: 50rem; } .paginator a { color: blue; } +.paginator-numbers { + width: 100%; +} + +.paginator-numbers a { + text-decoration: none; +} + .paginator-active { font-weight: bold; text-decoration: none; @@ -118,7 +131,7 @@ body { .form-price input { flex: 1; - max-width: calc(50% - 1rem); + max-width: calc(50% - 0.5rem); } .form-price-per input { @@ -139,3 +152,85 @@ body { width: auto; object-fit: contain; } + +.description { + max-width: 50rem; + margin-bottom: 2rem; +} + +@media screen and (max-width: 44.9rem) { + body { + margin: 2rem; + } + + .menu { + display: none; + } + + .menu-mobile { + display: flex; + } + + .content { + flex-direction: column; + } + + .aside { + width: 100%; + } + + .logo { + display: block; + box-sizing: border-box; + background: url("/static/logo-hor.svg") no-repeat; + background-position: left center; + background-size: contain; + width: 100%; + height: 8rem; + padding-left: calc(100vw - 4rem); + } + + .tile { + width: calc(50% - 1rem); + } + + .tile .img { + height: 12.5rem; + } + + button, + select, + input { + padding: 0 0.5rem; + height: 2rem; + } + + .aside .paginator { + display: none; + } + + .paginator-numbers { + font-size: 1.25rem; + } + + .form { + margin-bottom: 0; + } + + h1 { + margin-top: 0; + } + + .form-price-per { + position: relative; + } + + .form-price-per label { + position: absolute; + top: 0; + padding: 0.5rem 2rem; + left: 0; + width: 100%; + height: 100%; + } +} |
