weyne/DCSOlympus
1
0
Fork 0
mirror of https://github.com/Pax1601/DCSOlympus.git synced 2025-10-29 16:56:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #634 from Pax1601/minor-refactoring

Browse Source 
Minor refactoring
This commit is contained in:
Pax1601
2023-12-02 12:37:55 +01:00
committed by GitHub
parent 4342575418 4cdb73a60d
commit 0ca7766689
22 changed files with 420 additions and 93 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
client/public/stylesheets/markers/airbase.css
View File

@@ -4,6 +4,8 @@
display: flex;
justify-content: center;
position: relative;
width: 100%;
height: 100%;
}
.airbase-icon[data-coalition="red"] svg * {

2
client/public/stylesheets/markers/bullseye.css
View File

@@ -4,6 +4,8 @@
display: flex;
justify-content: center;
position: relative;
width: 100%;
height: 100%;
}
.bullseye-icon[data-coalition="red"] svg * {

5
client/public/stylesheets/markers/units.css
View File

@@ -50,6 +50,11 @@
width: var(--unit-width);
}
.unit-icon svg {
height: 100%;
width: 100%;
}
[data-is-selected] .unit-icon::before {
background-color: var(--unit-spotlight-fill);
border-radius: 50%;

86
client/public/stylesheets/other/contextmenus.css
View File

@@ -61,9 +61,13 @@
.contextmenu-advanced-options-toggle:after,
.contextmenu-metadata-toggle:after {
content: url(/resources/theme/images/icons/chevron-down.svg);
content: "";
margin-left: auto;
margin-top: auto;
background-image: url(/resources/theme/images/icons/chevron-down.svg);
background-size: 100% 100%;
width: 15px;
height: 15px;
}
.contextmenu-advanced-options-toggle.is-open:after,
@@ -407,84 +411,124 @@
/* Buttons */
#center-map::before {
content: url("/resources/theme/images/icons/arrows-to-eye-solid.svg");
background-image: url("/resources/theme/images/icons/arrows-to-eye-solid.svg");
content: "";
background-size: 20px 20px;
}
#refuel::before {
content: url("/resources/theme/images/icons/fuel.svg");
background-image: url("/resources/theme/images/icons/fuel.svg");
content: "";
background-size: 20px 20px;
}
#attack::before {
content: url("/resources/theme/images/icons/sword.svg");
background-image: url("/resources/theme/images/icons/sword.svg");
content: "";
background-size: 20px 20px;
}
#bomb::before {
content: url("/resources/theme/images/icons/crosshairs-solid.svg");
background-image: url("/resources/theme/images/icons/crosshairs-solid.svg");
content: "";
background-size: 20px 20px;
}
#carpet-bomb::before {
content: url("/resources/theme/images/icons/explosion-solid.svg");
background-image: url("/resources/theme/images/icons/explosion-solid.svg");
content: "";
background-size: 20px 20px;
}
#fire-at-area::before {
content: url("/resources/theme/images/icons/crosshairs-solid.svg");
background-image: url("/resources/theme/images/icons/crosshairs-solid.svg");
content: "";
background-size: 20px 20px;
}
#simulate-fire-fight::before {
content: url("/resources/theme/images/icons/crosshairs-solid.svg");
background-image: url("/resources/theme/images/icons/crosshairs-solid.svg");
content: "";
background-size: 20px 20px;
}
#follow::before {
content: url("/resources/theme/images/icons/follow.svg");
background-image: url("/resources/theme/images/icons/follow.svg");
content: "";
background-size: 20px 20px;
}
#scenic-aaa::before {
content: url("/resources/theme/images/icons/scenic.svg");
background-image: url("/resources/theme/images/icons/scenic.svg");
content: "";
background-size: 20px 20px;
}
#miss-aaa::before {
content: url("/resources/theme/images/icons/miss.svg");
background-image: url("/resources/theme/images/icons/miss.svg");
content: "";
background-size: 20px 20px;
}
#group-ground::before {
content: url("/resources/theme/images/icons/group-ground.svg");
background-image: url("/resources/theme/images/icons/group-ground.svg");
content: "";
background-size: 20px 20px;
}
#group-navy::before {
content: url("/resources/theme/images/icons/group-navy.svg");
background-image: url("/resources/theme/images/icons/group-navy.svg");
content: "";
background-size: 20px 20px;
}
#land-at-point::before {
content: url("/resources/theme/images/icons/land-at-point.svg");
background-image: url("/resources/theme/images/icons/land-at-point.svg");
content: "";
background-size: 20px 20px;
}
#trail::before {
content: url("/resources/theme/images/icons/trail.svg");
background-image: url("/resources/theme/images/icons/trail.svg");
content: "";
background-size: 20px 20px;
}
#echelon-lh::before {
content: url("/resources/theme/images/icons/echelon-lh.svg");
background-image: url("/resources/theme/images/icons/echelon-lh.svg");
content: "";
background-size: 20px 20px;
}
#echelon-rh::before {
content: url("/resources/theme/images/icons/echelon-rh.svg");
background-image: url("/resources/theme/images/icons/echelon-rh.svg");
content: "";
background-size: 20px 20px;
}
#line-abreast-rh::before,
#line-abreast-lh::before {
content: url("/resources/theme/images/icons/line-abreast.svg");
background-image: url("/resources/theme/images/icons/line-abreast.svg");
content: "";
background-size: 20px 20px;
}
#front::before {
content: url("/resources/theme/images/icons/front.svg");
background-image: url("/resources/theme/images/icons/front.svg");
content: "";
background-size: 20px 20px;
}
#diamond::before {
content: url("/resources/theme/images/icons/diamond.svg");
background-image: url("/resources/theme/images/icons/diamond.svg");
content: "";
background-size: 20px 20px;
}
#custom::before {
content: url("/resources/theme/images/icons/custom.svg");
background-image: url("/resources/theme/images/icons/custom.svg");
content: "";
background-size: 20px 20px;
}
#custom-formation-dialog {

