[WIP] Rework design (#34)
* WIP: Redesign the default layout * Merge old & new default layouts * Fix login logic; add proper user controls dropdown * Fix latest version listing (#31) (#32) Co-authored-by: Aeledfyr <45501007+Aeledfyr@users.noreply.github.com> * First pass of design cleanup * Improve ad integration and fix light theme * Begin splitting up variables, change some styling to new mockup * Continue redesign progress * Work on some more pages * Add missing dark theme variables for text * Continue working on modularizing * Continue progress, redo pagination * Fix auth buttons in navbar layout * Continue progress * Continue progress more * Redo ModResult * Scope ModPage :irritater: * Continue Dashboard * Continue progress on Dashboard and cleanup * Add missing variables for dark theme * Small tweaks, cleanup, and continue mod page progress * Fix user not being able to see hidden mods that they own * Start reworking mod creation * Continue revamp of mod creation page * Yank v-html out * Hotfix markdown rendering and some spacing issues * Move legal; continue with mod creation; create reusable footer * Create README.md * Update README.md * Update README.md * Add in basic usage instructions * Fix some stuff * Continue with mod creation; fix some CSS errors * Start user page * Start transition to vue-select; fix a few bugs * Continue mod creation page * Finish mod pages * Add very raw version editing * Mod editing + creation * Fixed versions that were in processing causing a 404 (#39) Co-authored-by: Mikhail Oleynikov <falseresync@gmail.com> Co-authored-by: Aeledfyr <45501007+Aeledfyr@users.noreply.github.com> Co-authored-by: Jai A <jai.a@tuta.io> Co-authored-by: MulverineX <mulverin3@gmail.com> Co-authored-by: diabolical17 <calumproh28@gmail.com> Co-authored-by: Geometrically <18202329+Geometrically@users.noreply.github.com>
1
assets/images/categories/external.svg
Normal file
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-external-link"><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"></path><polyline points="15 3 21 3 21 9"></polyline><line x1="10" y1="14" x2="21" y2="3"></line></svg>
|
||||
|
After Width: | Height: | Size: 388 B |
7
assets/images/categories/flame.svg
Normal file
@@ -0,0 +1,7 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 25.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="0 0 24 24" style="enable-background:new 0 0 24 24;" xml:space="preserve">
|
||||
<path d="M7.3,20.8c-0.7-0.8-5.2-6-0.6-10.5c3.8-3.8,4.4-6.9,3.1-8.5c0,0,9.7,4,4,13.2c-1,1.6-3.4,3.4-2.1,7.2L7.3,20.8L7.3,20.8z
|
||||
M13.2,22c-0.2-0.8-1.1-2.5,1.7-5.8c1.5-1.8,2.1-4.4,2.2-5.4c0,0,5,2.9,0,9.9C17.2,20.7,13.2,22,13.2,22z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 584 B |
3
assets/images/categories/flameanvil.svg
Normal file
@@ -0,0 +1,3 @@
|
||||
<svg width="113" height="128" viewBox="0 0 113 128" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M24.6637 59.3337L32.1412 51.8562L44.2184 66.0338L29.8772 79.9532C28.7085 81.0876 28.3443 82.8173 28.9563 84.3266C29.5683 85.836 31.0344 86.8235 32.6631 86.8235H92.5028L67.5247 106.806C66.2594 107.818 65.7298 109.494 66.1835 111.049L69.9608 124H31.0805L36.7657 111.596C37.3659 110.286 37.2156 108.755 36.3721 107.587L20.215 85.2161C20.3794 84.9958 20.5226 84.7565 20.6408 84.5005C21.2947 83.0843 21.0658 81.4171 20.0542 80.2297L12.3066 71.1346L20.0395 63.9541C20.0812 63.9153 20.122 63.8758 20.1617 63.8356L24.6614 59.336C24.6622 59.3352 24.6629 59.3344 24.6637 59.3337ZM101.193 76.5647H89.4745C90.2162 73.609 92.1388 69.5598 96.679 64.1834C101.3 58.726 104.009 51.7383 105.519 46.2493C106.213 47.2422 106.872 48.4045 107.402 49.743C109.386 54.7518 109.993 63.3535 101.193 76.5647ZM77.9962 64.0567C75.9317 67.4679 74.1929 71.566 73.842 76.5647H62.454C60.2035 73.7571 56.5771 68.6022 54.7738 62.4556C52.6945 55.3677 53.0109 47.0396 61.1035 39.0164L61.104 39.0159C69.5087 30.6807 74.6146 22.7347 76.8078 15.6999C77.5821 13.2161 78.0043 10.7893 78.0555 8.48397C80.6738 10.3958 83.4898 12.8635 85.9054 15.9006C89.1604 19.9929 91.6386 25.049 92.0315 31.1916C92.424 37.3281 90.7617 44.957 85.0299 54.247C84.3475 55.3429 83.4533 56.4992 82.3222 57.962C82.2062 58.1119 82.0877 58.2651 81.9667 58.4218C80.7208 60.0353 79.2887 61.9211 77.9962 64.0567Z" stroke="currentColor" stroke-width="8" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.5 KiB |
8
assets/images/categories/modrinth.svg
Normal file
@@ -0,0 +1,8 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg
|
||||
viewBox="0 0 24 24"
|
||||
fill="currentColor"
|
||||
stroke="none"
|
||||
>
|
||||
<path class="st0" d="m20.2 17.6c-0.5-0.2-0.9 0-1.2 0.3-1.2 1.4-2.8 2.5-4.8 3-3.1 0.8-6.2 0-8.4-1.9l3.6-3.2 2.1 1.9 4-1.8 2.1-3.3-0.8-1.6-2.3 1-1 1.3-1.5 0.7-1.2-1-0.8-1.5 1-1.3 1.5-0.7 1.6-2-1.3-1.2-3.8 1.3-2.7 3.5 1.3 2.5-3.7 3.2-0.5-0.8c-0.1-0.2-0.2-0.5-0.3-0.8 0-0.1-0.1-0.2-0.1-0.2-0.1-0.3-0.5-0.6-0.9-0.6-0.5 0-1 0.4-1 1 0.1 0.2 0.1 0.4 0.2 0.5 2 5.3 7.8 8.3 13.4 6.8 2.4-0.6 4.3-1.9 5.8-3.7 0.5-0.4 0.3-1.2-0.3-1.4zm2.6-8.5c-1.7-5.9-7.8-9.4-13.8-7.9-3.8 1-6.6 3.8-7.8 7.1-0.2 0.7 0.3 1.3 0.9 1.3 0.4 0 0.8-0.3 0.9-0.7 1-2.8 3.3-5 6.4-5.9 4.7-1.2 9.5 1.3 11.1 5.6l0.5 1.8c0.1 0.7 0.1 1.4 0.1 2.1v0.1c0 0.4 0.3 0.8 0.7 0.9 0.6 0.2 1.3-0.2 1.3-0.9 0.1-1 0-2.3-0.3-3.5z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 789 B |
10
assets/images/sidebar/admin.svg
Normal file
@@ -0,0 +1,10 @@
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
|
||||
stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg">
|
||||
<circle cx="12" cy="12" r="10"></circle>
|
||||
<line x1="14.31" y1="8" x2="20.05" y2="17.94"></line>
|
||||
<line x1="9.69" y1="8" x2="21.17" y2="8"></line>
|
||||
<line x1="7.38" y1="12" x2="13.12" y2="2.06"></line>
|
||||
<line x1="9.69" y1="16" x2="3.95" y2="6.06"></line>
|
||||
<line x1="14.31" y1="16" x2="2.83" y2="16"></line>
|
||||
<line x1="16.62" y1="12" x2="10.88" y2="21.94"></line>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 552 B |
6
assets/images/sidebar/analytics.svg
Normal file
@@ -0,0 +1,6 @@
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
|
||||
stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg">
|
||||
<line x1="18" y1="20" x2="18" y2="10"></line>
|
||||
<line x1="12" y1="20" x2="12" y2="4"></line>
|
||||
<line x1="6" y1="20" x2="6" y2="14"></line>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 316 B |
3
assets/images/sidebar/mod.svg
Normal file
@@ -0,0 +1,3 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 20l4-16m4 4l4 4-4 4M6 16l-4-4 4-4" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 218 B |
8
assets/images/sidebar/modpack.svg
Normal file
@@ -0,0 +1,8 @@
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
|
||||
stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg">
|
||||
<line x1="16.5" y1="9.4" x2="7.5" y2="4.21" />
|
||||
<path
|
||||
d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z" />
|
||||
<polyline points="3.27 6.96 12 12.01 20.73 6.96" />
|
||||
<line x1="12" y1="22.08" x2="12" y2="12" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 471 B |
7
assets/images/sidebar/projects.svg
Normal file
@@ -0,0 +1,7 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
||||
stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||
<polyline points="22 12 16 12 14 15 10 15 8 12 2 12"></polyline>
|
||||
<path
|
||||
d="M5.45 5.11L2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z">
|
||||
</path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 380 B |
16
assets/images/text-logo-white.svg
Normal file
@@ -0,0 +1,16 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 777 141.73">
|
||||
<g>
|
||||
<path d="M159.07,89.29A70.94,70.94,0,1,0,20,63.52H32A58.78,58.78,0,0,1,145.23,49.93l-11.66,3.12a46.54,46.54,0,0,0-29-26.52l-2.15,12.13a34.31,34.31,0,0,1,2.77,63.26l3.19,11.9a46.52,46.52,0,0,0,28.33-49l11.62-3.1A57.94,57.94,0,0,1,147.27,85Z" transform="translate(-19.79)" fill="#5da545" fill-rule="evenodd"/>
|
||||
<path d="M108.92,139.3A70.93,70.93,0,0,1,19.79,76h12a59.48,59.48,0,0,0,1.78,9.91,58.73,58.73,0,0,0,3.63,9.91l10.68-6.41a46.58,46.58,0,0,1,44.72-65L90.43,36.54A34.38,34.38,0,0,0,57.36,79.75C57.67,80.88,58,82,58.43,83l13.66-8.19L68,63.93l12.9-13.25,16.31-3.51L101.9,53l-7.52,7.61-6.55,2.06-4.69,4.82,2.3,6.38s4.64,4.94,4.65,4.94l6.57-1.74,4.67-5.13,10.2-3.24,3,6.84L104.05,88.43,86.41,94l-7.92-8.81L64.7,93.48a34.44,34.44,0,0,0,28.72,11.59L96.61,117A46.6,46.6,0,0,1,54.13,99.83l-10.64,6.38a58.81,58.81,0,0,0,99.6-9.77l11.8,4.29A70.77,70.77,0,0,1,108.92,139.3Z" transform="translate(-19.79)" fill="#5da545"/>
|
||||
</g>
|
||||
<g>
|
||||
<path d="M303,52.44q7.51,7.45,7.52,22.37v39H294.54v-37q0-8.92-4-13.45t-11.35-4.52q-8,0-12.87,5.29t-4.85,15.1v34.55H245.59v-37q0-8.92-4-13.45t-11.35-4.52q-8.16,0-12.94,5.22t-4.78,15.17v34.55H196.64V45.75h15.17v8.66a24.78,24.78,0,0,1,9.56-7A32.51,32.51,0,0,1,234.11,45a30.83,30.83,0,0,1,13.58,2.87,22,22,0,0,1,9.37,8.48A28.31,28.31,0,0,1,267.89,48a35.16,35.16,0,0,1,14.66-3Q295.43,45,303,52.44Z" transform="translate(-19.79)" fill="#fff"/>
|
||||
<path d="M343.49,110.25a32.53,32.53,0,0,1-12.94-12.43,35,35,0,0,1-4.66-18,34.68,34.68,0,0,1,4.66-18,32.66,32.66,0,0,1,12.94-12.37,41.33,41.33,0,0,1,37.35,0,32.7,32.7,0,0,1,12.93,12.37,34.68,34.68,0,0,1,4.66,18,35,35,0,0,1-4.66,18,32.57,32.57,0,0,1-12.93,12.43,41.33,41.33,0,0,1-37.35,0Zm33.14-15q5.73-5.86,5.74-15.43t-5.74-15.42a19.46,19.46,0,0,0-14.53-5.87,19.25,19.25,0,0,0-14.47,5.87Q342,70.22,342,79.78t5.67,15.43a19.25,19.25,0,0,0,14.47,5.86A19.46,19.46,0,0,0,376.63,95.21Z" transform="translate(-19.79)" fill="#fff"/>
|
||||
<path d="M480.39,19.23v94.59H465.1V105a24.75,24.75,0,0,1-9.76,7.27,33,33,0,0,1-12.81,2.42,35.84,35.84,0,0,1-17.65-4.33,31.06,31.06,0,0,1-12.3-12.31,36.71,36.71,0,0,1-4.47-18.29,36.4,36.4,0,0,1,4.47-18.23,31.27,31.27,0,0,1,12.3-12.24A35.94,35.94,0,0,1,442.53,45a32.36,32.36,0,0,1,12.37,2.3,24.89,24.89,0,0,1,9.56,6.88V19.23ZM454.77,98.46A18.92,18.92,0,0,0,462,91a22.87,22.87,0,0,0,2.67-11.22A22.87,22.87,0,0,0,462,68.56a18.89,18.89,0,0,0-7.27-7.45,21.65,21.65,0,0,0-20.65,0,18.89,18.89,0,0,0-7.27,7.45,22.87,22.87,0,0,0-2.67,11.22A22.87,22.87,0,0,0,426.85,91a18.92,18.92,0,0,0,7.27,7.46,21.73,21.73,0,0,0,20.65,0Z" transform="translate(-19.79)" fill="#fff"/>
|
||||
<path d="M540.69,45V60.15a20.64,20.64,0,0,0-3.7-.38q-9.3,0-14.53,5.42T517.23,80.8v33H501.3V45.75h15.17v9.94Q523.35,45,540.69,45Z" transform="translate(-19.79)" fill="#fff"/>
|
||||
<path d="M555,31.79A8.94,8.94,0,0,1,552,25,8.94,8.94,0,0,1,555,18.15a10.2,10.2,0,0,1,7.26-2.74A10.55,10.55,0,0,1,569.5,18a8.43,8.43,0,0,1,2.93,6.56,9.58,9.58,0,0,1-2.87,7.08,9.92,9.92,0,0,1-7.33,2.87A10.2,10.2,0,0,1,555,31.79Zm-.77,14h15.94v68.07H554.2Z" transform="translate(-19.79)" fill="#fff"/>
|
||||
<path d="M650.32,52.5q7.77,7.53,7.77,22.31v39H642.16v-37q0-8.92-4.21-13.45t-12-4.52q-8.81,0-13.9,5.29T607,79.4v34.42H591V45.75h15.17v8.79a25,25,0,0,1,9.94-7.14A35.91,35.91,0,0,1,629.67,45Q642.54,45,650.32,52.5Z" transform="translate(-19.79)" fill="#fff"/>
|
||||
<path d="M716.6,110.12a18.65,18.65,0,0,1-6.82,3.44,30.46,30.46,0,0,1-8.47,1.15q-11.22,0-17.34-5.86t-6.12-17.09V30.7h15.94V46.26H712V59H693.79V91.38c0,3.32.82,5.85,2.48,7.59a9.14,9.14,0,0,0,7,2.61,14,14,0,0,0,8.92-2.8Z" transform="translate(-19.79)" fill="#fff"/>
|
||||
<path d="M789,52.5q7.77,7.53,7.78,22.31v39H780.85v-37q0-8.92-4.21-13.45t-12-4.52q-8.79,0-13.89,5.29t-5.1,15.23v34.42H729.73V19.23h15.94V53.65a25.82,25.82,0,0,1,9.75-6.44A36,36,0,0,1,768.36,45Q781.23,45,789,52.5Z" transform="translate(-19.79)" fill="#fff"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.8 KiB |
5632
assets/images/text-logo.ai
Normal file
16
assets/images/text-logo.svg
Normal file
@@ -0,0 +1,16 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 777 141.73">
|
||||
<g>
|
||||
<path d="M159.07,89.29A70.94,70.94,0,1,0,20,63.52H32A58.78,58.78,0,0,1,145.23,49.93l-11.66,3.12a46.54,46.54,0,0,0-29-26.52l-2.15,12.13a34.31,34.31,0,0,1,2.77,63.26l3.19,11.9a46.52,46.52,0,0,0,28.33-49l11.62-3.1A57.94,57.94,0,0,1,147.27,85Z" transform="translate(-19.79)" fill="#5da545" fill-rule="evenodd"/>
|
||||
<path d="M108.92,139.3A70.93,70.93,0,0,1,19.79,76h12a59.48,59.48,0,0,0,1.78,9.91,58.73,58.73,0,0,0,3.63,9.91l10.68-6.41a46.58,46.58,0,0,1,44.72-65L90.43,36.54A34.38,34.38,0,0,0,57.36,79.75C57.67,80.88,58,82,58.43,83l13.66-8.19L68,63.93l12.9-13.25,16.31-3.51L101.9,53l-7.52,7.61-6.55,2.06-4.69,4.82,2.3,6.38s4.64,4.94,4.65,4.94l6.57-1.74,4.67-5.13,10.2-3.24,3,6.84L104.05,88.43,86.41,94l-7.92-8.81L64.7,93.48a34.44,34.44,0,0,0,28.72,11.59L96.61,117A46.6,46.6,0,0,1,54.13,99.83l-10.64,6.38a58.81,58.81,0,0,0,99.6-9.77l11.8,4.29A70.77,70.77,0,0,1,108.92,139.3Z" transform="translate(-19.79)" fill="#5da545"/>
|
||||
</g>
|
||||
<g>
|
||||
<path d="M303,52.44q7.51,7.45,7.52,22.37v39H294.54v-37q0-8.92-4-13.45t-11.35-4.52q-8,0-12.87,5.29t-4.85,15.1v34.55H245.59v-37q0-8.92-4-13.45t-11.35-4.52q-8.16,0-12.94,5.22t-4.78,15.17v34.55H196.64V45.75h15.17v8.66a24.78,24.78,0,0,1,9.56-7A32.51,32.51,0,0,1,234.11,45a30.83,30.83,0,0,1,13.58,2.87,22,22,0,0,1,9.37,8.48A28.31,28.31,0,0,1,267.89,48a35.16,35.16,0,0,1,14.66-3Q295.43,45,303,52.44Z" transform="translate(-19.79)" fill="#19202c"/>
|
||||
<path d="M343.49,110.25a32.53,32.53,0,0,1-12.94-12.43,35,35,0,0,1-4.66-18,34.68,34.68,0,0,1,4.66-18,32.66,32.66,0,0,1,12.94-12.37,41.33,41.33,0,0,1,37.35,0,32.7,32.7,0,0,1,12.93,12.37,34.68,34.68,0,0,1,4.66,18,35,35,0,0,1-4.66,18,32.57,32.57,0,0,1-12.93,12.43,41.33,41.33,0,0,1-37.35,0Zm33.14-15q5.73-5.86,5.74-15.43t-5.74-15.42a19.46,19.46,0,0,0-14.53-5.87,19.25,19.25,0,0,0-14.47,5.87Q342,70.22,342,79.78t5.67,15.43a19.25,19.25,0,0,0,14.47,5.86A19.46,19.46,0,0,0,376.63,95.21Z" transform="translate(-19.79)" fill="#19202c"/>
|
||||
<path d="M480.39,19.23v94.59H465.1V105a24.75,24.75,0,0,1-9.76,7.27,33,33,0,0,1-12.81,2.42,35.84,35.84,0,0,1-17.65-4.33,31.06,31.06,0,0,1-12.3-12.31,36.71,36.71,0,0,1-4.47-18.29,36.4,36.4,0,0,1,4.47-18.23,31.27,31.27,0,0,1,12.3-12.24A35.94,35.94,0,0,1,442.53,45a32.36,32.36,0,0,1,12.37,2.3,24.89,24.89,0,0,1,9.56,6.88V19.23ZM454.77,98.46A18.92,18.92,0,0,0,462,91a22.87,22.87,0,0,0,2.67-11.22A22.87,22.87,0,0,0,462,68.56a18.89,18.89,0,0,0-7.27-7.45,21.65,21.65,0,0,0-20.65,0,18.89,18.89,0,0,0-7.27,7.45,22.87,22.87,0,0,0-2.67,11.22A22.87,22.87,0,0,0,426.85,91a18.92,18.92,0,0,0,7.27,7.46,21.73,21.73,0,0,0,20.65,0Z" transform="translate(-19.79)" fill="#19202c"/>
|
||||
<path d="M540.69,45V60.15a20.64,20.64,0,0,0-3.7-.38q-9.3,0-14.53,5.42T517.23,80.8v33H501.3V45.75h15.17v9.94Q523.35,45,540.69,45Z" transform="translate(-19.79)" fill="#19202c"/>
|
||||
<path d="M555,31.79A8.94,8.94,0,0,1,552,25,8.94,8.94,0,0,1,555,18.15a10.2,10.2,0,0,1,7.26-2.74A10.55,10.55,0,0,1,569.5,18a8.43,8.43,0,0,1,2.93,6.56,9.58,9.58,0,0,1-2.87,7.08,9.92,9.92,0,0,1-7.33,2.87A10.2,10.2,0,0,1,555,31.79Zm-.77,14h15.94v68.07H554.2Z" transform="translate(-19.79)" fill="#19202c"/>
|
||||
<path d="M650.32,52.5q7.77,7.53,7.77,22.31v39H642.16v-37q0-8.92-4.21-13.45t-12-4.52q-8.81,0-13.9,5.29T607,79.4v34.42H591V45.75h15.17v8.79a25,25,0,0,1,9.94-7.14A35.91,35.91,0,0,1,629.67,45Q642.54,45,650.32,52.5Z" transform="translate(-19.79)" fill="#19202c"/>
|
||||
<path d="M716.6,110.12a18.65,18.65,0,0,1-6.82,3.44,30.46,30.46,0,0,1-8.47,1.15q-11.22,0-17.34-5.86t-6.12-17.09V30.7h15.94V46.26H712V59H693.79V91.38c0,3.32.82,5.85,2.48,7.59a9.14,9.14,0,0,0,7,2.61,14,14,0,0,0,8.92-2.8Z" transform="translate(-19.79)" fill="#19202c"/>
|
||||
<path d="M789,52.5q7.77,7.53,7.78,22.31v39H780.85v-37q0-8.92-4.21-13.45t-12-4.52q-8.79,0-13.89,5.29t-5.1,15.23v34.42H729.73V19.23h15.94V53.65a25.82,25.82,0,0,1,9.75-6.44A36,36,0,0,1,768.36,45Q781.23,45,789,52.5Z" transform="translate(-19.79)" fill="#19202c"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.9 KiB |
@@ -1,15 +1,3 @@
|
||||
<svg viewBox="0 0 273 291" fill-rule="evenodd" stroke-linejoin="round">
|
||||
<g transform="matrix(1,0,0,1,-3303.68,-2082.6)">
|
||||
<g transform="matrix(0.564163,0,0,1.70346,1629.87,0)">
|
||||
<g transform="matrix(29.6754,0,-5.39484e-14,10.5245,2970.52,1222.47)">
|
||||
<g transform="matrix(1.4323,0,0,1.4323,-3.56656,-3.89073)">
|
||||
<path d="M10.854,7.146C10.948,7.24 11.001,7.367 11.001,7.5C11.001,7.633 10.948,7.76 10.854,7.854L7.854,10.854C7.76,10.948 7.633,11.001 7.5,11.001C7.367,11.001 7.24,10.948 7.146,10.854L5.646,9.354C5.552,9.26 5.499,9.133 5.499,9C5.499,8.725 5.725,8.499 6,8.499C6.133,8.499 6.26,8.552 6.354,8.646L7.5,9.793L10.146,7.146C10.24,7.052 10.367,6.999 10.5,6.999C10.633,6.999 10.76,7.052 10.854,7.146Z"/>
|
||||
</g>
|
||||
<path d="M1.427,4L1.427,13.715C1.427,14.264 1.879,14.715 2.427,14.715L13.573,14.715C14.121,14.715 14.573,14.264 14.573,13.715L14.573,4L1.427,4ZM1.878,1C0.781,1 -0.122,1.903 -0.122,3L-0.122,14.191C-0.122,15.288 0.781,16.191 1.878,16.191L14.183,16.191C15.28,16.191 16.183,15.097 16.183,14L16.183,3C16.183,1.903 15.28,1 14.183,1L1.878,1Z"/>
|
||||
<g transform="matrix(1.32086,0,-1.73365e-32,1.32086,-3.43823,0.00935866)">
|
||||
<path d="M4.819,0C5.094,-0 5.319,0.226 5.319,0.5L5.319,1C5.319,1.274 5.094,1.5 4.819,1.5C4.545,1.5 4.319,1.274 4.319,1L4.319,0.5C4.319,0.226 4.545,0 4.819,0ZM12.5,0C12.774,-0 13,0.226 13,0.5L13,1C13,1.274 12.774,1.5 12.5,1.5C12.226,1.5 12,1.274 12,1L12,0.5C12,0.226 12.226,0 12.5,0Z"/>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M8 7V3M16 7V3M7 11H17M5 21H19C20.1046 21 21 20.1046 21 19V7C21 5.89543 20.1046 5 19 5H5C3.89543 5 3 5.89543 3 7V19C3 20.1046 3.89543 21 5 21Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 343 B |
@@ -1,5 +1,3 @@
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||
<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path>
|
||||
<polyline points="7 10 12 15 17 10"></polyline>
|
||||
<line x1="12" y1="15" x2="12" y2="3"></line>
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M4 16L4 17C4 18.6569 5.34315 20 7 20L17 20C18.6569 20 20 18.6569 20 17L20 16M16 12L12 16M12 16L8 12M12 16L12 4" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 290 B After Width: | Height: | Size: 312 B |
3
assets/images/utils/dropdown.svg
Normal file
@@ -0,0 +1,3 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M19 9L12 16L5 9" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 217 B |
@@ -1,15 +1,3 @@
|
||||
<svg
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path
|
||||
d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"
|
||||
></path>
|
||||
<path
|
||||
d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"
|
||||
></path>
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M11 5H6C4.89543 5 4 5.89543 4 7V18C4 19.1046 4.89543 20 6 20H17C18.1046 20 19 19.1046 19 18V13M17.5858 3.58579C18.3668 2.80474 19.6332 2.80474 20.4142 3.58579C21.1953 4.36683 21.1953 5.63316 20.4142 6.41421L11.8284 15H9L9 12.1716L17.5858 3.58579Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 313 B After Width: | Height: | Size: 448 B |
@@ -1 +1,6 @@
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"></path><polyline points="15 3 21 3 21 9"></polyline><line x1="10" y1="14" x2="21" y2="3"></line></svg>
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
|
||||
stroke-linejoin="round">
|
||||
<path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"></path>
|
||||
<polyline points="15 3 21 3 21 9"></polyline>
|
||||
<line x1="10" y1="14" x2="21" y2="3"></line>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 293 B After Width: | Height: | Size: 312 B |
1
assets/images/utils/gap.svg
Normal file
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="2" viewBox="0 0 14 2"><path d="M18,12H6" transform="translate(-5 -11)" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/></svg>
|
||||
|
After Width: | Height: | Size: 235 B |
4
assets/images/utils/github.svg
Normal file
@@ -0,0 +1,4 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg enable-background="new 0 0 24 24" version="1.1" viewBox="0 0 24 24" xml:space="preserve" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill="currentColor" class="st0" d="m12 1c-6.3 0-11.3 5-11.3 11.3 0 5 3.2 9.2 7.7 10.7 0.6 0.1 0.8-0.2 0.8-0.5v-1.9c-3.2 0.6-3.8-1.6-3.8-1.6-0.5-1.3-1.3-1.7-1.3-1.7-1-0.7 0.1-0.7 0.1-0.7 1.1 0.1 1.7 1.2 1.7 1.2 1 1.7 2.7 1.2 3.3 0.9 0.1-0.7 0.4-1.2 0.7-1.5-2.5-0.2-5.1-1.2-5.1-5.5 0-1.2 0.4-2.2 1.2-3-0.1-0.3-0.5-1.4 0.1-3 0 0 1-0.3 3.1 1.2 0.9-0.3 1.8-0.5 2.8-0.5s1.9 0.1 2.8 0.4c2.2-1.5 3.1-1.2 3.1-1.2 0.6 1.6 0.2 2.7 0.1 3 0.7 0.8 1.2 1.8 1.2 3 0 4.4-2.6 5.3-5.2 5.6 0.4 0.3 0.8 1 0.8 2.1v3.1c0 0.3 0.2 0.7 0.8 0.5 4.5-1.5 7.7-5.7 7.7-10.7 0-6.2-5-11.2-11.3-11.2z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 752 B |
6
assets/images/utils/hamburger.svg
Normal file
@@ -0,0 +1,6 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
||||
stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-menu">
|
||||
<line x1="3" y1="12" x2="21" y2="12" />
|
||||
<line x1="3" y1="6" x2="21" y2="6" />
|
||||
<line x1="3" y1="18" x2="21" y2="18" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 351 B |
1
assets/images/utils/left-arrow.svg
Normal file
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="14.414" height="12.162" viewBox="0 0 14.414 12.162"><path d="M7.667,14.333,3,9.667m0,0L7.667,5M3,9.667H15" transform="translate(-1.586 -3.586)" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/></svg>
|
||||
|
After Width: | Height: | Size: 296 B |
6
assets/images/utils/log-out.svg
Normal file
@@ -0,0 +1,6 @@
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
|
||||
stroke-linejoin="round">
|
||||
<path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"></path>
|
||||
<polyline points="16 17 21 12 16 7"></polyline>
|
||||
<line x1="21" y1="12" x2="9" y2="12"></line>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 297 B |
4
assets/images/utils/moon.svg
Normal file
@@ -0,0 +1,4 @@
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
|
||||
stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 239 B |
1
assets/images/utils/right-arrow.svg
Normal file
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="14.414" height="12.162" viewBox="0 0 14.414 12.162"><path d="M7.667,14.333,3,9.667m0,0L7.667,5M3,9.667H15" transform="translate(16 15.748) rotate(180)" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/></svg>
|
||||
|
After Width: | Height: | Size: 304 B |
3
assets/images/utils/search.svg
Normal file
@@ -0,0 +1,3 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M21 21L15 15M17 10C17 13.866 13.866 17 10 17C6.13401 17 3 13.866 3 10C3 6.13401 6.13401 3 10 3C13.866 3 17 6.13401 17 10Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 323 B |
12
assets/images/utils/sun.svg
Normal file
@@ -0,0 +1,12 @@
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
|
||||
stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg">
|
||||
<circle cx="12" cy="12" r="5"></circle>
|
||||
<line x1="12" y1="1" x2="12" y2="3"></line>
|
||||
<line x1="12" y1="21" x2="12" y2="23"></line>
|
||||
<line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line>
|
||||
<line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line>
|
||||
<line x1="1" y1="12" x2="3" y2="12"></line>
|
||||
<line x1="21" y1="12" x2="23" y2="12"></line>
|
||||
<line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line>
|
||||
<line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 649 B |
3
assets/images/utils/tag.svg
Normal file
@@ -0,0 +1,3 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M7 7H7.01M7 3H12C12.5119 2.99999 13.0237 3.19525 13.4142 3.58579L20.4143 10.5858C21.1953 11.3668 21.1953 12.6332 20.4143 13.4142L13.4142 20.4142C12.6332 21.1953 11.3668 21.1953 10.5858 20.4142L3.58579 13.4142C3.19526 13.0237 3 12.5118 3 12V7C3 4.79086 4.79086 3 7 3Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 468 B |
5
assets/images/utils/user.svg
Normal file
@@ -0,0 +1,5 @@
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
|
||||
stroke-linejoin="round">
|
||||
<path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"></path>
|
||||
<circle cx="12" cy="7" r="4"></circle>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 241 B |
7
assets/images/utils/users.svg
Normal file
@@ -0,0 +1,7 @@
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
|
||||
stroke-linejoin="round">
|
||||
<path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path>
|
||||
<circle cx="9" cy="7" r="4"></circle>
|
||||
<path d="M23 21v-2a4 4 0 0 0-3-3.87"></path>
|
||||
<path d="M16 3.13a4 4 0 0 1 0 7.75"></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 337 B |
3
assets/images/utils/x.svg
Normal file
@@ -0,0 +1,3 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 337 B |
@@ -7,54 +7,47 @@
|
||||
|
||||
input {
|
||||
padding-left: 2.5rem;
|
||||
|
||||
&:hover {
|
||||
&+svg {
|
||||
color: var(--color-grey-6);
|
||||
}
|
||||
}
|
||||
|
||||
&:focus {
|
||||
&+svg {
|
||||
color: var(--color-text);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
svg {
|
||||
color: var(--color-grey-5);
|
||||
color: var(--color-icon);
|
||||
margin-right: -2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.badge {
|
||||
max-height: 1rem;
|
||||
border-radius: 1rem;
|
||||
font-size: 0.8rem;
|
||||
font-size: var(--font-size-xs);
|
||||
font-weight: bold;
|
||||
letter-spacing: 0.02rem;
|
||||
padding: 0.25rem 0.5rem;
|
||||
|
||||
&.gray {
|
||||
background-color: #c8c1c1;
|
||||
color: #646161;
|
||||
background-color: var(--color-badge-gray-bg);
|
||||
color: var(--color-badge-gray-text);
|
||||
}
|
||||
|
||||
&.red {
|
||||
background-color: #fed7d7;
|
||||
color: #9b2c2c;
|
||||
background-color: var(--color-badge-red-bg);
|
||||
color: var(--color-badge-red-text);
|
||||
}
|
||||
|
||||
&.green {
|
||||
background-color: #c6f6d5;
|
||||
color: #276749;
|
||||
background-color: var(--color-badge-green-bg);
|
||||
color: var(--color-badge-green-text);
|
||||
}
|
||||
|
||||
&.yellow {
|
||||
background-color: #f6e8c6;
|
||||
color: #675027;
|
||||
background-color: var(--color-badge-yellow-bg);
|
||||
color: var(--color-badge-yellow-text);
|
||||
}
|
||||
}
|
||||
|
||||
.text-link {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.required:after {
|
||||
content: ' *';
|
||||
color: red;
|
||||
@@ -70,14 +63,14 @@
|
||||
|
||||
h1, h2 {
|
||||
padding: 10px 0 5px;
|
||||
border-bottom: 1px solid var(--color-grey-3);
|
||||
border-bottom: 1px solid var(--color-header-underline);
|
||||
}
|
||||
|
||||
blockquote {
|
||||
margin: 15px 0;
|
||||
padding: 0 1em;
|
||||
color: var(--color-grey-5);
|
||||
border-left: .25em solid var(--color-grey-3);
|
||||
color: var(--color-text);
|
||||
border-left: .25em solid var(--color-block-quote);
|
||||
}
|
||||
|
||||
a {
|
||||
@@ -90,8 +83,8 @@
|
||||
|
||||
pre {
|
||||
padding: 15px 10px;
|
||||
border-radius: var(--size-rounded-sm);
|
||||
background-color: var(--color-grey-1);
|
||||
border-radius: var(--size-rounded-control);
|
||||
background-color: var(--color-code-bg);
|
||||
|
||||
code {
|
||||
font-size: 80%;
|
||||
@@ -101,10 +94,11 @@
|
||||
}
|
||||
|
||||
code {
|
||||
padding: .2em .4em;
|
||||
font-size: 60%;
|
||||
border-radius: var(--size-rounded-sm);
|
||||
background-color: var(--color-grey-1)
|
||||
padding: 0.2em 0.4em;
|
||||
font-size: 80%;
|
||||
border-radius: var(--size-rounded-control);
|
||||
background-color: var(--color-code-bg);
|
||||
color: var(--color-code-text);
|
||||
}
|
||||
|
||||
hr {
|
||||
@@ -118,9 +112,12 @@
|
||||
z-index: 10000;
|
||||
|
||||
.tooltip-inner {
|
||||
background: var(--color-grey-2);
|
||||
color: var(--color-text);
|
||||
background: var(--color-tooltip-bg);
|
||||
color: var(--color-tooltip-text);
|
||||
padding: 5px 10px 4px;
|
||||
border-radius: var(--size-rounded-tooltip);
|
||||
box-shadow: var(--shadow-tooltip);
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.tooltip-arrow {
|
||||
@@ -129,7 +126,7 @@
|
||||
border-style: solid;
|
||||
position: absolute;
|
||||
margin: 5px;
|
||||
border-color: var(--color-grey-2);
|
||||
border-color: var(--color-tooltip-bg);
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
@@ -205,3 +202,174 @@
|
||||
transition: opacity .15s;
|
||||
}
|
||||
}
|
||||
|
||||
.tabs {
|
||||
display: flex;
|
||||
padding: 0.5rem 1rem;
|
||||
.filler {
|
||||
flex-grow: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.tabs a.tab {
|
||||
user-select: none;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0.5rem 0.25rem;
|
||||
padding-bottom: 0.2rem;
|
||||
margin: auto 0.5rem;
|
||||
border-bottom: 3px solid transparent;
|
||||
|
||||
svg {
|
||||
width: 1rem;
|
||||
height: 1rem;
|
||||
margin-right: 0.3rem;
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
border-bottom: 3px solid var(--color-brand-disabled);
|
||||
color: var(--color-text-medium);
|
||||
}
|
||||
|
||||
&.nuxt-link-exact-active {
|
||||
border-bottom: 3px solid var(--color-brand);
|
||||
color: var(--color-text-dark);
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
.card {
|
||||
padding: var(--spacing-card-md);
|
||||
margin-bottom: var(--spacing-card-md);
|
||||
@extend %card;
|
||||
|
||||
&.page-nav {
|
||||
.tab {
|
||||
padding: var(--spacing-card-sm);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-radius: var(--size-rounded-control);
|
||||
margin-bottom: 0.5rem;
|
||||
@extend %transparent-clickable;
|
||||
|
||||
&.last {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
svg {
|
||||
color: var(--color-icon);
|
||||
margin-right: 5px;
|
||||
height: 1.25rem;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
&.nuxt-link-exact-active {
|
||||
svg {
|
||||
color: var(--color-brand-light);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1024px) {
|
||||
width: 300px;
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-l {
|
||||
@extend .sidebar;
|
||||
margin-right: var(--spacing-card-lg);
|
||||
}
|
||||
|
||||
.sidebar-r {
|
||||
@extend .sidebar;
|
||||
margin-left: var(--spacing-card-lg);
|
||||
}
|
||||
|
||||
.button {
|
||||
margin: auto 0;
|
||||
padding: 6px 20px;
|
||||
border-radius: var(--size-rounded-control);
|
||||
color: var(--color-button-text);
|
||||
background-color: var(--color-button-bg);
|
||||
font-weight: var(--font-weight-medium);
|
||||
&:focus,
|
||||
&:hover {
|
||||
background-color: var(--color-button-bg-hover);
|
||||
}
|
||||
&:active {
|
||||
background-color: var(--color-button-bg-active);
|
||||
}
|
||||
}
|
||||
|
||||
.transparent-button {
|
||||
@extend %transparent-clickable;
|
||||
margin: auto 0;
|
||||
padding: 6px 20px;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.brand-button {
|
||||
@extend .button;
|
||||
color: var(--color-brand-inverted);
|
||||
background-color: var(--color-brand);
|
||||
&:focus,
|
||||
&:hover {
|
||||
background-color: var(--color-brand-hover);
|
||||
color: var(--color-brand-inverted);
|
||||
}
|
||||
&:active {
|
||||
background-color: var(--color-brand-active);
|
||||
color: var(--color-brand-inverted);
|
||||
}
|
||||
}
|
||||
|
||||
.multiselect--above .multiselect__content-wrapper {
|
||||
border-top: none !important;
|
||||
}
|
||||
|
||||
.multiselect {
|
||||
color: var(--color-text) !important;
|
||||
input {
|
||||
background: transparent;
|
||||
}
|
||||
.multiselect__tags {
|
||||
background: var(--color-dropdown-bg);
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
&:active,
|
||||
&:hover {
|
||||
background: var(--color-button-bg-hover);
|
||||
}
|
||||
.multiselect__single {
|
||||
background: transparent;
|
||||
}
|
||||
.multiselect__tag {
|
||||
color: var(--color-text-dark);
|
||||
background: transparent;
|
||||
border: 2px solid var(--color-brand);
|
||||
}
|
||||
.multiselect__tag-icon {
|
||||
background: transparent;
|
||||
&:after {
|
||||
color: var(--color-text-dark);
|
||||
}
|
||||
}
|
||||
}
|
||||
.multiselect__content-wrapper {
|
||||
background: var(--color-dropdown-bg);
|
||||
border: none;
|
||||
.multiselect__element {
|
||||
.multiselect__option--highlight {
|
||||
background: var(--color-button-bg-active);
|
||||
color: var(--color-text-dark);
|
||||
}
|
||||
.multiselect__option--selected {
|
||||
background: var(--color-brand);
|
||||
font-weight: bold;
|
||||
color: var(--color-brand-inverted);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,63 +1,204 @@
|
||||
.light-mode {
|
||||
--color-text: #1a202c;
|
||||
--color-bg: #ffffff;
|
||||
--color-icon: #718096;
|
||||
--color-text:#4A5568;
|
||||
--color-text-medium:#2a303d;
|
||||
--color-text-dark:#1A202C;
|
||||
--color-heading: #2c313d;
|
||||
--color-heading-light: #777e8d;
|
||||
--color-bg: #edf2f7;
|
||||
--color-raised-bg: #ffffff;
|
||||
--color-divider: #eaecef;
|
||||
--color-divider-dark: #c8cdd3;
|
||||
|
||||
--color-text-inverted: var(--color-bg);
|
||||
--color-bg-inverted: var(--color-text);
|
||||
|
||||
--color-brand: #4d9227;
|
||||
--color-brand: #5da545;
|
||||
--color-brand-hover: #53923e;
|
||||
--color-brand-active: #4b8138;
|
||||
--color-brand-light: #6bac57;
|
||||
--color-brand-inverted: #ffffff;
|
||||
--color-brand-2: #5fa33b;
|
||||
--color-brand-3: #c5ddb7;
|
||||
--color-brand-disabled: #e2e8f0;
|
||||
|
||||
--color-grey-0: #f7fafc;
|
||||
--color-grey-1: #edf2f7;
|
||||
--color-grey-2: #e2e8f0;
|
||||
--color-grey-3: #cbd5e0;
|
||||
--color-grey-4: #a0aec0;
|
||||
--color-grey-5: #718096;
|
||||
--color-grey-6: #4a5568;
|
||||
--color-grey-7: #2d3748;
|
||||
--color-button-bg: var(--color-bg);
|
||||
--color-button-text: var(--color-text-dark);
|
||||
--color-button-bg-hover: #e0e7ee;
|
||||
--color-button-text-hover: #1b1e24;
|
||||
--color-button-bg-active: #d0d7df;
|
||||
--color-button-text-active: var(--color-button-text-hover);
|
||||
--color-button-bg-disabled: #eceef0;
|
||||
--color-button-text-disabled: #9da3ac;
|
||||
--color-transparent-button-bg-hover: var(--color-button-bg);
|
||||
--color-transparent-button-text-hover: var(--color-text-dark);
|
||||
--color-transparent-button-bg-active: var(--color-button-bg-hover);
|
||||
--color-transparent-button-text-active: var(--color-text-dark);
|
||||
|
||||
--color-dropdown-bg: var(--color-button-bg);
|
||||
--color-dropdown-text: var(--color-button-text);
|
||||
|
||||
--color-category-bg: var(--color-bg);
|
||||
--color-category-text: var(--color-text-dark);
|
||||
|
||||
--color-tooltip-bg: var(--color-text);
|
||||
--color-tooltip-text: var(--color-bg);
|
||||
|
||||
--color-code-bg: var(--color-bg);
|
||||
--color-code-text: var(--color-text-dark);
|
||||
|
||||
--color-ad: #d6e6f9;
|
||||
|
||||
--shadow-dropdown: 3px 3px 14px hsla(0, 0%, 0%, 0.15);
|
||||
--shadow-dropdown-strong: 3px 3px 10px hsla(0, 0%, 0%, 0.3);
|
||||
--shadow-tooltip: 0.2rem 0.2rem 10px rgba(0, 0, 0, 0.15);
|
||||
|
||||
--color-link: #2089ff;
|
||||
|
||||
--color-badge-gray-text: #646161;
|
||||
--color-badge-gray-bg: #c8c1c1;
|
||||
--color-badge-red-text: #9b2c2c;
|
||||
--color-badge-red-bg: #fed7d7;
|
||||
--color-badge-green-text: #276749;
|
||||
--color-badge-green-bg: #c6f6d5;
|
||||
--color-badge-yellow-text: #675027;
|
||||
--color-badge-yellow-bg: #f6e8c6;
|
||||
|
||||
--color-block-quote: var(--color-tooltip-bg);
|
||||
--color-header-underline: var(--color-tooltip-text);
|
||||
--color-hr: var(--color-text);
|
||||
}
|
||||
|
||||
.dark-mode {
|
||||
--color-text: #ccccc2;
|
||||
--color-bg: #191917;
|
||||
--color-icon: #acacac;
|
||||
--color-text: #cecece;
|
||||
--color-text-medium:#e4e4e4;
|
||||
--color-text-dark:#ffffff;
|
||||
--color-heading: #ffffff;
|
||||
--color-heading-light: #8a8a8a;
|
||||
--color-bg: #171719;
|
||||
--color-raised-bg: #222224;
|
||||
--color-divider: #49494d;
|
||||
--color-divider-dark: #646468;
|
||||
|
||||
--color-text-inverted: var(--color-bg);
|
||||
--color-bg-inverted: var(--color-text);
|
||||
|
||||
--color-brand: #4d9227;
|
||||
--color-brand: #5da545;
|
||||
--color-brand-hover: #6bac57;
|
||||
--color-brand-active: #7fc46a;
|
||||
--color-brand-light: #6bac57;
|
||||
--color-brand-inverted: #ffffff;
|
||||
--color-brand-2: #438121;
|
||||
--color-brand-3: #344d26;
|
||||
--color-brand-disabled: #414146;
|
||||
|
||||
--color-grey-7: #f7faf0;
|
||||
--color-grey-6: #f7f2eb;
|
||||
--color-grey-5: #ede9e4;
|
||||
--color-grey-4: #b3b3b3;
|
||||
--color-grey-3: #797b76;
|
||||
--color-grey-2: #3b3937;
|
||||
--color-grey-1: #3a3b38;
|
||||
--color-grey-0: #1d1e1b;
|
||||
--color-button-bg: #343438;
|
||||
--color-button-text: var(--color-text);
|
||||
--color-button-bg-hover: #3a3a3f;
|
||||
--color-button-text-hover: #ffffff;
|
||||
--color-button-bg-active: #49494e;
|
||||
--color-button-text-active: var(--color-button-text-hover);
|
||||
--color-button-text-disabled: #444444;
|
||||
--color-transparent-button-bg-hover: var(--color-button-bg);
|
||||
--color-transparent-button-text-hover: var(--color-text-dark);
|
||||
--color-transparent-button-bg-active: var(--color-button-bg-hover);
|
||||
--color-transparent-button-text-active: var(--color-text-dark);
|
||||
|
||||
--color-dropdown-bg: var(--color-button-bg);
|
||||
--color-dropdown-text: var(--color-button-text);
|
||||
|
||||
--color-category-bg: var(--color-button-bg);
|
||||
--color-category-text: var(--color-text-dark);
|
||||
|
||||
--color-tooltip-bg: var(--color-text);
|
||||
--color-tooltip-text: var(--color-bg);
|
||||
|
||||
--color-code-bg: var(--color-button-bg);
|
||||
--color-code-text: var(--color-text-dark);
|
||||
|
||||
--color-ad: #2c323a;
|
||||
|
||||
--shadow-dropdown: 3px 3px 14px hsla(0, 0%, 0%, 0.15);
|
||||
--shadow-dropdown-strong: 3px 3px 20px hsla(0, 0%, 0%, 0.15);
|
||||
--shadow-tooltip: 0.2rem 0.2rem 10px rgba(0, 0, 0, 0.15);
|
||||
|
||||
--color-link: #4793d9;
|
||||
|
||||
--color-badge-gray-bg: #646161;
|
||||
--color-badge-gray-text: #c8c1c1;
|
||||
--color-badge-red-bg: #9b2c2c;
|
||||
--color-badge-red-text: #fed7d7;
|
||||
--color-badge-green-bg: #276749;
|
||||
--color-badge-green-text: #c6f6d5;
|
||||
--color-badge-yellow-bg: #675027;
|
||||
--color-badge-yellow-text: #f6e8c6;
|
||||
|
||||
--color-block-quote:var(--color-code-bg);
|
||||
--color-header-underline: var(--color-tooltip-text);
|
||||
--color-hr: var(--color-text);
|
||||
}
|
||||
|
||||
body {
|
||||
// Defaults
|
||||
background-color: var(--color-bg);
|
||||
color: var(--color-text);
|
||||
font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, Oxygen,
|
||||
Ubuntu, Roboto, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
|
||||
--font-standard: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, Oxygen, Ubuntu, Roboto, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
|
||||
font-family: var(--font-standard);
|
||||
font-size: 16px;
|
||||
font-weight: var(--font-weight-medium);
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
/**
|
||||
* Sizes
|
||||
*/
|
||||
--size-rounded-sm: 0.25rem;
|
||||
--size-rounded-md: 0.5rem;
|
||||
--size-rounded-lg: 1rem;
|
||||
overflow-y: overlay;
|
||||
|
||||
/**
|
||||
* Defaults
|
||||
*/
|
||||
font-size: 18px;
|
||||
// Rounding sizes
|
||||
--size-rounded-xs: 0.5rem;
|
||||
--size-rounded-sm: 0.75rem;
|
||||
--size-rounded-md: 1rem;
|
||||
--size-rounded-lg: 1.25rem;
|
||||
|
||||
--size-rounded-max: 999999999px;
|
||||
--size-rounded-card: 0.5rem;
|
||||
--size-rounded-icon: 0.5rem;
|
||||
--size-rounded-control: 0.25rem;
|
||||
--size-rounded-tooltip: 0.25rem;
|
||||
|
||||
--size-navbar-height: 4rem;
|
||||
|
||||
--spacing-card-lg: 1.5rem;
|
||||
--spacing-card-md: 0.75rem;
|
||||
--spacing-card-sm: 0.5rem;
|
||||
|
||||
// Font Sizes
|
||||
--font-size-xxs: 0.625rem; //10px
|
||||
--font-size-xs: 0.75rem; //12px
|
||||
--font-size-sm: 0.875rem; //14px
|
||||
--font-size-nm: 1rem; //16px
|
||||
--font-size-md: 1.125rem; //18px
|
||||
--font-size-lg: 1.25rem; //20px
|
||||
--font-size-xl: 1.5rem; //24px
|
||||
--font-size-2xl: 2rem; //32px
|
||||
--font-size-3xl: 3rem; //48px
|
||||
|
||||
// Font Weights
|
||||
--font-weight-regular: 400;
|
||||
--font-weight-medium: 500;
|
||||
--font-weight-bold: 700;
|
||||
--font-weight-extrabold: 800;
|
||||
|
||||
--font-weight-text: var(--font-weight-medium);
|
||||
--font-weight-heading: var(--font-weight-extrabold);
|
||||
--font-weight-title: var(--font-weight-extrabold);
|
||||
|
||||
// Temporary
|
||||
--color-grey-7: #ff0000;
|
||||
--color-grey-6: #ff0000;
|
||||
--color-grey-5: #ff0000;
|
||||
--color-grey-4: #ff0000;
|
||||
--color-grey-3: #ff0000;
|
||||
--color-grey-2: #ff0000;
|
||||
--color-grey-1: #ff0000;
|
||||
--color-grey-0: #ff0000;
|
||||
}
|
||||
|
||||
svg {
|
||||
@@ -72,38 +213,91 @@ a {
|
||||
|
||||
h2 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 1.25rem;
|
||||
margin-bottom: 1rem;
|
||||
color: var(--color-text-dark);
|
||||
}
|
||||
|
||||
h3 {
|
||||
margin-top: 1rem;
|
||||
margin-bottom: 0.5rem;
|
||||
margin-top: 0.5rem;
|
||||
margin-bottom: 0;
|
||||
color: var(--color-text-dark);
|
||||
}
|
||||
|
||||
input {
|
||||
background: var(--color-bg);
|
||||
border: 2px solid var(--color-grey-3);
|
||||
border-radius: var(--size-rounded-sm);
|
||||
color: var(--color-grey-9);
|
||||
font-size: 1rem;
|
||||
button {
|
||||
cursor: pointer;
|
||||
@extend .button;
|
||||
}
|
||||
|
||||
input,
|
||||
textarea {
|
||||
background: var(--color-button-bg);
|
||||
border-radius: var(--size-rounded-control);
|
||||
color: var(--color-text);
|
||||
padding: 0.5rem 1rem;
|
||||
width: 100%;
|
||||
border: 2px solid transparent;
|
||||
|
||||
&:focus,
|
||||
&:hover {
|
||||
border-color: var(--color-grey-4);
|
||||
background: var(--color-button-bg-hover);
|
||||
color: var(--color-text);
|
||||
outline: none;
|
||||
|
||||
&::placeholder {
|
||||
color: var(--color-grey-7);
|
||||
color: var(--color-text);
|
||||
}
|
||||
}
|
||||
|
||||
&:focus {
|
||||
background: var(--color-raised-bg);
|
||||
border-color: var(--color-divider-dark);
|
||||
}
|
||||
|
||||
&::placeholder {
|
||||
color: var(--color-grey-6);
|
||||
color: var(--color-color-text);
|
||||
}
|
||||
}
|
||||
|
||||
.ea-content {
|
||||
background: var(--color-ad) !important;
|
||||
border-radius: var(--size-rounded-card) !important;
|
||||
margin-left: 0 !important;
|
||||
margin-right: 0 !important;
|
||||
margin-bottom: 0 !important;
|
||||
margin-top: 0 !important;
|
||||
box-shadow: var(--shadow-faint) !important;
|
||||
}
|
||||
|
||||
.ea-callout {
|
||||
margin-top: 0.25rem !important;
|
||||
margin-bottom: 0.25rem !important;
|
||||
margin-left: 0 !important;
|
||||
margin-right: 0 !important;
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
button {
|
||||
padding: 0.5rem 0;
|
||||
outline: none;
|
||||
color: var(--color-button-text);
|
||||
background-color: var(--color-button-bg);
|
||||
border: none;
|
||||
border-radius: var(--size-rounded-control);
|
||||
|
||||
&:focus,
|
||||
&:hover {
|
||||
background-color: var(--color-button-bg-hover);
|
||||
color: var(--color-button-text-hover);
|
||||
}
|
||||
|
||||
&:active {
|
||||
background-color: var(--color-button-bg-active);
|
||||
color: var(--color-button-text-active);
|
||||
}
|
||||
}
|
||||
|
||||
// @import "vue-select/src/scss/vue-select.scss";
|
||||
|
||||
|
||||
@import "~assets/styles/highlightjs.scss";
|
||||
@import "~assets/styles/layout.scss";
|
||||
@import "~assets/styles/utils.scss";
|
||||
|
||||
87
assets/styles/injected.scss
Normal file
@@ -0,0 +1,87 @@
|
||||
%card {
|
||||
background: var(--color-raised-bg);
|
||||
border-radius: var(--size-rounded-card);
|
||||
}
|
||||
|
||||
%card-spaced-b {
|
||||
@extend %card;
|
||||
margin-bottom: var(--spacing-card-md);
|
||||
}
|
||||
|
||||
%row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
%column {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
%transparent-clickable {
|
||||
border-radius: var(--size-rounded-control);
|
||||
color: var(--color-text);
|
||||
background-color: transparent;
|
||||
&:focus,
|
||||
&:hover,
|
||||
&.selected,
|
||||
&.nuxt-link-exact-active {
|
||||
color: var(--color-transparent-button-text-hover);
|
||||
background-color: var(--color-transparent-button-bg-hover);
|
||||
}
|
||||
&:active {
|
||||
color: var(--color-transparent-button-text-active);
|
||||
background-color: var(--color-transparent-button-bg-active);
|
||||
}
|
||||
}
|
||||
|
||||
%label {
|
||||
color: var(--color-text);
|
||||
font-weight: var(--font-weight-extrabold);
|
||||
letter-spacing: 0.02rem;
|
||||
margin: 0;
|
||||
margin-bottom: 0.25em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
%small-label {
|
||||
@extend %label;
|
||||
color: var(--color-text);
|
||||
font-size: var(--font-size-xs);
|
||||
letter-spacing: 0.02rem;
|
||||
}
|
||||
|
||||
%large-label {
|
||||
@extend %label;
|
||||
color: var(--color-text);
|
||||
font-size: var(--font-size-sm);
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
%stat {
|
||||
margin-top: 0.5rem;
|
||||
margin-right: 1rem;
|
||||
@extend %row;
|
||||
|
||||
@media screen and (min-width: 900px) {
|
||||
margin-top: 0;
|
||||
}
|
||||
svg {
|
||||
margin: auto 0.5rem auto 0;
|
||||
height: 1.5rem;
|
||||
width: 1.5rem;
|
||||
color: var(--color-icon);
|
||||
}
|
||||
.info {
|
||||
margin: auto 0;
|
||||
white-space: nowrap;
|
||||
h4 {
|
||||
@extend %small-label;
|
||||
}
|
||||
.value {
|
||||
font-size: var(--font-size-sm);
|
||||
margin: 0;
|
||||
color: var(--color-text-dark);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -10,7 +10,7 @@
|
||||
|
||||
.rows {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-direction: column;
|
||||
|
||||
@for $i from 1 through 4 {
|
||||
.row-grow-#{$i} {
|
||||
@@ -18,7 +18,20 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.w-100 {
|
||||
width: 100%;
|
||||
}
|
||||
.page-container {
|
||||
margin: var(--spacing-card-lg);
|
||||
.page-contents {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
.content {
|
||||
width: 100%;
|
||||
}
|
||||
@media screen and (min-width: 900px) {
|
||||
}
|
||||
@media screen and (min-width: 1024px) {
|
||||
max-width: 1280px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,7 +1,7 @@
|
||||
.rounded-md {
|
||||
border-radius: 0.5rem;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.w-100 {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||