+++ /dev/null
-@use '_variables' as *;
-@use '_mixins' as *;
-@use '_badges' as *;
-@use '_icons' as *;
-@use '_fonts' as *;
-
-.link-orange {
- color: pvar(--mainForegroundColor);
- font-weight: $font-semibold;
- border-bottom: 0.18em solid pvar(--mainColor);
- display: inline-block;
- line-height: 1.1;
-
- &:hover {
- color: pvar(--mainForegroundColor);
- opacity: 0.8;
- }
-}
-
-.underline-orange {
- display: inline-block;
- border-bottom: 0.19em solid pvar(--mainColor);
-}
-
-// ---------------------------------------------------------------------------
-
-.peertube-button {
- @include peertube-button;
-}
-
-.peertube-button-big {
- @include peertube-button-big;
-}
-
-.peertube-button-link {
- @include peertube-button-link;
-}
-
-.peertube-button-big-link {
- @include peertube-button-big-link;
-}
-
-.orange-button {
- @include orange-button;
-}
-
-.orange-button-inverted {
- @include orange-button-inverted;
-}
-
-.grey-button {
- @include grey-button;
-}
-
-.tertiary-button {
- @include tertiary-button;
-}
-
-.peertube-radio-container {
- @include peertube-radio-container;
-}
-
-// ---------------------------------------------------------------------------
-
-.muted {
- @include muted;
-}
-
-// ---------------------------------------------------------------------------
-
-.pt-badge {
- @include peertube-badge;
-}
-
-// ---------------------------------------------------------------------------
-
-.form-group {
- margin-bottom: 1rem;
-}
-
-.input-error:not(:focus) {
- &,
- + .nav-preview, // Markdown textarea
- + * + .tab-content {
- border-color: $red !important;
- }
-}
-
-.input-group .input-error {
- z-index: 3;
-}
-
-.form-error,
-.form-warning {
- display: block;
- margin-top: 5px;
- font-size: 0.9em;
-}
-
-.form-error {
- color: $red;
-}
-
-// Disable red error on input focus
-.input-error:focus,
-.input-group:focus-within {
- + .form-error,
- + * + .form-error, // Markdown textarea
- + * + * + .form-error {
- color: pvar(--mainForegroundColor);
- }
-}
-
-.form-group-description {
- @include muted;
-
- font-size: 14px;
- margin-top: 10px;
-}
-
-label + .form-group-description {
- margin-bottom: 10px;
- margin-top: 0;
-}
-
-// ---------------------------------------------------------------------------
-
-
-.sub-menu-entry {
- @include disable-default-a-behaviour;
- @include margin-right(55px);
-
- opacity: 0.7;
- color: pvar(--mainForegroundColor);
- display: inline-block;
- font-weight: $font-semibold;
- border-bottom: 2px solid transparent;
- white-space: nowrap;
- font-size: 1rem;
-
- &.active {
- border-bottom-color: pvar(--mainColor);
- }
-
- &:hover,
- &:active,
- &:focus {
- color: pvar(--mainForegroundColor);
- }
-
- &.active,
- &:hover,
- &:active,
- &:focus {
- opacity: 1;
- outline: 0 hidden !important;
- }
-
- @media screen and (max-width: $mobile-view) {
- @include margin-left(15px);
- }
-}
-
-.title-page-v2 {
- font-weight: normal;
- font-size: 15px;
- padding: 35px 25px;
-}
-
-.title-page {
- @include margin-right(55px);
-
- margin-top: 30px;
- margin-bottom: 25px;
-
- color: pvar(--mainForegroundColor);
- display: inline-block;
- font-weight: $font-semibold;
- font-size: 1.25rem;
-
- a {
- @include disable-default-a-behaviour;
-
- color: inherit;
-
- &:hover {
- color: inherit;
- opacity: 0.8;
- }
- }
-
- @media screen and (max-width: $mobile-view) {
- @include margin-left(15px);
- }
-}
-
-.admin-sub-header {
- display: flex;
- align-items: center;
- margin-bottom: 30px;
-
- @media screen and (max-width: $small-view) {
- flex-direction: column;
- }
-}
-
-// ---------------------------------------------------------------------------
-
-.no-results {
- height: 40vh;
- max-height: 500px;
-
- display: flex;
- flex-direction: column;
- align-items: center;
- justify-content: center;
- font-weight: $font-semibold;
-}
-
-// ---------------------------------------------------------------------------
-
-.chevron-down {
- @include chevron-down-default;
-}
-
-.chevron-up {
- @include chevron-up-default;
-}
-
-.chevron-right {
- @include chevron-right-default;
-}
-
-.chevron-left {
- @include chevron-left-default;
-}
-
-// ---------------------------------------------------------------------------
-
-.callout {
- padding: 1.25rem;
- border: 1px solid #eee;
- border-radius: .25rem;
- position: relative;
-
- > label {
- position: relative;
- top: -5px;
- left: -10px;
- color: #6c757d !important;
- }
-
- &:not(.callout-light) {
- border-left-width: .25rem;
- }
-
- &.callout-orange {
- border-color: pvar(--mainColorLightest);
-
- &:not(.callout-light) {
- border-left-color: pvar(--mainColor);
- }
- }
-}
-
-// ---------------------------------------------------------------------------
-
-.anchor {
- position: relative;
- top: #{-($header-height + 20px)};
-}
-
-.offset-content { // if sub-menu fixed
- .anchor {
- top: #{-($header-height + $sub-menu-height + 20px)};
- }
-}
-
-// ---------------------------------------------------------------------------
-
-.alert {
- &.pt-alert-primary {
- background-color: pvar(--mainColorVeryLight);
- border: 2px solid pvar(--mainColorLightest);
- }
-}
-
-// ---------------------------------------------------------------------------
-
-.chip {
- @include chip;
-}
--- /dev/null
+@use '_mixins' as *;
+
+.peertube-button {
+ @include peertube-button;
+}
+
+.peertube-button-big {
+ @include peertube-button-big;
+}
+
+.peertube-button-link {
+ @include peertube-button-link;
+}
+
+.peertube-button-big-link {
+ @include peertube-button-big-link;
+}
+
+.orange-button {
+ @include orange-button;
+}
+
+.orange-button-inverted {
+ @include orange-button-inverted;
+}
+
+.grey-button {
+ @include grey-button;
+}
+
+.tertiary-button {
+ @include tertiary-button;
+}
+
+.peertube-radio-container {
+ @include peertube-radio-container;
+}
\ No newline at end of file
--- /dev/null
+@use '_variables' as *;
+@use '_mixins' as *;
+@use '_badges' as *;
+@use '_icons' as *;
+
+.link-orange {
+ color: pvar(--mainForegroundColor);
+ font-weight: $font-semibold;
+ border-bottom: 0.18em solid pvar(--mainColor);
+ display: inline-block;
+ line-height: 1.1;
+
+ &:hover {
+ color: pvar(--mainForegroundColor);
+ opacity: 0.8;
+ }
+}
+
+.underline-orange {
+ display: inline-block;
+ border-bottom: 0.19em solid pvar(--mainColor);
+}
+
+// ---------------------------------------------------------------------------
+
+.muted {
+ @include muted;
+}
+
+// ---------------------------------------------------------------------------
+
+.pt-badge {
+ @include peertube-badge;
+}
+
+// ---------------------------------------------------------------------------
+
+.no-results {
+ height: 40vh;
+ max-height: 500px;
+
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ font-weight: $font-semibold;
+}
+
+// ---------------------------------------------------------------------------
+
+.chevron-down {
+ @include chevron-down-default;
+}
+
+.chevron-up {
+ @include chevron-up-default;
+}
+
+.chevron-right {
+ @include chevron-right-default;
+}
+
+.chevron-left {
+ @include chevron-left-default;
+}
+
+// ---------------------------------------------------------------------------
+
+.callout {
+ padding: 1.25rem;
+ border: 1px solid #eee;
+ border-radius: 0.25rem;
+ position: relative;
+
+ >label {
+ position: relative;
+ top: -5px;
+ left: -10px;
+ color: #6c757d !important;
+ }
+
+ &:not(.callout-light) {
+ border-left-width: 0.25rem;
+ }
+
+ &.callout-orange {
+ border-color: pvar(--mainColorLightest);
+
+ &:not(.callout-light) {
+ border-left-color: pvar(--mainColor);
+ }
+ }
+}
+
+// ---------------------------------------------------------------------------
+
+.anchor {
+ position: relative;
+ top: #{- ($header-height + 20px)};
+}
+
+.offset-content {
+
+ // if sub-menu fixed
+ .anchor {
+ top: #{- ($header-height + $sub-menu-height + 20px)};
+ }
+}
+
+// ---------------------------------------------------------------------------
+
+.alert {
+ &.pt-alert-primary {
+ background-color: pvar(--mainColorVeryLight);
+ border: 2px solid pvar(--mainColorLightest);
+ }
+}
+
+// ---------------------------------------------------------------------------
+
+.chip {
+ @include chip;
+}
\ No newline at end of file
--- /dev/null
+@use '_variables' as *;
+@use '_mixins' as *;
+
+// Font sizes
+
+.pt-fs-1 {
+ @include font-size(2.5rem);
+}
+
+.pt-fs-2 {
+ @include font-size(2rem);
+}
+
+.pt-fs-3 {
+ @include font-size(1.75rem);
+}
+
+.pt-fs-4 {
+ @include font-size(1.5rem);
+}
+
+.pt-fs-5 {
+ @include font-size(1.25rem);
+}
+
+.pt-fs-5-5 {
+ @include font-size(1.125rem);
+}
+
+.pt-fs-6 {
+ @include font-size(1rem);
+}
+
+.pt-fs-7 {
+ @include font-size(0.875rem);
+}
\ No newline at end of file
--- /dev/null
+@use '_variables' as *;
+@use '_mixins' as *;
+
+.form-group {
+ margin-bottom: 1rem;
+}
+
+.input-error:not(:focus) {
+
+ &,
+ +.nav-preview,
+ // Markdown textarea
+ +*+.tab-content {
+ border-color: $red !important;
+ }
+}
+
+.input-group .input-error {
+ z-index: 3;
+}
+
+.form-error,
+.form-warning {
+ display: block;
+ margin-top: 5px;
+ font-size: 0.9em;
+}
+
+.form-error {
+ color: $red;
+}
+
+// Disable red error on input focus
+.input-error:focus,
+.input-group:focus-within {
+
+ +.form-error,
+ +*+.form-error,
+ // Markdown textarea
+ +*+*+.form-error {
+ color: pvar(--mainForegroundColor);
+ }
+}
+
+.form-group-description {
+ @include muted;
+
+ font-size: 14px;
+ margin-top: 10px;
+}
+
+label+.form-group-description {
+ margin-bottom: 10px;
+ margin-top: 0;
+}
\ No newline at end of file
--- /dev/null
+@use '_variables' as *;
+@use '_mixins' as *;
+
+.sub-menu-entry {
+ @include disable-default-a-behaviour;
+ @include margin-right(55px);
+
+ opacity: 0.7;
+ color: pvar(--mainForegroundColor);
+ display: inline-block;
+ font-weight: $font-semibold;
+ border-bottom: 2px solid transparent;
+ white-space: nowrap;
+ font-size: 1rem;
+
+ &.active {
+ border-bottom-color: pvar(--mainColor);
+ }
+
+ &:hover,
+ &:active,
+ &:focus {
+ color: pvar(--mainForegroundColor);
+ }
+
+ &.active,
+ &:hover,
+ &:active,
+ &:focus {
+ opacity: 1;
+ outline: 0 hidden !important;
+ }
+
+ @media screen and (max-width: $mobile-view) {
+ @include margin-left(15px);
+ }
+}
+
+.title-page-v2 {
+ font-weight: normal;
+ font-size: 15px;
+ padding: 35px 25px;
+}
+
+.title-page {
+ @include margin-right(55px);
+
+ margin-top: 30px;
+ margin-bottom: 25px;
+
+ color: pvar(--mainForegroundColor);
+ display: inline-block;
+ font-weight: $font-semibold;
+ font-size: 1.25rem;
+
+ a {
+ @include disable-default-a-behaviour;
+
+ color: inherit;
+
+ &:hover {
+ color: inherit;
+ opacity: 0.8;
+ }
+ }
+
+ @media screen and (max-width: $mobile-view) {
+ @include margin-left(15px);
+ }
+}
+
+.admin-sub-header {
+ display: flex;
+ align-items: center;
+ margin-bottom: 30px;
+
+ @media screen and (max-width: $small-view) {
+ flex-direction: column;
+ }
+}
\ No newline at end of file
--- /dev/null
+@use '_variables' as *;
+@use '_mixins' as *;
+@use '_badges' as *;
+@use '_icons' as *;
+@use '_fonts' as *;
+@use '_menu' as *;
+@use '_buttons' as *;
+@use '_forms' as *;
+@use '_common' as *;
+@use '_custom-bootstrap-helpers' as *;
\ No newline at end of file
--- /dev/null
+@import 'bootstrap/scss/functions';
+@import 'bootstrap/scss/variables';
+@import 'bootstrap/scss/maps';
+@import 'bootstrap/scss/mixins';
+@import 'bootstrap/scss/utilities';
\ No newline at end of file
@use 'sass:math';
@use '_variables' as *;
+@import '_bootstrap-mixins';
+
+
@mixin disable-default-a-behaviour {
&:hover,
&:focus,
@mixin margin ($block-start, $inline-end, $block-end, $inline-start) {
@include margin-left($inline-start);
@include margin-right($inline-end);
-
- margin-top: $block-start;
- margin-bottom: $block-end;
+ @include margin-top($block-start);
+ @include margin-bottom($block-end);
}
@mixin padding ($block-start, $inline-end, $block-end, $inline-start) {
@include padding-left($inline-start);
@include padding-right($inline-end);
-
- padding-top: $block-start;
- padding-bottom: $block-end;
+ @include padding-top($block-start);
+ @include padding-bottom($block-end);
}
@mixin margin-left ($value) {
@supports (margin-inline-start: $value) {
- margin-inline-start: $value;
+ @include rfs($value, margin-inline-start);
}
@supports not (margin-inline-start: $value) {
- margin-left: $value;
+ @include rfs($value, margin-left);
}
}
@mixin margin-right ($value) {
@supports (margin-inline-end: $value) {
- margin-inline-end: $value;
+ @include rfs($value, margin-inline-end);
}
@supports not (margin-inline-end: $value) {
- margin-right: $value;
+ @include rfs($value, margin-right);
}
}
@mixin padding-left ($value) {
@supports (padding-inline-start: $value) {
- padding-inline-start: $value;
+ @include rfs($value, padding-inline-start);
}
@supports not (padding-inline-start: $value) {
- padding-left: $value;
+ @include rfs($value, padding-left);
}
}
@mixin padding-right ($value) {
@supports (padding-inline-end: $value) {
- padding-inline-end: $value;
+ @include rfs($value, padding-inline-end);
}
@supports not (padding-inline-end: $value) {
- padding-right: $value;
+ @include rfs($value, padding-right);
}
}