6
client/public/stylesheets/panels/logpanel.css
View File

@@ -27,7 +27,6 @@
display: block;
}
#log-panel-header-right {
align-items: center;
column-gap: 16px;
@@ -35,6 +34,11 @@
flex-flow: row nowrap;
}
#log-panel-header-right svg {
width: 15px;
height: 15px;
}
#server-status-panel abbr {
text-decoration: none;
}

120
client/public/stylesheets/panels/unitcontrol.css
View File

@@ -6,60 +6,69 @@ body.feature-forceShowUnitControlPanel #unit-control-panel {
#roe-buttons-container button,
#reaction-to-threat-buttons-container button,
#emissions-countermeasures-buttons-container button,
#shots-scatter-buttons-container button
#shots-intensity-buttons-container button {
align-items: center;
background-color: transparent;
border: 1px solid var(--accent-light-blue);
display: flex;
height: 30px;
justify-content: center;
width: 30px;
#shots-scatter-buttons-container button #shots-intensity-buttons-container button {
align-items: center;
background-color: transparent;
border: 1px solid var(--accent-light-blue);
display: flex;
height: 30px;
justify-content: center;
width: 30px;
}
#reaction-to-threat-buttons-container button:not(:first-child) svg {
width: 150%;
margin: -5px;
width: 150%;
margin: -5px;
}
#unit-control-panel .ol-option-button button {
width: 30px;
height: 30px;
}
#unit-control-panel .ol-option-button svg {
width: 100%;
height: 100%;
}
#unit-control-panel .ol-option-button button.selected {
background-color: white;
border-color: white;
background-color: white;
border-color: white;
}
#unit-control-panel .ol-option-button button.selected svg * {
fill: var(--background-steel);
stroke: var(--background-steel);
fill: var(--background-steel);
stroke: var(--background-steel);
}
#rapid-controls {
display: flex;
flex-direction: column;
row-gap: 5px;
height: fit-content;
width: fit-content;
display: flex;
flex-direction: column;
row-gap: 5px;
height: fit-content;
width: fit-content;
}
#rapid-controls button {
padding: 4px;
padding: 4px;
}
#rapid-controls button.pulse {
animation: pulse 1.5s linear infinite;
animation: pulse 1.5s linear infinite;
}
#rapid-controls svg {
height: 20px;
width: 20px;
fill: white;
stroke: white;
height: 20px;
width: 20px;
fill: white;
stroke: white;
}
#rapid-controls button:before {
display: inline-block;
filter: invert(100%);
height: 20px;
width: 20px;
display: inline-block;
filter: invert(100%);
height: 20px;
width: 20px;
}
#unit-control-panel {
@@ -109,7 +118,7 @@ body.feature-forceShowUnitControlPanel #unit-control-panel {
width: fit-content;
}
#unit-control-panel:not(:hover)>*:nth-child(2),
#unit-control-panel:not(:hover)>*:nth-child(2),
#unit-control-panel:not(:hover)>*:nth-child(3) {
display: none;
}
@@ -196,7 +205,7 @@ body.feature-forceShowUnitControlPanel #unit-control-panel {
}
#advanced-settings-dialog>.ol-dialog-content>div input[type="number"] {
width: 60px;
width: 60px;
}
#advanced-settings-dialog hr {
@@ -266,7 +275,6 @@ body.feature-forceShowUnitControlPanel #unit-control-panel {
width: 40px;
}
.ol-slider-value {
color: var(--accent-light-blue);
cursor: pointer;
@@ -276,13 +284,15 @@ body.feature-forceShowUnitControlPanel #unit-control-panel {
.switch-control {
align-items: center;
align-content: center;
display: flex;
width: 100%;
justify-content: space-between;
}
.switch-control h4 {
margin: 0px;
margin: 0px !important;
padding: 0px;
display: flex;
align-items: center;
}
@@ -303,30 +313,30 @@ body.feature-forceShowUnitControlPanel #unit-control-panel {
position: relative;
}
#advanced-settings-div > button {
#advanced-settings-div>button {
background-color: var(--background-grey);
box-shadow: 0px 2px 5px #000A;
font-size:13px;
box-shadow: 0px 2px 5px #000A;
font-size: 13px;
height: 40px;
padding:0 20px;
padding: 0 20px;
}
#delete-options {
font-size:13px;
font-size: 13px;
}
#delete-options.ol-select > .ol-select-value:after {
#delete-options.ol-select>.ol-select-value:after {
content: "";
}
#delete-options.ol-select > .ol-select-value svg {
#delete-options.ol-select>.ol-select-value svg {
background-color: transparent;
position: absolute;
right:2px;
translate:0 1px;
right: 2px;
translate: 0 1px;
}
#delete-options.ol-select > .ol-select-value svg * {
#delete-options.ol-select>.ol-select-value svg * {
fill: var(--primary-red);
}
@@ -334,21 +344,21 @@ body.feature-forceShowUnitControlPanel #unit-control-panel {
background-color: var(--background-steel);
}
#delete-options.ol-select > .ol-select-value:hover,
#delete-options .ol-select-options > div:not(.hr):hover,
#delete-options .ol-select-options > div:not(.hr):hover button,
#delete-options .ol-select-options > div hr {
#delete-options.ol-select>.ol-select-value:hover,
#delete-options .ol-select-options>div:not(.hr):hover,
#delete-options .ol-select-options>div:not(.hr):hover button,
#delete-options .ol-select-options>div hr {
background-color: var(--background-grey);
}
#delete-options .ol-select-options > div:first-of-type {
margin-top:12px;
padding-top:0;
#delete-options .ol-select-options>div:first-of-type {
margin-top: 12px;
padding-top: 0;
}
#delete-options .ol-select-options > div:last-of-type {
margin-bottom:12px;
padding-bottom:0;
#delete-options .ol-select-options>div:last-of-type {
margin-bottom: 12px;
padding-bottom: 0;
}
#delete-options button {
@@ -389,4 +399,4 @@ body.feature-forceShowUnitControlPanel #unit-control-panel {
#advanced-settings-dialog:not([data-show-radio]) #radio-options,
#advanced-settings-dialog:not([data-show-air-unit-checkboxes]) .air-unit-checkbox {
display: none;
}
}

