Clean up font-size

We'll have to change this to rems in the future, but at least we're just changing variables
This commit is contained in:
Justin Edmund 2022-01-25 01:35:39 -08:00
parent 96265c31f0
commit 471b61b2c0
11 changed files with 87 additions and 30 deletions

View file

@ -19,7 +19,7 @@
.CharacterResult h5 {
color: #555;
display: inline-block;
font-size: 18px;
font-size: $font-large;
font-weight: 500;
margin: 2px 4px 4px 0;
}
@ -31,7 +31,7 @@
.CharacterResult .stars {
display: inline-block;
color: #FFA15E;
font-size: 21px;
font-size: $font-xlarge;
}
.CharacterResult .stars > span {

View file

@ -40,7 +40,7 @@
.CharacterUnit h3 {
color: #333;
font-size: 14px;
font-size: $font-regular;
font-weight: 500;
margin: 0;
max-width: 131px;

View file

@ -9,23 +9,73 @@
position: absolute;
left: 0;
top: 0;
.Modal {
background: #f5f5f5;
border-radius: $unit;
color: $grey-00;
display: flex;
flex-direction: column;
min-width: $unit * 45;
max-width: $unit * 60;
overflow-y: auto;
padding: $unit * 3;
position: relative;
z-index: 10;
#ModalTop {
display: flex;
flex-direction: row;
align-items: center;
margin-bottom: 16px;
margin-right: -8px;
h2 {
font-size: $font-xlarge;
font-weight: 500;
text-align: left;
flex-grow: 1;
}
svg {
fill: $grey-50;
padding: $unit / 2;
height: 18px;
width: 18px;
transform: rotate(45deg);
&:hover {
cursor: pointer;
fill: $grey-00;
}
}
}
#ModalBottom {
display: flex;
flex-direction: row;
a {
color: #666;
font-size: $font-regular;
font-weight: 500;
flex-grow: 1;
display: flex;
align-items: center;
}
.Button {
display: block;
min-height: $unit * 5;
text-align: center;
min-width: $unit * 11;
}
}
}
}
.Modal {
background: #f5f5f5;
border-radius: 8px;
display: flex;
flex-direction: column;
min-width: 360px;
max-width: 480px;
overflow-y: auto;
position: relative;
z-index: 10;
}
.Modal .Button {
display: block;
min-height: 45px;
text-align: center;
}

View file

@ -39,7 +39,7 @@
.SearchModal #NoResults h2 {
color: #ccc;
font-size: 18px;
font-size: $font-large;
font-weight: 500;
margin-top: -32px;
}

View file

@ -23,7 +23,7 @@
#ModalTop h1 {
margin: 0;
font-size: 24px;
font-size: $font-xlarge;
text-align: left;
flex-grow: 1;
}
@ -55,7 +55,7 @@
#ModalBottom a {
color: #666;
font-size: 13px;
font-size: $font-regular;
font-weight: 500;
flex-grow: 1;
display: flex;

View file

@ -6,7 +6,7 @@
& .Label {
color: $grey-50;
font-size: 12px;
font-size: $font-small;
font-weight: $medium;
margin-bottom: $unit;
text-align: center;

View file

@ -19,7 +19,7 @@
.SummonResult h5 {
color: #555;
display: inline-block;
font-size: 18px;
font-size: $font-large;
font-weight: 500;
margin: 2px 4px 4px 0;
}
@ -31,7 +31,7 @@
.SummonResult .stars {
display: inline-block;
color: #FFA15E;
font-size: 21px;
font-size: $font-xlarge;
}
.SummonResult .stars > span {

View file

@ -50,7 +50,7 @@
h3 {
color: #333;
font-size: 14px;
font-size: $font-regular;
font-weight: 500;
margin: 0;
text-align: center;

View file

@ -19,7 +19,7 @@
.WeaponResult h5 {
color: #555;
display: inline-block;
font-size: 18px;
font-size: $font-large;
font-weight: 500;
margin: 2px 4px 4px 0;
}
@ -31,7 +31,7 @@
.WeaponResult .stars {
display: inline-block;
color: #FFA15E;
font-size: 21px;
font-size: $font-xlarge;
}
.WeaponResult .stars > span {

View file

@ -37,7 +37,7 @@
.WeaponUnit h3 {
color: #333;
font-size: 14px;
font-size: $font-regular;
font-weight: 500;
margin: 0;
text-align: center;

View file

@ -15,8 +15,15 @@ $grey-90: #F5F5F5;
$blue: #61B3FF;
$red: #FF6161;
$error: #D13A3A;
// Font weight
$normal: 400;
$medium: 500;
$bold: 600;
$bold: 600;
// Font size
$font-small: 12px;
$font-regular: 14px;
$font-large: 18px;
$font-xlarge: 21px;