diff --git a/client/src/app/videos/+video-watch/modal/video-share.component.html b/client/src/app/videos/+video-watch/modal/video-share.component.html
index a20c320a4..301f67f2d 100644
--- a/client/src/app/videos/+video-watch/modal/video-share.component.html
+++ b/client/src/app/videos/+video-watch/modal/video-share.component.html
@@ -5,6 +5,14 @@
+
+
+
+
+
-
-
-
-
diff --git a/client/src/sass/application.scss b/client/src/sass/application.scss
index fd0d5e458..b96cf07c0 100644
--- a/client/src/sass/application.scss
+++ b/client/src/sass/application.scss
@@ -1,9 +1,9 @@
-@import '_variables';
-@import '_mixins';
-
$icon-font-path: '../../node_modules/@neos21/bootstrap3-glyphicons/assets/fonts/';
@import '_bootstrap';
+@import '_variables';
+@import '_mixins';
+
@import '_fonts';
@import '~video.js/dist/video-js.css';
@@ -19,6 +19,17 @@ $assets-path: '../assets/';
}
body {
+ /*** theme ***/
+ // now beware node-sass requires interpolation
+ // for css custom properties #{$var}
+ --mainColor: #{$orange-color};
+ --mainHoverColor: #{$orange-hoover-color};
+ --mainBackgroundColor: #{$bg-color};
+ --mainForegroundColor: #{$fg-color};
+ --submenuColor: #{$sub-menu-color};
+ --inputColor: #{$input-color};
+ --inputPlaceholderColor: #{$input-placeholder-color};
+
font-family: $main-fonts;
font-weight: $font-regular;
color: var(--mainForegroundColor);
diff --git a/client/src/sass/include/_mixins.scss b/client/src/sass/include/_mixins.scss
index 6e2feb748..03cb337c2 100644
--- a/client/src/sass/include/_mixins.scss
+++ b/client/src/sass/include/_mixins.scss
@@ -297,8 +297,8 @@
height: 12px;
opacity: 0;
transform: rotate(45deg) scale(0);
- border-right: 2px solid var(--mainForegroundColor);
- border-bottom: 2px solid var(--mainForegroundColor);
+ border-right: 2px solid var(--mainBackgroundColor);
+ border-bottom: 2px solid var(--mainBackgroundColor);
}
}
diff --git a/client/src/sass/include/_variables.scss b/client/src/sass/include/_variables.scss
index fb253fc1f..0735a00a0 100644
--- a/client/src/sass/include/_variables.scss
+++ b/client/src/sass/include/_variables.scss
@@ -46,23 +46,9 @@ $video-thumbnail-width: 200px;
$theater-bottom-space: 85px;
-$input-color: $bg-color;
+$input-color: inherit;
$input-placeholder-color: #898989;
-/*** theme ***/
-
-body {
- // now beware node-sass requires interpolation
- // for css custom properties #{$var}
- --mainColor: #{$orange-color};
- --mainHoverColor: #{$orange-hoover-color};
- --mainBackgroundColor: #{$bg-color};
- --mainForegroundColor: #{$fg-color};
- --submenuColor: #{$sub-menu-color};
- --inputColor: #{$input-color};
- --inputPlaceholderColor: #{$input-placeholder-color};
-}
-
/*** map theme ***/
// pass variables into a sass map,