Switch the base framework from Create React App to Next.JS

Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>
This commit is contained in:
Renovate Bot 2021-12-25 15:44:24 +00:00 committed by Tilman Vatteroth
parent a979b6ffdd
commit 77a60c6c48
361 changed files with 5130 additions and 9605 deletions

View file

@ -0,0 +1,15 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
// Alternate styles
//
// Generate contextual modifier classes for colorizing the alert.
@each $color, $value in $theme-colors {
.alert-#{$color} {
@include alert-variant(theme-color-level($color, $alert-bg-level), theme-color-level($color, $alert-border-level), theme-color-level($color, $alert-color-level));
}
}

View file

@ -0,0 +1,15 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
// Colors
//
// Contextual variations (linked badges get darker on :hover).
@each $color, $value in $theme-colors {
.badge-#{$color} {
@include badge-variant($value);
}
}

View file

@ -0,0 +1,21 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
.breadcrumb {
background-color: $breadcrumb-bg;
}
.breadcrumb-item {
+ .breadcrumb-item {
&::before {
color: $breadcrumb-divider-color;
}
}
&.active {
color: $breadcrumb-active-color;
}
}

View file

@ -0,0 +1,72 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
// stylelint-disable selector-no-qualifying-type
//
// Base styles
//
.btn {
color: $body-color;
@include hover() {
color: $body-color;
}
&:focus,
&.focus {
box-shadow: $btn-focus-box-shadow;
}
&:not(:disabled):not(.disabled) {
&:active,
&.active {
@include box-shadow($btn-active-box-shadow);
&:focus {
@include box-shadow($btn-focus-box-shadow, $btn-active-box-shadow);
}
}
}
}
//
// Alternate buttons
//
@each $color, $value in $theme-colors {
.btn-#{$color} {
@include button-variant($value, $value);
}
}
@each $color, $value in $theme-colors {
.btn-outline-#{$color} {
@include button-outline-variant($value);
}
}
//
// Link buttons
//
// Make a button look and behave like a link
.btn-link {
color: $link-color;
@include hover() {
color: $link-hover-color;
}
&:disabled,
&.disabled {
color: $btn-link-disabled-color;
}
// No need for an active state here
}

View file

@ -0,0 +1,35 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
//
// Base styles
//
.card {
background-color: $card-bg;
border-color: $card-border-color;
}
.card-body {
color: $card-color;
}
//
// Optional textual caps
//
.card-header {
color: $card-cap-color;
background-color: $card-cap-bg;
border-bottom-color: $card-border-color;
}
.card-footer {
color: $card-cap-color;
background-color: $card-cap-bg;
border-top-color: $card-border-color;
}

View file

@ -0,0 +1,30 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
.carousel-control-prev,
.carousel-control-next {
color: $carousel-control-color;
// Hover/focus state
@include hover-focus() {
color: $carousel-control-color;
}
}
.carousel-indicators {
li {
background-color: $carousel-indicator-active-bg;
}
}
// Optional captions
//
//
.carousel-caption {
color: $carousel-caption-color;
}

View file

@ -0,0 +1,18 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
.close {
color: $close-color;
text-shadow: $close-text-shadow;
@include hover() {
color: $close-color;
}
}
button.close {
background-color: transparent;
}

View file

@ -0,0 +1,25 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
// Inline code
code {
color: $code-color;
}
kbd {
color: $kbd-color;
background-color: $kbd-bg;
@include box-shadow($kbd-box-shadow);
}
// Blocks of code
pre {
color: $pre-color;
code {
color: inherit;
}
}

View file

