]> git.immae.eu Git - github/Chocobozzz/PeerTube.git/blobdiff - client/src/sass/application.scss
Translated using Weblate (Esperanto)
[github/Chocobozzz/PeerTube.git] / client / src / sass / application.scss
index 58e77adace1d7641e253db2d697146ccb09ff5ea..9cf2a053d7be17c4d47c2c40c5537c45d6e792f2 100644 (file)
@@ -1,23 +1,22 @@
 @use 'sass:math';
+@use 'sass:color';
 
 @use '_variables' as *;
+@use '_bootstrap-variables' as *;
 @use '_mixins' as *;
 @use '_icons' as *;
 
 @use '_fonts';
 
-@use './class-helpers';
 @use './custom-markup';
 @use './ng-select';
 
-@import './bootstrap';
-@import './primeng-custom';
+@use './bootstrap';
+@use './primeng-custom';
 
-@import './z-index';
+@use './z-index';
 
-[hidden] {
-  display: none !important;
-}
+@use './class-helpers/index.scss';
 
 body {
   /*** theme ***/
@@ -26,6 +25,7 @@ body {
   --mainColor: #{$main-color};
   --mainColorLighter: #{$main-color-lighter};
   --mainColorLightest: #{$main-color-lightest};
+  --mainColorVeryLight: #{$main-color-very-light};
 
   --mainHoverColor: #{$main-hover-color};
   --mainBackgroundHoverColor: #{$main-background-hover-color};
@@ -46,6 +46,7 @@ body {
   --inputForegroundColor: #{$input-foreground-color};
   --inputBackgroundColor: #{$input-background-color};
   --inputPlaceholderColor: #{$input-placeholder-color};
+  --inputBorderColor: #{$input-border-color};
 
   --textareaForegroundColor: #{$textarea-foreground-color};
   --textareaBackgroundColor: #{$textarea-background-color};
@@ -67,7 +68,7 @@ body {
   font-weight: $font-regular;
   color: pvar(--mainForegroundColor);
   background-color: pvar(--mainBackgroundColor);
-  font-size: 14px;
+  font-size: 1rem;
   // On desktop browsers, make sure vertical scroll bar is always visible
   // Allow to disable the scrollbar instead of hide it when the content fit the body
   // And not move the content and header horizontally sticked to right when the content is updating
@@ -113,11 +114,11 @@ button {
   @include disable-outline;
 
   background: unset;
+  color: pvar(--mainForegroundColor);
 }
 
 label {
   font-weight: $font-bold;
-  font-size: 15px;
   margin-bottom: 0.5rem;
 }
 
@@ -202,20 +203,14 @@ table {
   }
 }
 
-.dropdown-item {
-  @include dropdown-with-icon-item;
-
-  my-global-icon {
-    width: 22px;
-    height: 22px;
-  }
-}
-
 my-global-icon[iconName=external-link] {
-  margin: 0 3px;
-  width: 13px;
-  vertical-align: text-bottom;
+  margin: 0 0.3em;
+  width: 0.9em;
+  height: 0.9em;
+  display: inline-block;
   color: pvar(--inputPlaceholderColor);
+  position: relative;
+  top: -0.1em;
 }
 
 @media screen and (max-width: #{breakpoint(xxl)}) {
@@ -229,7 +224,7 @@ my-global-icon[iconName=external-link] {
   }
 }
 
-@media screen and (max-width: #{breakpoint(lg)}) {
+@media screen and (max-width: #{breakpoint(xl)}) {
   .main-col {
     --videosHorizontalMarginContent: #{pvar(--horizontalMarginContent)};
   }