granblue.team/hensei-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add variables for the hover scale effects

Browse source
This commit is contained in:
Justin Edmund 2022-02-01 05:29:03 -08:00
parent dd974fde2e
commit 67d5ada594
4 changed files with 10 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
components/CharacterUnit/index.scss
View file

@ -22,7 +22,7 @@
border: 1px solid rgba(0, 0, 0, 0.1); border: 1px solid rgba(0, 0, 0, 0.1);
box-shadow: rgba(0, 0, 0, 0.14) 0px 0px 14px; box-shadow: rgba(0, 0, 0, 0.14) 0px 0px 14px;
cursor: pointer; cursor: pointer;
transform: scale(1.025, 1.025); transform: $scale-tall;
} }
.CharacterUnit.filled h3 { .CharacterUnit.filled h3 {

4
components/SummonUnit/index.scss
View file

@ -33,12 +33,12 @@
border: 1px solid rgba(0, 0, 0, 0.1); border: 1px solid rgba(0, 0, 0, 0.1);
box-shadow: rgba(0, 0, 0, 0.14) 0px 0px 14px; box-shadow: rgba(0, 0, 0, 0.14) 0px 0px 14px;
cursor: pointer; cursor: pointer;
transform: scale(1.05, 1.05); transform: $scale-wide;
} }
&.main.editable .SummonImage:hover, &.main.editable .SummonImage:hover,
&.friend.editable .SummonImage:hover { &.friend.editable .SummonImage:hover {
transform: scale(1.025, 1.025); transform: $scale-tall;
} }
&.filled h3 { &.filled h3 {

4
components/WeaponUnit/index.scss
View file

@ -20,11 +20,11 @@
border: 1px solid rgba(0, 0, 0, 0.1); border: 1px solid rgba(0, 0, 0, 0.1);
box-shadow: rgba(0, 0, 0, 0.14) 0px 0px 14px; box-shadow: rgba(0, 0, 0, 0.14) 0px 0px 14px;
cursor: pointer; cursor: pointer;
transform: scale(1.05, 1.05); transform: $scale-wide;
} }
.WeaponUnit.mainhand.editable .WeaponImage:hover { .WeaponUnit.mainhand.editable .WeaponImage:hover {
transform: scale(1.025, 1.025); transform: $scale-tall;
} }
.WeaponUnit.filled h3 { .WeaponUnit.filled h3 {

4
styles/variables.scss
View file

@ -27,3 +27,7 @@ $font-small: 12px;
$font-regular: 14px; $font-regular: 14px;
$font-large: 18px; $font-large: 18px;
$font-xlarge: 21px; $font-xlarge: 21px;
// Scale factors
$scale-wide: scale(1.05, 1.05);
$scale-tall: scale(1.012, 1.012);