6
client/public/stylesheets/panels/unitinfo.css
View File

@@ -146,12 +146,12 @@
}
#fuel-percentage::before {
content: url("/resources/theme/images/icons/fuel.svg");
content: "";
background-image: url("/resources/theme/images/icons/fuel.svg");
background-size: 16px 16px;
display: inline-block;
filter: invert(100%);
height: 16px;
margin-right: 6px;
width: 16px;
}
#fuel-percentage::after {

14
client/public/stylesheets/style/style.css
View File

@@ -206,9 +206,17 @@ button svg.fill-coalition[data-coalition="red"] * {
}
.ol-select:not(.ol-select-image)>.ol-select-value:after {
content: url("/resources/theme/images/icons/chevron-down.svg");
background-image: url("/resources/theme/images/icons/chevron-down.svg");
content: "";
position: absolute;
right: 10px;
width: 15px;
height: 15px;
background-size: 100% 100%;
}
.ol-select:not(.ol-select-image)>.ol-select-value.ol-select-warning:after {
background-image: url("/resources/theme/images/icons/chevron-down-warning.svg") !important;
}
.ol-select.is-open:not(.ol-select-image)>.ol-select-value:after {
@@ -441,6 +449,7 @@ nav.ol-panel> :last-child {
-webkit-filter: invert(100%);
height: 16px;
width: 16px;
background-size: 100% 100%;
}
.ol-panel .ol-group-button-toggle button.off::before {
@@ -1328,7 +1337,7 @@ dl.ol-data-grid dd {
align-content: center;
border-top: 1px solid var(--background-grey);
display: flex;
justify-content: center;
justify-content: flex-end;
padding-top: 15px;
row-gap: 10px;
}
@@ -1362,6 +1371,7 @@ dl.ol-data-grid dd {
height: 16px;
margin-right: 10px;
width: 16px;
background-size: 100% 100%;
}
.ol-checkbox input[type="checkbox"]:disabled:before {

3
client/public/themes/olympus/images/icons/chevron-down-warning.svg Normal file
View File

@@ -0,0 +1,3 @@
<svg width="14" height="8" viewBox="0 0 14 8" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6.37109 7.37891C6.69922 7.73438 7.27344 7.73438 7.60156 7.37891L12.8516 2.12891C13.207 1.80078 13.207 1.22656 12.8516 0.898438C12.5234 0.542969 11.9492 0.542969 11.6211 0.898438L7 5.51953L2.35156 0.898438C2.02344 0.542969 1.44922 0.542969 1.12109 0.898438C0.765625 1.22656 0.765625 1.80078 1.12109 2.12891L6.37109 7.37891Z" fill="#ff5858"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 452 B

BIN
client/public/themes/olympus/images/parrot/parrot.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 41 KiB

54
client/public/themes/parrot/images/parrot.svg Normal file
View File

@@ -0,0 +1,54 @@
<?xml version="1.0" encoding="iso-8859-1"?>
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
<svg height="800px" width="800px" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
viewBox="0 0 460 460" xml:space="preserve">
<g id="XMLID_2582_">
<path id="XMLID_4_" style="fill:#871A27;" d="M353.16,459.97L353.16,459.97c-32.138-3.383-61.944-18.336-83.849-42.066
L65.784,206.343c-6.885-7.157-3.266-19.083,6.439-21.217l26.729-5.878l258.429,272.378
C360.487,455.023,357.74,460.452,353.16,459.97z"/>
<path id="XMLID_2108_" style="fill:#A52531;" d="M403.222,459.97L403.222,459.97c-32.138-3.383-61.944-18.336-83.849-42.066
L100.124,190l48.891-10.752l258.429,272.378C410.549,455.023,407.802,460.452,403.222,459.97z"/>
<path id="XMLID_2018_" style="fill:#CC3248;" d="M454.455,459.97L454.455,459.97c-32.138-3.383-61.944-18.336-83.849-42.066
L151.357,190l48.891-10.752l258.429,272.378C461.782,455.023,459.035,460.452,454.455,459.97z"/>
<path id="XMLID_2391_" style="fill:#C1A991;" d="M280.347,380h-80.099l-9.48,37.873C188.984,425,182.572,430,175.217,430
s-13.767-5-15.551-12.127L150.186,380h-0.277c-40.008,0-73.881-29.485-79.348-69.069L44.112,119.414
C30.376,116.668,20.025,104.544,20.025,90H0c0-20.678,15.692-37.69,35.817-39.781C35.079,22.989,56.998,0,84.812,0l0,0
c21.102,0,39.837,13.487,46.51,33.481l0.617,1.848c8.632,25.864,26.455,47.418,49.597,61.877
c8.184,5.113,15.785,13.683,19.63,27.974L280.347,380z"/>
<path id="XMLID_2087_" style="fill:#473C3F;" d="M180.223,420v10v10v5c0,8.284-6.724,15-15.019,15h-50.062
c-2.765,0-5.006-2.239-5.006-5l0,0c0-8.284,6.724-15,15.019-15h35.043c5.53,0,10.012-4.477,10.012-10v-10H180.223z"/>
<path id="XMLID_1701_" style="fill:#9B1C2B;" d="M280.347,380h-80.099l-9.48,37.873C188.984,425,182.572,430,175.217,430
s-13.767-5-15.551-12.127L150.186,380h-0.277c-40.008,0-73.881-29.485-79.348-69.069L44.112,119.414L30.382,90H52.77
c4.803,0,9.541-1.117,13.837-3.262l16.413-8.197c10.482-5.234,17.103-15.935,17.103-27.639C100.124,33.835,86.272,20,69.184,20
H45.307C54.179,7.937,68.475,0,84.812,0l0,0c21.102,0,39.837,13.487,46.51,33.481l0.617,1.848
c8.632,25.864,26.455,47.418,49.597,61.877c8.184,5.113,15.785,13.683,19.63,27.974L280.347,380z"/>
<path id="XMLID_2389_" style="fill:#8C735D;" d="M40.05,90l4.062,29.414C30.376,116.668,20.025,104.544,20.025,90H0
c0-3.454,0.447-6.803,1.27-10h37.667L40.05,90z"/>
<path id="XMLID_1631_" style="fill:#AF8F6D;" d="M40.05,90H0c0-20.676,15.688-37.686,35.81-39.781
c0.037,1.375,0.121,2.759,0.276,4.154L40.05,90z"/>
<path id="XMLID_2088_" style="fill:#66313A;" d="M70.087,45c0,2.761-2.241,5-5.006,5s-5.006-2.239-5.006-5s2.241-5,5.006-5
C67.845,40,70.087,42.239,70.087,45z"/>
<path id="XMLID_1864_" style="fill:#720C1F;" d="M150.186,380h50.062l-5.006,20h-40.049L150.186,380z"/>
<path id="XMLID_1836_" style="fill:#720C1F;" d="M331.261,397.796L246.772,194.5c-19.25-46.319-62.419-73.992-106.431-68.225
l-33.801,4.429c-6.283,0.823-10.071,7.378-7.641,13.223l82.08,197.501c19.25,46.32,62.419,73.992,106.431,68.226l40.03-5.245
C330.582,403.996,332.476,400.719,331.261,397.796z"/>
<path id="XMLID_1924_" style="fill:#871A27;" d="M349.271,380.344l-39.554,8.084c-43.488,8.888-88.523-15.638-111.033-60.467
l-95.979-191.149c-2.841-5.657,0.469-12.465,6.677-13.734l33.398-6.826c43.488-8.888,88.523,15.638,111.033,60.468l98.796,196.758
C354.03,376.305,352.375,379.709,349.271,380.344z"/>
<path id="XMLID_1905_" style="fill:#A52531;" d="M351.863,378.865c-39.327,2.272-78.009-21.643-98.331-62.115l-73.749-146.618
c-1.957-3.897-0.994-8.339,1.823-11.141c37.969-0.535,74.788,23.122,94.439,62.258l76.565,152.227
C353.548,375.345,353.139,377.459,351.863,378.865z"/>
<path id="XMLID_1810_" style="fill:#82542E;" d="M349.27,380.344L310.841,385c-43.488,8.888-89.648-12.21-112.158-57.04
l-66.414-132.268c34.538,30.088,78.926,43.67,122.276,34.81l23.828-4.87l74.236,147.845
C354.029,376.305,352.374,379.709,349.27,380.344z"/>
<path id="XMLID_1705_" style="fill:#684627;" d="M351.864,378.865c-0.656,0.723-1.538,1.263-2.592,1.479l-39.307,6.781
c-43.488,8.888-88.77-14.335-111.28-59.165l-66.414-132.268c22.958,20,50.271,32.696,78.737,36.365l42.526,84.693
C273.856,357.223,312.537,381.137,351.864,378.865z"/>
<path id="XMLID_1636_" style="fill:#385056;" d="M349.27,380.344l-39.554,8.084c-43.488,8.888-88.523-15.638-111.033-60.467
l-21.17-42.161c28.416,19.045,62.146,26.827,95.205,20.07l41.667-8.516l38.223,76.123
C354.029,376.305,352.374,379.709,349.27,380.344z"/>
<path id="XMLID_1807_" style="fill:#446772;" d="M249.716,308.257c7.802-0.018,15.644-0.792,23.45-2.388l41.667-8.516
l38.223,76.123c0.594,1.184,0.644,2.466,0.281,3.606c-0.209,0.65-0.552,1.254-1.012,1.765c-0.005,0.006-0.01,0.012-0.016,0.018
c-39.326,2.271-78.007-21.643-98.329-62.115L249.716,308.257z"/>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 4.7 KiB

109
client/public/themes/parrot/theme.css Normal file
View File

@@ -0,0 +1,109 @@
:root {
/** Colours **/
/*** Coalition: neutral ***/
--primary-neutral: #949ba7;
--secondary-neutral-outline: #111111;
--secondary-neutral-text: #111111;
--unit-background-neutral: #CFD9E8;
/*** Coalition: blue ***/
--primary-blue: #247be2;
--secondary-blue-outline: #082e44;
--secondary-blue-text: #017DC1;
--unit-background-blue: #3BB9FF;
/*** Coalition: red ***/
--primary-red: #ff5858;
--secondary-red-outline: #262222;
--secondary-red-text: #D42121;
--unit-background-red: #FF5858;
/*** UI Colours **/
--accent-amber: #ffd828;
--accent-green: #8bff63;
--accent-light-blue: #5ca7ff;
--accent-dark-blue: #017DC1;
--transparent-accent-light-blue: rgba(92, 167, 255, .33);
--accent-light-red: #F5B6B6;
--background-grey: #3d4651;
--background-slate-blue: #363c43;
--background-offwhite: #f2f2f3;
--background-steel: #202831;
--secondary-dark-steel: #181e25;
--secondary-gunmetal-grey: #2f2f2f;
--secondary-lighter-grey: #949ba7;
--secondary-light-grey: #797e83;
--secondary-semitransparent-white: #FFFFFFAA;
--secondary-transparent-white: #FFFFFF30;
--secondary-yellow: #ffd46893;
--background-hover: #f2f2f333;
--nav-text: #ECECEC;
--ol-select-secondary: #545F6C;
--ol-switch-off:#686868;
--ol-switch-undefined:#383838;
/*** General border radii **/
--border-radius-xs: 2px;
--border-radius-sm: 5px;
--border-radius-md: 10px;
--border-radius-lg: 15px;
/*** Fonts **/
--font-weight-bolder: 600;
/*** Unit marker settings ***/
/*** All markers **/
--unit-border-radius: var(--border-radius-xs);
--unit-font-size: 14px;
--unit-font-weight: bolder;
--unit-label-border-width: 2px;
--unit-spotlight-fill: var(--secondary-yellow);
--unit-spotlight-radius: 26px;
--unit-stroke-width: 3px;
--unit-height: 50px;
--unit-width: 50px;
--unit-health-border-width: 2px;
--unit-health-height: 6px;
--unit-health-width: 36px;
--unit-health-x: 0px;
--unit-health-y: 26px;
/*** Air units ***/
--unit-ammo-gap: calc(2px + var(--unit-stroke-width));
--unit-ammo-border-radius: 50%;
--unit-ammo-border-width: 2px;
--unit-ammo-radius: 2px;
--unit-ammo-spacing: 2px;
--unit-ammo-x: 0px;
--unit-ammo-y: 30px;
--unit-fuel-border-width: 2px;
--unit-fuel-height: 6px;
--unit-fuel-width: 36px;
--unit-fuel-x: 0px;
--unit-fuel-y: 22px;
--unit-vvi-width: 4px;
}
* {
font-weight:600;
}
svg {
animation: spin linear infinite 1s;
}
@keyframes spin {
from {
transform:rotate(0deg);
}
to {
transform:rotate(360deg);
}
}