ds4/scss/components/actor/_combat_value.scss

74 lines
1.9 KiB
SCSS
Raw Normal View History

2021-06-26 22:02:00 +02:00
/*
* SPDX-FileCopyrightText: 2021 Johannes Loher
*
* SPDX-License-Identifier: MIT
*/
2022-01-21 03:22:17 +01:00
@use "../../utils/mixins";
@use "../../utils/variables";
2021-04-13 22:48:37 +02:00
.ds4-combat-value {
$size: 3.75rem;
display: grid;
place-items: center;
row-gap: 0.125em;
2021-04-13 22:48:37 +02:00
&__value {
$combat-values-icons-path: "#{variables.$official-icons-path}/combat-values";
@include mixins.centered-content;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
font-size: 1.5em;
height: $size;
width: $size;
&--hitPoints {
background-image: url("#{$combat-values-icons-path}/hit-points.png");
}
&--defense {
background-image: url("#{$combat-values-icons-path}/defense.png");
}
&--initiative {
background-image: url("#{$combat-values-icons-path}/initiative.png");
}
&--movement {
background-image: url("#{$combat-values-icons-path}/movement-rate.png");
}
&--meleeAttack {
background-image: url("#{$combat-values-icons-path}/melee-attack.png");
}
&--rangedAttack {
background-image: url("#{$combat-values-icons-path}/ranged-attack.png");
}
&--spellcasting {
background-image: url("#{$combat-values-icons-path}/spellcasting.png");
}
&--targetedSpellcasting {
background-image: url("#{$combat-values-icons-path}/targeted-spellcasting.png");
}
}
&__label {
2022-01-21 03:22:17 +01:00
@include mixins.font-heading-upper;
font-size: 1.2em;
white-space: nowrap;
}
2021-04-13 22:48:37 +02:00
&__formula {
align-items: center;
justify-content: space-between;
display: flex;
gap: 0.15em;
text-align: center;
width: $size;
}
&__formula-base,
&__formula-modifier {
flex: 1 1 4em;
}
}