From 2585d732dffb7df87babd32a4922835d8d142c8a Mon Sep 17 00:00:00 2001
From: Fibinger Ádám <adam.fibinger@wup.hu>
Date: Fri, 19 Jun 2020 19:18:45 +0200
Subject: [PATCH] Ace + Melusi
---
assets/overlay.scss | 161 +++++++++++++++++++++++++++++++++++++++++++++++------
1 files changed, 142 insertions(+), 19 deletions(-)
diff --git a/assets/overlay.scss b/assets/overlay.scss
index 5052ef4..8dc90e6 100644
--- a/assets/overlay.scss
+++ b/assets/overlay.scss
@@ -8,11 +8,12 @@
width: 1920px;
height: 1080px;
font-family: 'Oswald', sans-serif;
+ /*background-image: url("/assets/test.png");*/
}
#stripe {
position: fixed;
- top: 2px;
+ top: 0;
left: 0;
width: 100%;
height: 58px;
@@ -32,13 +33,13 @@
.team {
position: fixed;
- margin-top: 2px;
- width: 435px;
+ margin-top: 4px;
+ width: 500px;
overflow: hidden;
.name {
color: white;
- font-size: 34px;
+ font-size: 28px;
}
&.blue {
@@ -47,28 +48,27 @@
}
&.orange {
- left: 1215px;
+ left: 1150px;
text-align: left;
}
}
.ban {
position: inherit;
- top: -1px;
+ top: 2px;
&.orange {
- left: 1080px;
+ left: 1000px;
}
&.blue {
- left: 715px;
+ left: 812px;
}
}
.info {
position: inherit;
- top: 4px;
- width: 220px;
+ width: 300px;
height: 50px;
}
@@ -78,24 +78,91 @@
}
.info.right {
- left: 1700px;
+ left: 1620px;
text-align: right;
}
+$base-left: 750px;
+$base-right: 1105px;
+ .mapwin {
+ position: fixed;
+ border-radius: 10px;
+
+ top: 6px;
+ left: 861px;
+ width: 10px;
+ height: 10px;
+
+ &.one {
+ top: 2px;
+ }
+
+ &.two {
+ top: 2px;
+ }
+
+ &.three {
+ top: 15px;
+ }
+
+ &.left {
+ border: 1px solid rgba(20, 134, 229, 0.5);
+
+ &.checked {
+ background-color: #1486e5;
+ }
+
+ &.one {
+ left: $base-left + 37px;
+ }
+
+ &.two {
+ left: $base-left + 52px;
+ }
+
+ &.three {
+ left: $base-left + 45px ;
+ }
+ }
+
+ &.right {
+ border: 1px solid rgba(234, 112, 25, 0.5);
+ &.checked {
+ background-color: #EA7019;
+ }
+
+ &.one {
+ left: $base-right + 13px;
+ }
+
+ &.two {
+ left: $base-right - 2px;
+ }
+
+ &.three {
+ left: $base-right + 5px;
+ }
+ }
+ }
+
+
.operator {
+ z-index: 10;
background-repeat: no-repeat;
background-size: cover;
- width: 60px;
- height: 60px;
+ width: 50px;
+ height: 50px;
+ margin-top: -2px;
- filter: grayscale(65%);
+ filter: grayscale(50%);
text-align: center;
.prohibit {
+ z-index: 20;
text-align: center;
color: gray;
- margin-top: 31px;
- font-size: 20px;
+ margin-top: 15px;
+ font-size: 24px;
text-shadow: 1px 1px 1px gray,
1px 0 1px gray,
0 -1px 1px gray,
@@ -105,9 +172,34 @@
}
}
+ .operator :after {
+ z-index: -1px;
+ position: relative;
+ top: -42px;
+ left: 0;
+ content: '';
+ width: 33px;
+ height: 33px;
+ display: block;
+ }
+
+ .blue .operator :after {
+ box-shadow: 0 0 10px 0 #1486e5;
+ }
+
+ .orange .operator :after {
+ box-shadow: 0 0 10px 0 #EA7019;
+ }
+
.esl-logo {
height: 40px;
margin-top: 5px;
+ margin-right: 8px;
+ }
+
+ .wargasz-logo {
+ // height: 40px;
+ //margin-top: 5px;
margin-right: 8px;
}
@@ -122,18 +214,40 @@
display: table-cell;
vertical-align: middle;
height: 50px;
- font-size: 20px;
+ font-size: 15px;
text-shadow: 1px 1px 1px black,
1px 0 1px black,
0 -1px 1px black,
-1px -1px 1px black;
+ width: 350px;
}
.text em {
+ display: block;
+ position: absolute;
+ top: 11px;
font-style: normal;
- font-weight: bold;
- font-size: 22px;
+ font-weight: normal;
+ font-size: 20px;
}
+
+ .text.rotate {
+ em {
+ animation-name: fade;
+ animation-fill-mode: both;
+ animation-iteration-count: infinite;
+ animation-duration: 15s;
+
+ &:nth-child(1) {
+ animation-direction: alternate-reverse;
+ }
+
+ &:nth-child(2) {
+ animation-direction: alternate;
+ }
+ }
+ }
+
}
#main {
@@ -174,5 +288,14 @@
top: 2em;
}
}
+}
+
+@keyframes fade {
+ 0%, 49% {
+ opacity: 0;
+ }
+ 51%, 100% {
+ opacity: 1;
+ }
}
--
Gitblit v1.8.0