@ -0,0 +1,49 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
.dropdown-menu {
color: $dropdown-color;
background-color: $dropdown-bg;
border-color: $dropdown-border-color;
@include box-shadow($dropdown-box-shadow);
}
// Dividers (basically an `<hr>`) within the dropdown
.dropdown-divider {
@include nav-divider($dropdown-divider-bg, $dropdown-divider-margin-y, true);
}
.dropdown-item {
color: $dropdown-link-color;
@include hover-focus() {
color: $dropdown-link-hover-color;
@include gradient-bg($dropdown-link-hover-bg);
}
&.active,
&:active {
color: $dropdown-link-active-color;
@include gradient-bg($dropdown-link-active-bg);
}
&.disabled,
&:disabled {
color: $dropdown-link-disabled-color;
background-color: transparent;
}
}
// Dropdown section headers
.dropdown-header {
color: $dropdown-header-color;
}
// Dropdown text
.dropdown-item-text {
color: $dropdown-link-color;
}

View file

@ -0,0 +1,65 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
// stylelint-disable selector-no-qualifying-type
//
// Textual form controls
//
.form-control {
color: $input-color;
background-color: $input-bg;
border-color: $input-border-color;
@include box-shadow($input-box-shadow);
&:-moz-focusring {
text-shadow: 0 0 0 $input-color;
}
// Customize the `:focus` state to imitate native WebKit styles.
@include form-control-focus($ignore-warning: true);
// Placeholder
&::placeholder {
color: $input-placeholder-color;
}
&:disabled,
&[readonly] {
background-color: $input-disabled-bg;
}
}
select.form-control {
&:focus::-ms-value {
// Suppress the nested default white text on blue background highlight given to
// the selected option text when the (still closed) <select> receives focus
// in IE and (under certain conditions) Edge, as it looks bad and cannot be made to
// match the appearance of the native widget.
// See https://github.com/twbs/bootstrap/issues/19398.
color: $input-color;
background-color: $input-bg;
}
}
.form-control-plaintext {
color: $input-plaintext-color;
background-color: transparent;
}
.form-check-input {
&[disabled] ~ .form-check-label,
&:disabled ~ .form-check-label {
color: $text-muted;
}
}
@each $state, $data in $form-validation-states {
@include form-validation-state($state, map-get($data, color), map-get($data, icon));
}

View file

@ -0,0 +1,16 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
// Image thumbnails
.img-thumbnail {
background-color: $thumbnail-bg;
border-color: $thumbnail-border-color;
@include box-shadow($thumbnail-box-shadow);
}
.figure-caption {
color: $figure-caption-color;
}

View file

@ -0,0 +1,11 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
.input-group-text {
color: $input-group-addon-color;
background-color: $input-group-addon-bg;
border-color: $input-group-addon-border-color;
}

View file

@ -0,0 +1,10 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
.jumbotron {
color: $jumbotron-color;
background-color: $jumbotron-bg;
}

View file

@ -0,0 +1,47 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
.list-group-item-action {
color: $list-group-action-color;
@include hover-focus() {
color: $list-group-action-hover-color;
background-color: $list-group-hover-bg;
}
&:active {
color: $list-group-action-active-color;
background-color: $list-group-action-active-bg;
}
}
.list-group-item {
color: $list-group-color;
background-color: $list-group-bg;
border-color: $list-group-border-color;
&.disabled,
&:disabled {
color: $list-group-disabled-color;
background-color: $list-group-disabled-bg;
}
// Include both here for `<a>`s and `<button>`s
&.active {
color: $list-group-active-color;
background-color: $list-group-active-bg;
border-color: $list-group-active-border-color;
}
}
// Contextual variants
//
// Add modifier classes to change text and background color on individual items.
// Organizationally, this must come after the `:hover` states.
@each $color, $value in $theme-colors {
@include list-group-item-variant($color, theme-color-level($color, -9), theme-color-level($color, 6));
}

View file

@ -0,0 +1,41 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
&.modal-open .modal {
overflow-x: hidden;
overflow-y: auto;
}
// Actual modal
.modal-content {
background-color: $modal-content-bg;
border-color: $modal-content-border-color;
@include box-shadow($modal-content-box-shadow-xs);
}
// Modal background
.modal-backdrop {
background-color: $modal-backdrop-bg;
}
// Modal header
// Top section of the modal w/ title and dismiss
.modal-header {
border-bottom: $modal-header-border-width solid $modal-header-border-color;
}
// Footer (for actions)
.modal-footer {
border-top: $modal-footer-border-width solid $modal-footer-border-color;
}
// Scale up the modal
@include media-breakpoint-up(sm) {
.modal-content {
@include box-shadow($modal-content-box-shadow-sm-up);
}
}

