diff --git a/src/graphics/break/styles/infoBar.scss b/src/graphics/break/styles/infoBar.scss
index a29c693..098f781 100644
--- a/src/graphics/break/styles/infoBar.scss
+++ b/src/graphics/break/styles/infoBar.scss
@@ -15,9 +15,14 @@
opacity: 0;
filter: $global-drop-shadow;
+ .info-bar-separator {
+ width: 6px;
+ height: 80%;
+ background-color: $sac-accent;
+ }
+
.info-bar-logo {
height: 100%;
- background-color: $sac-accent;
padding: 0 15px;
img {
@@ -39,7 +44,7 @@
height: 100%;
margin: 0 15px;
position: relative;
- font-size: 44px;
+ font-size: 42px;
font-weight: 300;
line-height: 53px;
@@ -50,12 +55,6 @@
text-align: center;
}
}
-
- > .info-bar-separator {
- width: 6px;
- height: 80%;
- background-color: $sac-accent;
- }
}
}
}
@@ -86,7 +85,7 @@
justify-self: flex-end;
text-align: center;
width: 100%;
- font-size: 56px;
+ font-size: 46px;
}
fitted-text {
diff --git a/src/graphics/break/styles/mainScene.scss b/src/graphics/break/styles/mainScene.scss
index 318a970..e5eeed4 100644
--- a/src/graphics/break/styles/mainScene.scss
+++ b/src/graphics/break/styles/mainScene.scss
@@ -39,7 +39,7 @@
.text-wrapper {
position: absolute;
left: 275px;
- bottom: 155px;
+ bottom: 145px;
filter: $global-drop-shadow;
.logo {
@@ -82,6 +82,6 @@
position: absolute;
top: 40px;
right: 70px;
- width: 320px;
+ width: 300px;
}
}
diff --git a/src/graphics/break/styles/stages.scss b/src/graphics/break/styles/stages.scss
index 6069029..d715b5f 100644
--- a/src/graphics/break/styles/stages.scss
+++ b/src/graphics/break/styles/stages.scss
@@ -59,7 +59,7 @@
padding: 0 10px;
position: absolute;
text-align: right;
- font-size: 36px;
+ font-size: 30px;
line-height: 42px;
transform: translate(5px, -5px);
filter: drop-shadow(0 0 5px rgba(0, 0, 0, 0.5));
@@ -74,21 +74,25 @@
box-shadow: 10px 0 0 $sac-accent, -10px 0 0 $sac-accent;
background-color: $sac-accent;
overflow-wrap: break-word;
+ color: $sac-background-1;
}
}
> .stage-mode {
background-color: $sac-background-2;
font-weight: 300;
- font-size: 32px;
+ font-size: 28px;
height: 45px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
}
> .stage-name {
flex-grow: 1;
background-color: $sac-background-3;
font-weight: 600;
- font-size: 40px;
+ font-size: 36px;
line-height: 45px;
padding: 0 10px;
diff --git a/src/graphics/break/styles/teams.scss b/src/graphics/break/styles/teams.scss
index b261064..03bb88a 100644
--- a/src/graphics/break/styles/teams.scss
+++ b/src/graphics/break/styles/teams.scss
@@ -22,7 +22,7 @@
> .team-name {
font-weight: 600;
font-size: 64px;
- margin: 15px 0 10px;
+ margin: 20px 0 5px;
height: 95px;
}
@@ -41,9 +41,9 @@
> fitted-text {
font-weight: 300;
- font-size: 52px;
- line-height: 68px;
- height: 68px;
+ font-size: 40px;
+ line-height: 55px;
+ height: 55px;
}
}
diff --git a/src/graphics/main/styles/casters.scss b/src/graphics/main/styles/casters.scss
index b8674b1..2cc45b3 100644
--- a/src/graphics/main/styles/casters.scss
+++ b/src/graphics/main/styles/casters.scss
@@ -15,7 +15,7 @@
background-color: $sac-background-3;
text-align: center;
font-weight: 300;
- font-size: 30px;
+ font-size: 28px;
line-height: 36px;
border-top: 8px solid $sac-accent;
}
@@ -28,13 +28,13 @@
margin-bottom: 10px;
> .name {
- font-size: 38px;
+ font-size: 34px;
font-weight: 500;
line-height: 38px;
}
> .extra {
- font-size: 32px;
+ font-size: 30px;
font-weight: 300;
line-height: 34px;
}
diff --git a/src/graphics/main/styles/scoreboard.scss b/src/graphics/main/styles/scoreboard.scss
index dc09c7e..def5dd8 100644
--- a/src/graphics/main/styles/scoreboard.scss
+++ b/src/graphics/main/styles/scoreboard.scss
@@ -17,13 +17,13 @@
.logo {
height: 38px;
background-color: $sac-accent;
- padding: 0 6px;
+ padding: 0 8px;
margin: 0;
> img {
- height: 40px;
+ height: 36px;
margin: 0;
- transform: translate(0, -5px);
+ transform: translate(0, -2px);
}
}
@@ -66,13 +66,13 @@
> fitted-text {
justify-self: start;
- font-size: 35px;
+ font-size: 32px;
line-height: 30px;
}
> .team-score {
font-weight: 700;
- font-size: 45px;
+ font-size: 36px;
line-height: 45px;
text-align: center;
}
@@ -81,7 +81,7 @@
> .flavor-text-wrapper {
height: 36px;
background-color: $sac-background-3;
- font-size: 30px;
+ font-size: 24px;
font-weight: 300;
> fitted-text {
diff --git a/src/graphics/styles/constants.scss b/src/graphics/styles/constants.scss
index c6ee5bb..d47632b 100755
--- a/src/graphics/styles/constants.scss
+++ b/src/graphics/styles/constants.scss
@@ -1,12 +1,14 @@
$pageWidth: 1920px;
$pageHeight: 1080px;
-$sac-background-1: #011310;
-$sac-background-2: #022720;
-$sac-background-3: #033329;
+$sac-background-1: #1B1E29;
+$sac-background-2: #1D202C;
+$sac-background-3: #232735;
-$sac-accent: #D61CDA;
+$sac-accent: #7BFDA6;
+$nw-gradient: linear-gradient(0deg, #FBDF69 -20%, $sac-accent 100%);
$text-color: #E8f7FF;
+$text-color-dark: $sac-background-1;
$global-drop-shadow: drop-shadow(0 0 5px rgba(40, 40, 40, 0.55)) drop-shadow(0 0 15px rgba(40, 40, 40, 0.3));
diff --git a/src/graphics/styles/fonts.scss b/src/graphics/styles/fonts.scss
index a8d367f..f7ed141 100755
--- a/src/graphics/styles/fonts.scss
+++ b/src/graphics/styles/fonts.scss
@@ -1,10 +1,11 @@
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Kanit:wght@200;400;500;600;700&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Sora:wght@100..800&display=swap');
@import './constants.scss';
body {
- font-family: 'Kanit', 'Noto Sans JP', sans-serif;
+ font-family: 'Sora', 'Noto Sans JP', sans-serif;
font-weight: 400;
font-size: 32px;
}
@@ -16,9 +17,10 @@ body {
span.pronoun {
font-weight: 500;
background-color: $sac-accent;
- font-size: 28px;
- line-height: 28px;
+ color: $sac-background-1;
+ font-size: 22px;
+ line-height: 22px;
padding: 2px 4px;
- transform: translate(0px, -2px);
+ transform: translate(0px, -5px);
display: inline-block;
}
