From ae05924ee19a3c532bfff5a0a7631ad92545c569 Mon Sep 17 00:00:00 2001
From: Fibinger Ádám <adam.fibinger@wup.hu>
Date: Wed, 03 Jun 2020 21:57:11 +0200
Subject: [PATCH] Overlay átrendezések és előkészülés websocket szerverre
---
assets/overlay.scss | 62 ++++++++++++++++++++++++------
1 files changed, 49 insertions(+), 13 deletions(-)
diff --git a/assets/overlay.scss b/assets/overlay.scss
index 5ed4a5d..e5a16b4 100644
--- a/assets/overlay.scss
+++ b/assets/overlay.scss
@@ -13,7 +13,7 @@
#stripe {
position: fixed;
- top: -3px;
+ top: 0;
left: 0;
width: 100%;
height: 58px;
@@ -33,22 +33,22 @@
.team {
position: fixed;
- margin-top: 2px;
- width: 435px;
+ margin-top: 4px;
+ width: 500px;
overflow: hidden;
.name {
color: white;
- font-size: 33px;
+ font-size: 28px;
}
&.blue {
- left: 325px;
+ left: 270px;
text-align: right;
}
&.orange {
- left: 1160px;
+ left: 1150px;
text-align: left;
}
}
@@ -68,7 +68,6 @@
.info {
position: inherit;
- top: -3px;
width: 300px;
height: 50px;
}
@@ -90,11 +89,14 @@
left: 861px;
width: 32px;
height: 14px;
+
&.left {
left: 861px;
+
&.one {
top: 6px;
}
+
&.two {
top: 23px;
}
@@ -102,14 +104,16 @@
&.right {
left: 1028px;
+
&.one {
top: 6px;
}
+
&.two {
top: 23px;
}
}
- }
+ }
.operator {
@@ -137,6 +141,7 @@
color: red;
}
}
+
.operator :after {
z-index: -1px;
position: relative;
@@ -147,9 +152,11 @@
height: 33px;
display: block;
}
+
.blue .operator :after {
box-shadow: 0 0 10px 0 #1486e5;
}
+
.orange .operator :after {
box-shadow: 0 0 10px 0 #EA7019;
}
@@ -159,9 +166,10 @@
margin-top: 5px;
margin-right: 8px;
}
+
.wargasz-logo {
- height: 40px;
- margin-top: 5px;
+ // height: 40px;
+ //margin-top: 5px;
margin-right: 8px;
}
@@ -176,7 +184,7 @@
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,
@@ -185,10 +193,29 @@
}
.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 {
@@ -229,5 +256,14 @@
top: 2em;
}
}
+}
+
+@keyframes fade {
+ 0%, 49% {
+ opacity: 0;
+ }
+ 51%, 100% {
+ opacity: 1;
+ }
}
--
Gitblit v1.8.0