View file

@ -0,0 +1,42 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
.nav-link {
&.disabled {
color: $nav-link-disabled-color;
}
}
.nav-tabs {
border-bottom-color: $nav-tabs-border-color;
.nav-link {
@include hover-focus() {
border-color: $nav-tabs-link-hover-border-color;
}
&.disabled {
color: $nav-link-disabled-color;
background-color: transparent;
border-color: transparent;
}
}
.nav-link.active,
.nav-item.show .nav-link {
color: $nav-tabs-link-active-color;
background-color: $nav-tabs-link-active-bg;
border-color: $nav-tabs-link-active-border-color;
}
}
.nav-pills {
.nav-link.active,
.show > .nav-link {
color: $nav-pills-link-active-color;
background-color: $nav-pills-link-active-bg;
}
}

View file

@ -0,0 +1,112 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
// Button for toggling the navbar when in its collapsed state
.navbar-toggler {
background-color: transparent; // remove default button style
}
// Navbar themes
//
// Styles for switching between navbars with light or dark background.
// Dark links against a light background
.navbar-light {
.navbar-brand {
color: $navbar-light-brand-color;
@include hover-focus() {
color: $navbar-light-brand-hover-color;
}
}
.navbar-nav {
.nav-link {
color: $navbar-light-color;
@include hover-focus() {
color: $navbar-light-hover-color;
}
&.disabled {
color: $navbar-light-disabled-color;
}
}
.show > .nav-link,
.active > .nav-link,
.nav-link.show,
.nav-link.active {
color: $navbar-light-active-color;
}
}
.navbar-toggler {
color: $navbar-light-color;
border-color: $navbar-light-toggler-border-color;
}
.navbar-text {
color: $navbar-light-color;
a {
color: $navbar-light-active-color;
@include hover-focus() {
color: $navbar-light-active-color;
}
}
}
}
// White links against a dark background
.navbar-dark {
.navbar-brand {
color: $navbar-dark-brand-color;
@include hover-focus() {
color: $navbar-dark-brand-hover-color;
}
}
.navbar-nav {
.nav-link {
color: $navbar-dark-color;
@include hover-focus() {
color: $navbar-dark-hover-color;
}
&.disabled {
color: $navbar-dark-disabled-color;
}
}
.show > .nav-link,
.active > .nav-link,
.nav-link.show,
.nav-link.active {
color: $navbar-dark-active-color;
}
}
.navbar-toggler {
color: $navbar-dark-color;
border-color: $navbar-dark-toggler-border-color;
}
.navbar-text {
color: $navbar-dark-color;
a {
color: $navbar-dark-active-color;
@include hover-focus() {
color: $navbar-dark-active-color;
}
}
}
}

View file

@ -0,0 +1,36 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
.page-link {
color: $pagination-color;
background-color: $pagination-bg;
border-color: $pagination-border-color;
&:hover {
color: $pagination-hover-color;
background-color: $pagination-hover-bg;
border-color: $pagination-hover-border-color;
}
&:focus {
outline: $pagination-focus-outline;
box-shadow: $pagination-focus-box-shadow;
}
}
.page-item {
&.active .page-link {
color: $pagination-active-color;
background-color: $pagination-active-bg;
border-color: $pagination-active-border-color;
}
&.disabled .page-link {
color: $pagination-disabled-color;
background-color: $pagination-disabled-bg;
border-color: $pagination-disabled-border-color;
}
}

View file

