diff --git a/src/graphics/omnibar/components/Ticker/UpcomingRun.vue b/src/graphics/omnibar/components/Ticker/UpcomingRun.vue
index 28b4cdbe..b8c413e0 100644
--- a/src/graphics/omnibar/components/Ticker/UpcomingRun.vue
+++ b/src/graphics/omnibar/components/Ticker/UpcomingRun.vue
@@ -13,7 +13,7 @@
{{ when }}
-
+
{{ formPlayerNamesStr(run) }}
plays {{ run.game }}
diff --git a/src/graphics/omnibar/main.vue b/src/graphics/omnibar/main.vue
index 695b6dcb..c23ca987 100644
--- a/src/graphics/omnibar/main.vue
+++ b/src/graphics/omnibar/main.vue
@@ -17,9 +17,9 @@
'top': `${dashInfo.top}px`,
}">{{ dashInfo.text }}
+
-
@@ -142,6 +142,7 @@ html, body {
}
.dashContainer {
+ width: 350px;
position: absolute;
left: calc(var(--dash-left-width) - 14px);
animation-duration: 500ms;
@@ -152,6 +153,12 @@ html, body {
display: none;
}
+ .before_dash {
+ --color: var(--dark-arrow-default);
+ left: -45px;
+ top: -246px;
+ }
+
#dash {
position: relative;
background: var(--bsg-color);
@@ -209,7 +216,7 @@ html, body {
&.no-dash {
//left: 269px;
- left: 194px;
+ left: 190px;
width: 1285px;
/* HACK: normal text is different */
@@ -274,26 +281,31 @@ html, body {
@mixin calcAnimation($startDelay) {
animation: slideOutLeft;
- animation-duration: calc(500ms - $startDelay);
+ animation-duration: calc(500ms - #{$startDelay});
animation-timing-function: ease-in-out;
+ //animation-timing-function: cubic-bezier(0.950, 0.005, 0.580, 1.000);
- animation-delay: $startDelay !important;
+ animation-delay: #{$startDelay} !important;
}
.omnibar-dash-leave-active {
@include calcAnimation(0ms);
- .dash_seg_2 {
- @include calcAnimation(0ms);
- }
-
- .dash_seg_1 {
- @include calcAnimation(100ms);
- }
-
- #dash {
- @include calcAnimation(200ms);
- }
+ //.dash_seg_2 {
+ // @include calcAnimation(0ms);
+ //}
+ //
+ //.dash_seg_1 {
+ // @include calcAnimation(100ms);
+ //}
+ //
+ //#dash {
+ // @include calcAnimation(200ms);
+ //}
+ //
+ //.before_dash {
+ // @include calcAnimation(400ms);
+ //}
}
.omnibar-dash-enter-active {
@@ -301,8 +313,12 @@ html, body {
animation-duration: 500ms;
animation-timing-function: ease-in-out;
+ .before_dash {
+ animation-delay: 100ms;
+ }
+
#dash {
- animation-delay: 0ms;
+ animation-delay: 150ms;
}
.dash_seg_1 {
@@ -315,8 +331,8 @@ html, body {
}
.omnibar-dash-enter, .omnibar-dash-leave-to {
- left: -20px;
- .dash_seg_1, .dash_seg_2, #dash {
+ left: -100px;
+ .dash_seg_1, .dash_seg_2, #dash, .before_dash {
left: -20px;
}
}