mirror of
https://github.com/overleaf/overleaf.git
synced 2024-11-14 20:40:17 -05:00
Merge pull request #21125 from overleaf/td-bs5-scss-tidy
Bootstrap 5 Sass code tidy GitOrigin-RevId: 550add757c5bf1476446ad31c386c0a4e5522a9e
This commit is contained in:
parent
36187aeecb
commit
ce0fa69402
11 changed files with 46 additions and 40 deletions
|
@ -125,6 +125,9 @@ $form-switch-padding-start: $spacing-03;
|
|||
$form-switch-focus-color: $component-active-color;
|
||||
$form-switch-checked-color: $component-active-color;
|
||||
|
||||
// form-group
|
||||
$form-group-margin-bottom: $spacing-06;
|
||||
|
||||
// Form validation
|
||||
|
||||
// form-feedback-variables
|
||||
|
|
|
@ -6,8 +6,5 @@ $header-height: 68px;
|
|||
$toolbar-height: 40px;
|
||||
$toolbar-small-height: 32px;
|
||||
|
||||
// Forms
|
||||
$form-group-margin-bottom: $spacing-06;
|
||||
|
||||
// List of allowed themes
|
||||
$themes: ('default', 'light');
|
||||
|
|
|
@ -52,15 +52,3 @@
|
|||
|
||||
// Mixins
|
||||
@import 'bootstrap-5/scss/mixins/breakpoints';
|
||||
|
||||
// Components custom style
|
||||
@import '../components/all';
|
||||
|
||||
// Custom helpers
|
||||
@import '../helpers/all';
|
||||
|
||||
// Modals
|
||||
@import '../modals/all';
|
||||
|
||||
// Pages custom style
|
||||
@import '../pages/all';
|
||||
|
|
|
@ -0,0 +1,18 @@
|
|||
/* Website redesign */
|
||||
$vivid-tangerine: #f1a695;
|
||||
$ceil: #9597c9;
|
||||
$caramel: #f9d38f;
|
||||
$dark-jungle-green: #0f271a;
|
||||
$sapphire-blue: #4354a3;
|
||||
$purple-bright: #939aff;
|
||||
$green-bright: #13c965;
|
||||
|
||||
:root {
|
||||
--vivid-tangerine: #{$vivid-tangerine};
|
||||
--ceil: #{$ceil};
|
||||
--caramel: #{$caramel};
|
||||
--dark-jungle-green: #{$dark-jungle-green};
|
||||
--sapphire-blue: #{$sapphire-blue};
|
||||
--green-bright: #{$green-bright};
|
||||
--purple-bright: #{$purple-bright};
|
||||
}
|
|
@ -23,7 +23,7 @@ a {
|
|||
}
|
||||
|
||||
.link-monospace {
|
||||
@extend .dm-mono;
|
||||
@include font-mono;
|
||||
|
||||
font-weight: 500;
|
||||
color: var(--green-50);
|
||||
|
|
|
@ -78,6 +78,10 @@ samp {
|
|||
color: var(--content-disabled) !important;
|
||||
}
|
||||
|
||||
.dm-mono {
|
||||
@include font-mono;
|
||||
}
|
||||
|
||||
@include media-breakpoint-up(lg) {
|
||||
.text-center-only-desktop {
|
||||
text-align: center;
|
||||
|
|
|
@ -138,7 +138,7 @@
|
|||
margin-bottom: var(--spacing-07);
|
||||
|
||||
a {
|
||||
@extend .dm-mono;
|
||||
@include font-mono;
|
||||
|
||||
text-decoration: none;
|
||||
font-weight: 500;
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
.text-with-bg {
|
||||
@extend .dm-mono;
|
||||
@include font-mono;
|
||||
|
||||
padding: 0 var(--spacing-04);
|
||||
border-radius: var(--border-radius-medium);
|
||||
|
@ -28,7 +28,7 @@
|
|||
}
|
||||
|
||||
.mono-text {
|
||||
@extend .dm-mono;
|
||||
@include font-mono;
|
||||
@include body-lg;
|
||||
|
||||
color: var(--green-60);
|
||||
|
|
|
@ -55,15 +55,6 @@ $yellow-50: #8f5514;
|
|||
$yellow-60: #7a4304;
|
||||
$yellow-70: #633a0b;
|
||||
|
||||
/* Website redesign */
|
||||
$vivid-tangerine: #f1a695;
|
||||
$ceil: #9597c9;
|
||||
$caramel: #f9d38f;
|
||||
$dark-jungle-green: #0f271a;
|
||||
$sapphire-blue: #4354a3;
|
||||
$purple-bright: #939aff;
|
||||
$green-bright: #13c965;
|
||||
|
||||
/* ====== Semantic Sass color variables ====== */
|
||||
$bg-light-primary: $white;
|
||||
$bg-light-secondary: $neutral-10;
|
||||
|
@ -174,15 +165,6 @@ $link-ui-visited-dark: $blue-40;
|
|||
--yellow-60: #{$yellow-60};
|
||||
--yellow-70: #{$yellow-70};
|
||||
|
||||
/* Website redesign */
|
||||
--vivid-tangerine: #{$vivid-tangerine};
|
||||
--ceil: #{$ceil};
|
||||
--caramel: #{$caramel};
|
||||
--dark-jungle-green: #{$dark-jungle-green};
|
||||
--sapphire-blue: #{$sapphire-blue};
|
||||
--green-bright: #{$green-bright};
|
||||
--purple-bright: #{$purple-bright};
|
||||
|
||||
/* ====== Semantic CSS color variables ====== */
|
||||
--bg-light-primary: var(--white);
|
||||
--bg-light-secondary: var(--neutral-10);
|
||||
|
|
|
@ -1,5 +1,4 @@
|
|||
// This file provides CSS variables for font size and line height, plus Sass variables for base text size for Bootstrap
|
||||
@use 'sass:math';
|
||||
|
||||
:root {
|
||||
--font-size-01: 0.75rem; // 12px
|
||||
|
@ -100,7 +99,7 @@
|
|||
line-height: var(--line-height-01);
|
||||
}
|
||||
|
||||
.dm-mono {
|
||||
@mixin font-mono {
|
||||
font-family: 'DM Mono', monospace;
|
||||
|
||||
// We're using the "ss05" (stylistic set 5) version of the DM Mono, by setting the `font-feature-settings` rule
|
||||
|
|
|
@ -12,7 +12,7 @@
|
|||
// TODO Bootstrap 5: Check whether this works with Bootstrap 5, and whether we can replace it
|
||||
@import '../vendor/select/select';
|
||||
|
||||
// Boostrap-related
|
||||
// Bootstrap-related
|
||||
|
||||
// Note that files containing Bootstrap or Sass files that interact with
|
||||
// Bootstrap's Sass variables must use @import rather than @use because
|
||||
|
@ -21,9 +21,24 @@
|
|||
// Include Bootstrap 5 itself, plus overrides and extend Bootstrap styles.
|
||||
@import 'base/bootstrap';
|
||||
|
||||
// Extra colours for the website redesign
|
||||
@import 'base/colors';
|
||||
|
||||
// Components custom style
|
||||
@import 'components/all';
|
||||
|
||||
// Typography-related
|
||||
@import 'base/typography';
|
||||
|
||||
// Custom helpers
|
||||
@import 'helpers/all';
|
||||
|
||||
// Modals
|
||||
@import 'modals/all';
|
||||
|
||||
// Pages custom style
|
||||
@import 'pages/all';
|
||||
|
||||
// Link styles
|
||||
@import 'base/links';
|
||||
@import 'base/base';
|
||||
|
|
Loading…
Reference in a new issue