@ -0,0 +1,89 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
.popover {
background-color: $popover-bg;
border: $popover-border-width solid $popover-border-color;
@include box-shadow($popover-box-shadow);
}
.bs-popover-top {
> .arrow {
&::before {
border-top-color: $popover-arrow-outer-color;
}
&::after {
border-top-color: $popover-arrow-color;
}
}
}
.bs-popover-right {
> .arrow {
&::before {
border-right-color: $popover-arrow-outer-color;
}
&::after {
border-right-color: $popover-arrow-color;
}
}
}
.bs-popover-bottom {
> .arrow {
&::before {
border-bottom-color: $popover-arrow-outer-color;
}
&::after {
border-bottom-color: $popover-arrow-color;
}
}
}
.bs-popover-left {
> .arrow {
&::before {
border-left-color: $popover-arrow-outer-color;
}
&::after {
border-left-color: $popover-arrow-color;
}
}
}
.bs-popover-auto {
&[x-placement^="top"] {
@extend .bs-popover-top;
}
&[x-placement^="right"] {
@extend .bs-popover-right;
}
&[x-placement^="bottom"] {
@extend .bs-popover-bottom;
}
&[x-placement^="left"] {
@extend .bs-popover-left;
}
}
// Offset the popover to account for the popover arrow
.popover-header {
color: $popover-header-color;
background-color: $popover-header-bg;
border-bottom-color: darken($popover-header-bg, 5%);
}
.popover-body {
color: $popover-body-color;
}

View file

@ -0,0 +1,15 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
.progress {
background-color: $progress-bg;
@include box-shadow($progress-box-shadow);
}
.progress-bar {
color: $progress-bar-color;
background-color: $progress-bar-bg;
}

View file

@ -0,0 +1,28 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
& {
color: $body-color;
background-color: $body-bg; // 2
}
a {
color: $link-color;
background-color: transparent; // Remove the gray background on active links in IE 10.
@include hover() {
color: $link-hover-color;
}
}
caption {
color: $table-caption-color;
}
button:focus {
outline: 1px dotted;
outline: 5px auto -webkit-focus-ring-color;
}

View file

@ -0,0 +1,14 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
.spinner-border {
border-color: currentColor;
border-right-color: transparent;
}
.spinner-grow {
background-color: currentColor;
}

View file

@ -0,0 +1,128 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
//
// Basic Bootstrap table
//
.table {
color: $table-color;
background-color: $table-bg; // Reset for nesting within parents with `background-color`.
th,
td {
border-top-color: $table-border-color;
}
thead th {
border-bottom-color: $table-border-color;
}
tbody + tbody {
border-top-color: $table-border-color;
}
}
// Border versions
//
// Add or remove borders all around the table and between all the columns.
.table-bordered {
border-color: $table-border-color;
th,
td {
border-color: $table-border-color;
}
}
// Zebra-striping
//
// Default zebra-stripe styles (alternating gray and transparent backgrounds)
.table-striped {
tbody tr:nth-of-type(#{$table-striped-order}) {
background-color: $table-accent-bg;
}
}
// Hover effect
//
// Placed here since it has to come after the potential zebra striping
.table-hover {
tbody tr {
@include hover() {
color: $table-hover-color;
background-color: $table-hover-bg;
}
}
}
// Table backgrounds
//
// Exact selectors below required to override `.table-striped` and prevent
// inheritance to nested tables.
@each $color, $value in $theme-colors {
@include table-row-variant($color, theme-color-level($color, $table-bg-level), theme-color-level($color, $table-border-level));
}
@include table-row-variant(active, $table-active-bg);
// Dark styles
//
// Same table markup, but inverted color scheme: dark background and light text.
// stylelint-disable-next-line no-duplicate-selectors
.table {
.thead-dark {
th {
color: $table-dark-color;
background-color: $table-dark-bg;
border-color: $table-dark-border-color;
}
}
.thead-light {
th {
color: $table-head-color;
background-color: $table-head-bg;
border-color: $table-border-color;
}
}
}
.table-dark {
color: $table-dark-color;
background-color: $table-dark-bg;
th,
td,
thead th {
border-color: $table-dark-border-color;
}
&.table-striped {
tbody tr:nth-of-type(#{$table-striped-order}) {
background-color: $table-dark-accent-bg;
}
}
&.table-hover {
tbody tr {
@include hover() {
color: $table-dark-hover-color;
background-color: $table-dark-hover-bg;
}
}
}
}

