remove sass files
This commit is contained in:
Ramón Souza
parent
fc063265fe
commit
246ff151af
@ -1,38 +0,0 @@
|
||||
@mixin presenterIndicator() {
|
||||
&:before {
|
||||
opacity: 1;
|
||||
top: var(--user-indicators-offset);
|
||||
left: var(--user-indicators-offset);
|
||||
bottom: auto;
|
||||
right: auto;
|
||||
border-radius: 5px;
|
||||
background-color: var(--color-primary);
|
||||
|
||||
[dir="rtl"] & {
|
||||
left: auto;
|
||||
right: var(--user-indicators-offset);
|
||||
letter-spacing: -.33rem;
|
||||
}
|
||||
}
|
||||
|
||||
:global(.browser-chrome) &:before,
|
||||
:global(.browser-firefox) &:before,
|
||||
:global(.browser-edge) &:before {
|
||||
padding: var(--indicator-padding);
|
||||
}
|
||||
}
|
||||
|
||||
@mixin indicatorStyles() {
|
||||
&:after {
|
||||
opacity: 1;
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin highContrastOutline() {
|
||||
/* Visible in Windows high-contrast themes */
|
||||
outline: transparent;
|
||||
outline-style: dotted;
|
||||
outline-width: 2px;
|
||||
}
|
||||
@ -1,39 +0,0 @@
|
||||
@mixin scrollbox-vertical($bg-color: white) {
|
||||
overflow-y: auto;
|
||||
background: linear-gradient($bg-color 30%, rgba(255,255,255,0)),
|
||||
linear-gradient(rgba(255,255,255,0), $bg-color 70%) 0 100%,
|
||||
|
||||
/* Shadows */
|
||||
radial-gradient(farthest-side at 50% 0, rgba(0,0,0,.2), rgba(0,0,0,0)),
|
||||
radial-gradient(farthest-side at 50% 100%, rgba(0,0,0,.2), rgba(0,0,0,0)) 0 100%;
|
||||
|
||||
background-repeat: no-repeat;
|
||||
background-color: transparent;
|
||||
background-size: 100% 40px, 100% 40px, 100% 14px, 100% 14px;
|
||||
background-attachment: local, local, scroll, scroll;
|
||||
|
||||
// Fancy scroll
|
||||
&::-webkit-scrollbar {
|
||||
width: 5px;
|
||||
height: 5px;
|
||||
}
|
||||
&::-webkit-scrollbar-button {
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background: rgba(0,0,0,.25);
|
||||
border: none;
|
||||
border-radius: 50px;
|
||||
}
|
||||
&::-webkit-scrollbar-thumb:hover { background: rgba(0,0,0,.5); }
|
||||
&::-webkit-scrollbar-thumb:active { background: rgba(0,0,0,.25); }
|
||||
&::-webkit-scrollbar-track {
|
||||
background: rgba(0,0,0,.25);
|
||||
border: none;
|
||||
border-radius: 50px;
|
||||
}
|
||||
&::-webkit-scrollbar-track:hover { background: rgba(0,0,0,.25); }
|
||||
&::-webkit-scrollbar-track:active { background: rgba(0,0,0,.25); }
|
||||
&::-webkit-scrollbar-corner { background: 0 0; }
|
||||
}
|
||||
@ -1,15 +0,0 @@
|
||||
@mixin elementFocus($color: var(--color-primary)) {
|
||||
&:focus {
|
||||
outline: none;
|
||||
box-shadow: inset 0 0 0 var(--border-size-large) $color;
|
||||
border-radius: var(--border-size);
|
||||
}
|
||||
}
|
||||
|
||||
@mixin inputFocus($shadow, $color: var(--color-primary)) {
|
||||
&:focus {
|
||||
outline: none;
|
||||
border-radius: var(--border-size);
|
||||
box-shadow: 0 0 0 var(--border-size) $shadow, inset 0 0 0 1px $color;
|
||||
}
|
||||
}
|
||||
@ -1,6 +0,0 @@
|
||||
@import "./breakpoints";
|
||||
@import "./general";
|
||||
@import "./palette";
|
||||
@import "./typography";
|
||||
@import "./video";
|
||||
@import "./placeholders";
|
||||
@ -1,80 +0,0 @@
|
||||
// We use these functions to get the ranges for the media queries variables.
|
||||
@function lower-bound($range) {
|
||||
@if length($range) <= 0 {
|
||||
@return 0;
|
||||
}
|
||||
@return nth($range,1);
|
||||
}
|
||||
|
||||
@function upper-bound($range) {
|
||||
@if length($range) < 2 {
|
||||
@return 999999999999;
|
||||
}
|
||||
@return nth($range, 2);
|
||||
}
|
||||
|
||||
$xsmall-range: (0em, 25.937em);
|
||||
/* 0px, 415px */
|
||||
$small-range: (26em, 40em);
|
||||
/* 416px, 640px */
|
||||
$medium-range: (40.063em, 64em);
|
||||
/* 641px, 1024px */
|
||||
$large-range: (64.063em, 90em);
|
||||
/* 1025px, 1440px */
|
||||
$xlarge-range: (90.063em, 120em);
|
||||
/* 1441px, 1920px */
|
||||
$xxlarge-range: (120.063em);
|
||||
/* 1921px */
|
||||
|
||||
$screen: "only screen";
|
||||
$landscape: "#{$screen} and (orientation: landscape)";
|
||||
$portrait: "#{$screen} and (orientation: portrait)";
|
||||
$xsmall-only: "#{$screen} and (min-width:#{lower-bound($xsmall-range)}) and (max-width:#{upper-bound($xsmall-range)})";
|
||||
$small-up: "#{$screen} and (min-width:#{lower-bound($small-range)})";
|
||||
$small-only: "#{$screen} and (max-width: #{upper-bound($small-range)})";
|
||||
$medium-up: "#{$screen} and (min-width:#{lower-bound($medium-range)})";
|
||||
$medium-only: "#{$screen} and (min-width:#{lower-bound($medium-range)}) and (max-width:#{upper-bound($medium-range)})";
|
||||
$large-up: "#{$screen} and (min-width:#{lower-bound($large-range)})";
|
||||
$large-only: "#{$screen} and (min-width:#{lower-bound($large-range)}) and (max-width:#{upper-bound($large-range)})";
|
||||
$xlarge-up: "#{$screen} and (min-width:#{lower-bound($xlarge-range)})";
|
||||
$xlarge-only: "#{$screen} and (min-width:#{lower-bound($xlarge-range)}) and (max-width:#{upper-bound($xlarge-range)})";
|
||||
$xxlarge-up: "#{$screen} and (min-width:#{lower-bound($xxlarge-range)})";
|
||||
$xxlarge-only: "#{$screen} and (min-width:#{lower-bound($xxlarge-range)}) and (max-width:#{upper-bound($xxlarge-range)})";
|
||||
|
||||
$hasPhoneDimentions: "#{$screen} and (max-height: 479px), #{$screen} and (max-width: 479px)";
|
||||
$phone-landscape: "#{$screen} and (max-width: 480px) and (orientation: landscape)";
|
||||
|
||||
//Breakpoints used for permissions-overlay as relative units are not scalling properly on safari
|
||||
$safari1280: "#{$screen} and (max-height: 1280px), #{$screen} and (max-width: 800px)";
|
||||
$safari1440: "#{$screen} and (max-height: 1440px), #{$screen} and (max-width: 900px)";
|
||||
$safari1680: "#{$screen} and (max-height: 1680px), #{$screen} and (max-width: 1050px)";
|
||||
$safari1920: "#{$screen} and (max-height: 1920px), #{$screen} and (max-width: 1080px)";
|
||||
|
||||
$breakpoints: (
|
||||
'screen': $screen,
|
||||
'landscape': $landscape,
|
||||
'portrait': $portrait,
|
||||
'small': $small-only,
|
||||
'xsmall': $xsmall-only,
|
||||
'medium': $medium-only,
|
||||
'large': $large-only,
|
||||
'xlarge': $xlarge-only,
|
||||
'xxlarge': $xxlarge-only,
|
||||
'phoneLandscape': $phone-landscape,
|
||||
);
|
||||
|
||||
@mixin mq($media) {
|
||||
// If the key exists in the map
|
||||
@if map-has-key($breakpoints, $media) {
|
||||
// Prints a media query based on the value
|
||||
@media #{map-get($breakpoints, $media)} {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
// If the key doesn't exist in the map we create a media with the argument
|
||||
@else {
|
||||
@media #{$media} {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,33 +0,0 @@
|
||||
:root {
|
||||
--border-size-small: 1px;
|
||||
--border-size: 2px;
|
||||
--border-size-large: 3px;
|
||||
--border-radius: .2rem;
|
||||
|
||||
--sm-padding-x: .75rem;
|
||||
--sm-padding-y: .3rem;
|
||||
|
||||
--md-padding-x: 1rem;
|
||||
--md-padding-y: .45rem;
|
||||
|
||||
--lg-padding-x: 1.25rem;
|
||||
--lg-padding-y: 0.6rem;
|
||||
|
||||
--jumbo-padding-x: 3.025rem;
|
||||
--jumbo-padding-y: 1.5rem;
|
||||
|
||||
//used to center presenter indicator icon in Chrome / Firefox / Edge
|
||||
--indicator-padding: .45rem;
|
||||
|
||||
//Miscellaneous
|
||||
--user-indicators-offset: -5px;
|
||||
--mobile-swap-offset: 3.5rem;
|
||||
--min-modal-height: 20rem;
|
||||
--modal-margin: 3rem;
|
||||
--title-position-left: 2.2rem;
|
||||
--closeBtn-position-left: 2.5rem;
|
||||
--description-margin: 3.5rem;
|
||||
--toast-icon-side: 40px;
|
||||
--innerToastWidth: 17rem;
|
||||
--iconWrapperSize: 2rem;
|
||||
}
|
||||
@ -1,68 +0,0 @@
|
||||
:root {
|
||||
--palette-placeholder-text: #787675;
|
||||
|
||||
--color-white: #FFF;
|
||||
--color-off-white: #F3F6F9;
|
||||
|
||||
--color-black: #000000;
|
||||
--color-gray: #4E5A66;
|
||||
--color-gray-dark: #06172A;
|
||||
--color-gray-light: #8B9AA8;
|
||||
--color-gray-darkest: #111111;
|
||||
--color-gray-lighter: #a7b3bd;
|
||||
--color-gray-lightest: #d4d9df;
|
||||
|
||||
--color-blue-light: #54a1f3;
|
||||
--color-blue-lighter: #92BCEA;
|
||||
--color-blue-lightest: #E4ECF2;
|
||||
|
||||
--color-primary: #0F70D7;
|
||||
--color-success: #008081;
|
||||
--color-danger: #DF2721;
|
||||
--color-warning: purple;
|
||||
--color-offline: var(--color-gray-light);
|
||||
--color-muted: #586571;
|
||||
|
||||
--color-muted-background: #F3F6F9;
|
||||
|
||||
--color-background: var(--color-gray-dark);
|
||||
|
||||
--color-content-background: #1b2a3a;
|
||||
|
||||
--color-text: var(--color-gray);
|
||||
--color-heading: var(--color-gray-dark);
|
||||
|
||||
--color-link: var(--color-primary);
|
||||
--color-link-hover: #2687ef;
|
||||
|
||||
--color-gray-label: var(--color-gray);
|
||||
|
||||
--color-transparent: #ff000000;
|
||||
--color-tip-bg: #333333;
|
||||
|
||||
--color-white-with-transparency: #ffffff40;
|
||||
|
||||
--loader-bg: var(--color-gray-dark);
|
||||
--loader-bullet: var(--color-white);
|
||||
--user-list-bg: var(--color-off-white);
|
||||
|
||||
--unread-messages-bg: var(--color-danger);
|
||||
--user-list-text: var(--color-gray);
|
||||
|
||||
--user-thumbnail-border: var(--color-gray-light);
|
||||
--user-thumbnail-text: var(--user-thumbnail-border);
|
||||
|
||||
--voice-user-bg: var(--color-success);
|
||||
--voice-user-text: var(--color-white);
|
||||
|
||||
--moderator-text: var(--color-white);
|
||||
--moderator-bg: var(--color-primary);
|
||||
|
||||
--sub-name-color: var(--color-gray-light);
|
||||
|
||||
--user-icons-color: var(--color-gray-light);
|
||||
--user-icons-color-hover: var(--color-gray);
|
||||
|
||||
--list-item-bg-hover: #dce4ed;
|
||||
--item-focus-border: var(--color-blue-lighter);
|
||||
}
|
||||
@ -1,29 +0,0 @@
|
||||
%no-margin {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
%flex-column {
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
}
|
||||
|
||||
%flex-row {
|
||||
display: flex;
|
||||
flex-flow: row;
|
||||
}
|
||||
|
||||
%text-elipsis {
|
||||
min-width: 0;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
%highContrastOutline {
|
||||
/* Visible in Windows high-contrast themes */
|
||||
outline: transparent;
|
||||
outline-style: dotted;
|
||||
outline-width: var(--border-size);
|
||||
}
|
||||
|
||||
@ -1,32 +0,0 @@
|
||||
:root {
|
||||
--font-family-sans-serif: "Source Sans Pro", Helvetica, Arial, sans-serif;
|
||||
--font-family-serif: Georgia, "Times New Roman", Times, serif;
|
||||
--font-family-monospace: Menlo, Monaco, Consolas, "Courier New", monospace;
|
||||
|
||||
--font-family-base: var(--font-family-sans-serif);
|
||||
|
||||
--font-size-base: 1rem;
|
||||
--font-size-xxl: 2.75rem;
|
||||
--font-size-xl: 1.75rem;
|
||||
--font-size-larger: 1.5rem;
|
||||
--font-size-large: 1.25rem;
|
||||
--font-size-md: 0.95rem;
|
||||
--font-size-small: 0.875rem;
|
||||
--font-size-smaller: .75rem;
|
||||
--font-size-xs: .575rem;
|
||||
--font-size-smallest: .35rem;
|
||||
|
||||
--line-height-base: 1.25; // 20/16
|
||||
--line-height-computed: 1rem;
|
||||
|
||||
--headings-font-family: inherit;
|
||||
--headings-font-weight: 500;
|
||||
--headings-line-height: 1.1;
|
||||
--headings-color: inherit;
|
||||
}
|
||||
|
||||
/*
|
||||
* Placeholders
|
||||
* ===============
|
||||
*/
|
||||
|
||||
@ -1,4 +0,0 @@
|
||||
:root {
|
||||
--video-height: calc((100vh - calc(var(--navbar-height) + var(--actionsbar-height))) * 0.2);
|
||||
--video-ratio: calc(4 / 3);
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user