View file

@ -0,0 +1,17 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
.toast {
color: $toast-color;
background-color: $toast-background-color;
border-color: $toast-border-color;
}
.toast-header {
color: $toast-header-color;
background-color: $toast-header-background-color;
border-bottom-color: $toast-header-border-color;
}

View file

@ -0,0 +1,61 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
.bs-tooltip-top {
.arrow {
&::before {
border-top-color: $tooltip-arrow-color;
}
}
}
.bs-tooltip-right {
.arrow {
&::before {
border-right-color: $tooltip-arrow-color;
}
}
}
.bs-tooltip-bottom {
.arrow {
&::before {
border-bottom-color: $tooltip-arrow-color;
}
}
}
.bs-tooltip-left {
.arrow {
&::before {
border-left-color: $tooltip-arrow-color;
}
}
}
.bs-tooltip-auto {
&[x-placement^="top"] {
@extend .bs-tooltip-top;
}
&[x-placement^="right"] {
@extend .bs-tooltip-right;
}
&[x-placement^="bottom"] {
@extend .bs-tooltip-bottom;
}
&[x-placement^="left"] {
@extend .bs-tooltip-left;
}
}
// Wrapper for the tooltip content
.tooltip-inner {
color: $tooltip-color;
background-color: $tooltip-bg;
}

View file

@ -0,0 +1,34 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
// stylelint-disable declaration-no-important, selector-list-comma-newline-after
//
// Headings
//
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
color: $headings-color;
}
//
// Horizontal rules
//
hr {
border-top-color: $hr-border-color;
}
mark,
.mark {
background-color: $mark-bg;
}
.blockquote-footer {
color: $blockquote-small-color;
}

View file

@ -0,0 +1,38 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
@import "~bootstrap/scss/functions";
@import "~bootstrap/scss/mixins";
@import "reboot";
@import "type";
@import "images";
@import "code";
@import "tables";
@import "forms";
@import "buttons";
@import "dropdown";
@import "input-group";
@import "nav";
@import "navbar";
@import "card";
@import "breadcrumb";
@import "pagination";
@import "badge";
@import "jumbotron";
@import "alert";
@import "progress";
@import "list-group";
@import "close";
@import "toasts";
@import "modal";
@import "tooltip";
@import "popover";
@import "carousel";
@import "spinners";
@import "utilities/background";
@import "utilities/borders";
@import "utilities/text";

View file

@ -0,0 +1,21 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
// stylelint-disable declaration-no-important
@each $color, $value in $theme-colors {
@include bg-variant(".bg-#{$color}", $value, true);
}
@if $enable-gradients {
@each $color, $value in $theme-colors {
@include bg-gradient-variant(".bg-gradient-#{$color}", $value, true);
}
}
.bg-white {
background-color: $white !important;
}

View file

@ -0,0 +1,41 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
// stylelint-disable property-blacklist, declaration-no-important
//
// Border
//
.border {
border-color: $border-color !important;
}
.border-top {
border-top-color: $border-color !important;
}
.border-right {
border-right-color: $border-color !important;
}
.border-bottom {
border-bottom-color: $border-color !important;
}
.border-left {
border-left-color: $border-color !important;
}
@each $color, $value in $theme-colors {
.border-#{$color} {
border-color: $value !important;
}
}
.border-white {
border-color: $white !important;
}

View file

@ -0,0 +1,31 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
// Contextual colors
.text-white {
color: $white !important;
}
@each $color, $value in $theme-colors {
@include text-emphasis-variant(".text-#{$color}", $value, true);
}
.text-body {
color: $body-color !important;
}
.text-muted {
color: $text-muted !important;
}
.text-black-50 {
color: rgba($black, .5) !important;
}
.text-white-50 {
color: rgba($white, .5) !important;
}