diff --git a/client/e2e/src/po/admin-config.po.ts b/client/e2e/src/po/admin-config.po.ts index 6632894bb..8e3d90f45 100644 --- a/client/e2e/src/po/admin-config.po.ts +++ b/client/e2e/src/po/admin-config.po.ts @@ -10,7 +10,7 @@ export class AdminConfigPage { } await go('/admin/config/edit-custom#' + tab) - await $('.section-left-column-title=' + waitTitles[tab]).waitForDisplayed() + await $('h2=' + waitTitles[tab]).waitForDisplayed() } async updateNSFWSetting (newValue: 'do_not_list' | 'blur' | 'display') { diff --git a/client/src/app/+admin/config/edit-custom-config/edit-advanced-configuration.component.html b/client/src/app/+admin/config/edit-custom-config/edit-advanced-configuration.component.html index 8695b922b..8e5d62b8e 100644 --- a/client/src/app/+admin/config/edit-custom-config/edit-advanced-configuration.component.html +++ b/client/src/app/+admin/config/edit-custom-config/edit-advanced-configuration.component.html @@ -1,15 +1,15 @@ -
+
-
-

CACHE

+
+

CACHE

Some files are not federated, and fetched when necessary. Define their caching policies.
-
+
@@ -71,16 +71,16 @@
-
-
+
+
-

CUSTOMIZATIONS

+

CUSTOMIZATIONS

Slight modifications to your PeerTube instance for when creating a plugin or theme is overkill.
-
+
diff --git a/client/src/app/+admin/config/edit-custom-config/edit-basic-configuration.component.html b/client/src/app/+admin/config/edit-custom-config/edit-basic-configuration.component.html index 3de23dcf5..f75b62f0a 100644 --- a/client/src/app/+admin/config/edit-custom-config/edit-basic-configuration.component.html +++ b/client/src/app/+admin/config/edit-custom-config/edit-basic-configuration.component.html @@ -1,13 +1,14 @@ -
-
-

APPEARANCE

+
+
+

APPEARANCE

+
Use plugins & themes for more involved changes, or add slight customizations.
-
+
@@ -90,14 +91,14 @@
-
-

BROADCAST MESSAGE

+
+

BROADCAST MESSAGE

Display a message on your instance
-
+
@@ -146,14 +147,14 @@
-
-

NEW USERS

+
+

NEW USERS

Manage users to set their quota individually.
-
+
@@ -263,11 +264,11 @@
-
-

VIDEOS

+
+

VIDEOS

-
+
@@ -375,11 +376,11 @@
-
-

VIDEO CHANNELS

+
+

VIDEO CHANNELS

-
+
@@ -397,11 +398,11 @@
-
-

SEARCH

+
+

SEARCH

-
+
@@ -486,11 +487,11 @@
-
-

USER IMPORT/EXPORT

+
+

USER IMPORT/EXPORT

-
+
@@ -562,14 +563,14 @@
-
-

FEDERATION

+
+

FEDERATION

Manage relations with other instances.
-
+
@@ -641,11 +642,11 @@
-
-

ADMINISTRATORS

+
+

ADMINISTRATORS

-
+
@@ -669,15 +670,15 @@
-
-

TWITTER

+
+

TWITTER

Provide the Twitter account representing your instance to improve link previews. If you don't have a Twitter account, just leave the default value.
-
+
diff --git a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.scss b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.scss index 9215ab0de..b47a54085 100644 --- a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.scss +++ b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.scss @@ -151,3 +151,4 @@ ngb-tabset:not(.previews) ::ng-deep { my-actor-banner-edit { max-width: $form-max-width; } + diff --git a/client/src/app/+admin/config/edit-custom-config/edit-homepage.component.html b/client/src/app/+admin/config/edit-custom-config/edit-homepage.component.html index 89568a319..091d14ab7 100644 --- a/client/src/app/+admin/config/edit-custom-config/edit-homepage.component.html +++ b/client/src/app/+admin/config/edit-custom-config/edit-homepage.component.html @@ -2,12 +2,12 @@ -
-
-

INSTANCE HOMEPAGE

+
+
+

INSTANCE HOMEPAGE

-
+
diff --git a/client/src/app/+admin/config/edit-custom-config/edit-instance-information.component.html b/client/src/app/+admin/config/edit-custom-config/edit-instance-information.component.html index 853377246..110695bcf 100644 --- a/client/src/app/+admin/config/edit-custom-config/edit-instance-information.component.html +++ b/client/src/app/+admin/config/edit-custom-config/edit-instance-information.component.html @@ -2,12 +2,12 @@ -
-
-

INSTANCE

+
+
+

INSTANCE

-
+
@@ -102,15 +102,15 @@
-
-
-

MODERATION & NSFW

+
+
+

MODERATION & NSFW

Manage users to build a moderation team.
-
+
@@ -180,12 +180,12 @@
-
-
-

YOU AND YOUR INSTANCE

+
+
+

YOU AND YOUR INSTANCE

-
+
@@ -230,12 +230,12 @@
-
-
-

OTHER INFORMATION

+
+
+

OTHER INFORMATION

-
+
diff --git a/client/src/app/+admin/config/edit-custom-config/edit-live-configuration.component.html b/client/src/app/+admin/config/edit-custom-config/edit-live-configuration.component.html index cfd4068a3..5120c763d 100644 --- a/client/src/app/+admin/config/edit-custom-config/edit-live-configuration.component.html +++ b/client/src/app/+admin/config/edit-custom-config/edit-live-configuration.component.html @@ -1,14 +1,15 @@ -
-
-

LIVE

+
+
+

LIVE

+
Enable users of your instance to stream live.
-
+
@@ -87,15 +88,15 @@
-
-
-

TRANSCODING

+
+
+

TRANSCODING

Same as VOD transcoding, transcoding live streams so that they are in a streamable form that any device can play. Requires a beefy CPU, and then some.
-
+
diff --git a/client/src/app/+admin/config/edit-custom-config/edit-vod-transcoding.component.html b/client/src/app/+admin/config/edit-custom-config/edit-vod-transcoding.component.html index 6d3ebccc4..588829a82 100644 --- a/client/src/app/+admin/config/edit-custom-config/edit-vod-transcoding.component.html +++ b/client/src/app/+admin/config/edit-custom-config/edit-vod-transcoding.component.html @@ -1,8 +1,8 @@ -
-
-
+
+
+
@@ -16,20 +16,21 @@
-
-
-

TRANSCODING

+
+
+

TRANSCODING

+
Process uploaded videos so that they are in a streamable form that any device can play. Though costly in resources, this is a critical part of PeerTube, so tread carefully.
-
+
-
+
Transcoding enabled @@ -209,15 +210,15 @@
-
-
-

VIDEO STUDIO

+
+
+

VIDEO STUDIO

Allows your users to edit their video (cut, add intro/outro, add a watermark etc)
-
+
diff --git a/client/src/app/+admin/overview/users/user-edit/user-edit.component.html b/client/src/app/+admin/overview/users/user-edit/user-edit.component.html index 293cc2c32..f575adfa5 100644 --- a/client/src/app/+admin/overview/users/user-edit/user-edit.component.html +++ b/client/src/app/+admin/overview/users/user-edit/user-edit.component.html @@ -1,18 +1,18 @@ @@ -57,34 +57,33 @@
-
-
+
{{ error }}
+ +
+
-
{{ error }}
- -
-
+
+
@if (isCreation()) { -
NEW USER
+

NEW USER

} @else if (user) { -
- -
- } + + + }
-
+
@@ -206,7 +205,7 @@
- +
@@ -217,18 +216,18 @@
-
-
+
+
-
DANGER ZONE
+

DANGER ZONE

-
+
Send a link to reset the password by email to the user
- +
@@ -238,7 +237,7 @@
This user has two factor authentication enabled
- +
diff --git a/client/src/app/+admin/overview/users/user-edit/user-edit.component.scss b/client/src/app/+admin/overview/users/user-edit/user-edit.component.scss index 079a249d8..7eeac82a8 100644 --- a/client/src/app/+admin/overview/users/user-edit/user-edit.component.scss +++ b/client/src/app/+admin/overview/users/user-edit/user-edit.component.scss @@ -26,30 +26,62 @@ my-select-custom-value { display: block; } -input[type=submit], -button { - @include peertube-button; - @include orange-button; - - margin-top: 10px; -} - .danger-zone { button { - @include peertube-button; @include danger-button; @include disable-outline; - - display: block; - margin-top: 0; } } -.breadcrumb { - @include breadcrumb; -} - .dashboard { - @include dashboard; + display: flex; + flex-wrap: wrap; + margin: 0 -5px; max-width: 900px; + + > div { + box-sizing: border-box; + flex: 0 0 math.percentage(math.div(1, 3)); + padding: 0 5px; + margin-bottom: 10px; + + > a { + @include disable-default-a-behaviour; + + text-decoration: none; + color: inherit; + display: block; + font-size: 18px; + + &:active, + &:focus, + &:hover { + opacity: .8; + } + } + + > a, + > div { + padding: 20px; + background: pvar(--submenuBackgroundColor); + border-radius: 4px; + box-sizing: border-box; + height: 100%; + } + } + + .dashboard-num, + .dashboard-text { + text-align: center; + font-size: 130%; + color: pvar(--mainForegroundColor); + line-height: 30px; + margin-bottom: 20px; + } + + .dashboard-label { + font-size: 90%; + color: pvar(--inputPlaceholderColor); + text-align: center; + } } diff --git a/client/src/app/+manage/video-channel-edit/video-channel-create.component.ts b/client/src/app/+manage/video-channel-edit/video-channel-create.component.ts index 3f876078f..a7796f26c 100644 --- a/client/src/app/+manage/video-channel-edit/video-channel-create.component.ts +++ b/client/src/app/+manage/video-channel-edit/video-channel-create.component.ts @@ -104,7 +104,7 @@ export class VideoChannelCreateComponent extends VideoChannelEdit implements OnI } getFormButtonTitle () { - return $localize`Create` + return $localize`Create your channel` } getUsername () { diff --git a/client/src/app/+manage/video-channel-edit/video-channel-edit.component.html b/client/src/app/+manage/video-channel-edit/video-channel-edit.component.html index 6ffeae1ba..97edeee84 100644 --- a/client/src/app/+manage/video-channel-edit/video-channel-edit.component.html +++ b/client/src/app/+manage/video-channel-edit/video-channel-edit.component.html @@ -3,13 +3,16 @@
-
-
-
NEW CHANNEL
-
CHANNEL
+
+
+ @if (isCreation()) { +

NEW CHANNEL

+ } @else { +

UPDATE CHANNEL

+ }
-
+
-
-
- -
-
-
- +
diff --git a/client/src/app/+manage/video-channel-edit/video-channel-edit.component.scss b/client/src/app/+manage/video-channel-edit/video-channel-edit.component.scss index e2f428942..567748760 100644 --- a/client/src/app/+manage/video-channel-edit/video-channel-edit.component.scss +++ b/client/src/app/+manage/video-channel-edit/video-channel-edit.component.scss @@ -25,6 +25,6 @@ my-markdown-textarea { @include peertube-select-container(340px); } -.breadcrumb { - @include breadcrumb; +.pt-two-cols .content-col { + max-width: 500px; } diff --git a/client/src/app/+manage/video-channel-edit/video-channel-update.component.ts b/client/src/app/+manage/video-channel-edit/video-channel-update.component.ts index d3ed29741..8e5472d7c 100644 --- a/client/src/app/+manage/video-channel-edit/video-channel-update.component.ts +++ b/client/src/app/+manage/video-channel-edit/video-channel-update.component.ts @@ -2,7 +2,7 @@ import { Subscription } from 'rxjs' import { HttpErrorResponse } from '@angular/common/http' import { AfterViewInit, Component, OnDestroy, OnInit } from '@angular/core' import { ActivatedRoute } from '@angular/router' -import { AuthService, HooksService, Notifier, RedirectService, ServerService } from '@app/core' +import { AuthService, HooksService, Notifier, RedirectService } from '@app/core' import { genericUploadErrorHandler } from '@app/helpers' import { VIDEO_CHANNEL_DESCRIPTION_VALIDATOR, @@ -11,7 +11,7 @@ import { } from '@app/shared/form-validators/video-channel-validators' import { FormReactiveService } from '@app/shared/shared-forms' import { VideoChannel, VideoChannelService } from '@app/shared/shared-main' -import { HTMLServerConfig, VideoChannelUpdate } from '@peertube/peertube-models' +import { VideoChannelUpdate } from '@peertube/peertube-models' import { VideoChannelEdit } from './video-channel-edit' import { shallowCopy } from '@peertube/peertube-core-utils' @@ -26,7 +26,6 @@ export class VideoChannelUpdateComponent extends VideoChannelEdit implements OnI private paramsSub: Subscription private oldSupportField: string - private serverConfig: HTMLServerConfig constructor ( protected formReactiveService: FormReactiveService, @@ -34,7 +33,6 @@ export class VideoChannelUpdateComponent extends VideoChannelEdit implements OnI private notifier: Notifier, private route: ActivatedRoute, private videoChannelService: VideoChannelService, - private serverService: ServerService, private redirectService: RedirectService, private hooks: HooksService ) { @@ -42,8 +40,6 @@ export class VideoChannelUpdateComponent extends VideoChannelEdit implements OnI } ngOnInit () { - this.serverConfig = this.serverService.getHTMLConfig() - this.buildForm({ 'display-name': VIDEO_CHANNEL_DISPLAY_NAME_VALIDATOR, 'description': VIDEO_CHANNEL_DESCRIPTION_VALIDATOR, @@ -183,7 +179,7 @@ export class VideoChannelUpdateComponent extends VideoChannelEdit implements OnI } getFormButtonTitle () { - return $localize`Update` + return $localize`Update ${this.videoChannel.name}` } isBulkUpdateVideosDisplayed () { diff --git a/client/src/app/+my-account/my-account-applications/my-account-applications.component.html b/client/src/app/+my-account/my-account-applications/my-account-applications.component.html index bb0f463d6..d1dc9bfb6 100644 --- a/client/src/app/+my-account/my-account-applications/my-account-applications.component.html +++ b/client/src/app/+my-account/my-account-applications/my-account-applications.component.html @@ -3,17 +3,17 @@ Applications -
+
-
-

SUBSCRIPTION FEED

+
+

SUBSCRIPTION FEED

Use third-party feed aggregators to retrieve the list of videos from channels you subscribed to.
-
+
@@ -27,12 +27,7 @@
⚠️ Never share your feed token with anyone.
-
-
+ -
-
-
-
diff --git a/client/src/app/+my-account/my-account-applications/my-account-applications.component.scss b/client/src/app/+my-account/my-account-applications/my-account-applications.component.scss index c1966d5cc..7fe378d59 100644 --- a/client/src/app/+my-account/my-account-applications/my-account-applications.component.scss +++ b/client/src/app/+my-account/my-account-applications/my-account-applications.component.scss @@ -1,20 +1,6 @@ @use '_variables' as *; @use '_mixins' as *; -.form-group { +.pt-two-cols .content-col { max-width: 500px; } - -input[type=submit] { - @include peertube-button; - @include orange-button; - @include margin-left(auto); - - display: flex; - - + .form-error { - @include margin-left(5px); - - display: inline; - } -} diff --git a/client/src/app/+my-account/my-account-import-export/my-account-export.component.html b/client/src/app/+my-account/my-account-import-export/my-account-export.component.html index ecdb7d373..52f616fa1 100644 --- a/client/src/app/+my-account/my-account-import-export/my-account-export.component.html +++ b/client/src/app/+my-account/my-account-import-export/my-account-export.component.html @@ -1,10 +1,10 @@ -
+
-
-

EXPORT

+
+

EXPORT

-
+
@if (isExportEnabled()) { diff --git a/client/src/app/+my-account/my-account-import-export/my-account-import.component.html b/client/src/app/+my-account/my-account-import-export/my-account-import.component.html index 3f32a5cb1..812107be4 100644 --- a/client/src/app/+my-account/my-account-import-export/my-account-import.component.html +++ b/client/src/app/+my-account/my-account-import-export/my-account-import.component.html @@ -1,10 +1,10 @@ -
+
-
-

IMPORT

+
+

IMPORT

-
+
@if (isImportEnabled()) {

You can import an archive created by another PeerTube website.

diff --git a/client/src/app/+my-account/my-account-settings/my-account-settings.component.html b/client/src/app/+my-account/my-account-settings/my-account-settings.component.html index ef60b1761..d7534a7ce 100644 --- a/client/src/app/+my-account/my-account-settings/my-account-settings.component.html +++ b/client/src/app/+my-account/my-account-settings/my-account-settings.component.html @@ -1,99 +1,94 @@

Settings

-
-
+
+
+

PROFILE SETTINGS

+
-
+
-
-
-
-
-

PROFILE SETTINGS

-
- -
-
-
-

INTERFACE

+
+
+

INTERFACE

-
+
-
-
+
+
-

VIDEO SETTINGS

+

VIDEO SETTINGS

-
+
-
-
+
+
-

NOTIFICATIONS

+

NOTIFICATIONS

-
+
-
-
-

PASSWORD

+
+
+

PASSWORD

-
+
-
-
-

Two-factor authentication

+
+
+

Two-factor authentication

-
+
-
-
-

EMAIL

+
+
+

EMAIL

-
+
-
-
-

DANGER ZONE

+
+
+

DANGER ZONE

-
+
diff --git a/client/src/app/+my-account/my-account-settings/my-account-settings.component.scss b/client/src/app/+my-account/my-account-settings/my-account-settings.component.scss index 3440fc614..3ac3c1add 100644 --- a/client/src/app/+my-account/my-account-settings/my-account-settings.component.scss +++ b/client/src/app/+my-account/my-account-settings/my-account-settings.component.scss @@ -1,9 +1,6 @@ -@use 'sass:color'; - @use '_variables' as *; @use '_mixins' as *; -@use 'bootstrap/scss/functions' as *; -.row > div { - max-width: 500px; +.content-col { + max-width: 500px;; } diff --git a/client/src/app/+my-library/my-video-channel-syncs/video-channel-sync-edit/video-channel-sync-edit.component.html b/client/src/app/+my-library/my-video-channel-syncs/video-channel-sync-edit/video-channel-sync-edit.component.html index cc57a2c0d..8d81f4302 100644 --- a/client/src/app/+my-library/my-video-channel-syncs/video-channel-sync-edit/video-channel-sync-edit.component.html +++ b/client/src/app/+my-library/my-video-channel-syncs/video-channel-sync-edit/video-channel-sync-edit.component.html @@ -1,64 +1,58 @@
{{ error }}
-
-
+
-
-
-
NEW SYNCHRONIZATION
-
+
+

NEW SYNCHRONIZATION

+
-
-
- +
+ -
- -
+
+ - +
+
-
- - - - -
- -
- - -
- - -
- -
- - -
+
-
-
-
-
- +
+ + + +
-
- + +
+ + +
+ + +
+ +
+ + +
+
+ + + +
diff --git a/client/src/app/+my-library/my-video-playlists/my-video-playlist-edit.component.html b/client/src/app/+my-library/my-video-playlists/my-video-playlist-edit.component.html index 46a2a9919..e9e4cd36c 100644 --- a/client/src/app/+my-library/my-video-playlists/my-video-playlist-edit.component.html +++ b/client/src/app/+my-library/my-video-playlists/my-video-playlist-edit.component.html @@ -1,34 +1,44 @@ - -
{{ error }}
-
+
+
+ + + @if (isCreation()) { + + } @else { + + }
-
+
+ + +
+ + + +
-
Description
-
-
@@ -55,40 +63,21 @@ >
- +
- +
-
- - - -
-
- -
-
-
- -
-
+ +
- diff --git a/client/src/app/+my-library/my-video-playlists/my-video-playlist-edit.component.scss b/client/src/app/+my-library/my-video-playlists/my-video-playlist-edit.component.scss index aac9a99ff..b34926cb5 100644 --- a/client/src/app/+my-library/my-video-playlists/my-video-playlist-edit.component.scss +++ b/client/src/app/+my-library/my-video-playlists/my-video-playlist-edit.component.scss @@ -16,11 +16,6 @@ my-select-channel { max-width: 340px; } -input[type=submit] { - @include peertube-button; - @include orange-button; -} - -.breadcrumb { - @include breadcrumb; +.content-col { + max-width: 500px;; } diff --git a/client/src/sass/class-helpers/_layout.scss b/client/src/sass/class-helpers/_layout.scss new file mode 100644 index 000000000..ae1ed10ac --- /dev/null +++ b/client/src/sass/class-helpers/_layout.scss @@ -0,0 +1,46 @@ +@use 'sass:color'; + +@use '_variables' as *; +@use '_mixins' as *; + +.pt-two-cols { + @include make-row(); + + .title-col { + @include make-col-ready(); + @include make-col(12); + + @include media-breakpoint-up(lg) { + @include make-col(4); + } + + @include media-breakpoint-up(xl) { + @include make-col(3); + } + + h2 { + text-transform: uppercase; + color: pvar(--mainColor); + font-weight: $font-bold; + font-size: 1rem; + margin-bottom: 10px; + + &.pt-title-danger { + color: color.adjust($color: #c54130, $lightness: 10%); + } + } + } + + .content-col { + @include make-col-ready(); + @include make-col(12); + + @include media-breakpoint-up(lg) { + @include make-col(8); + } + + @include media-breakpoint-up(xl) { + @include make-col(9); + } + } +} diff --git a/client/src/sass/class-helpers/_menu.scss b/client/src/sass/class-helpers/_menu.scss index 358d734ce..a12012d60 100644 --- a/client/src/sass/class-helpers/_menu.scss +++ b/client/src/sass/class-helpers/_menu.scss @@ -80,3 +80,36 @@ flex-direction: column; } } + +.pt-breadcrumb { + display: flex; + flex-wrap: wrap; + padding: 0; + margin-bottom: 1rem; + list-style: none; + font-weight: $font-semibold; + + .breadcrumb-item { + display: flex; + + a { + color: pvar(--mainColor); + } + + + .breadcrumb-item { + @include padding-left(0.5rem); + + &::before { + @include padding-right(0.5rem); + + display: inline-block; + color: #6c757d; + content: '/'; + } + } + + &.active { + color: #6c757d; + } + } +} diff --git a/client/src/sass/class-helpers/_text.scss b/client/src/sass/class-helpers/_text.scss index 50a9eb61a..9aff2a88a 100644 --- a/client/src/sass/class-helpers/_text.scss +++ b/client/src/sass/class-helpers/_text.scss @@ -25,20 +25,6 @@ // --------------------------------------------------------------------------- -.section-left-column-title { - text-transform: uppercase; - color: pvar(--mainColor); - font-weight: $font-bold; - font-size: 1rem; - margin-bottom: 10px; - - &.section-left-column-title-danger { - color: color.adjust($color: #c54130, $lightness: 10%); - } -} - -// --------------------------------------------------------------------------- - .muted { @include muted; } diff --git a/client/src/sass/class-helpers/index.scss b/client/src/sass/class-helpers/index.scss index d8fb96e50..daa339940 100644 --- a/client/src/sass/class-helpers/index.scss +++ b/client/src/sass/class-helpers/index.scss @@ -5,3 +5,4 @@ @use './images'; @use './_menu'; @use './_text'; +@use './_layout'; diff --git a/client/src/sass/include/_mixins.scss b/client/src/sass/include/_mixins.scss index 5e202a30b..cb912230b 100644 --- a/client/src/sass/include/_mixins.scss +++ b/client/src/sass/include/_mixins.scss @@ -667,91 +667,6 @@ } } -@mixin breadcrumb { - display: flex; - flex-wrap: wrap; - padding: 0; - margin-bottom: 1rem; - list-style: none; - font-weight: $font-semibold; - - .breadcrumb-item { - display: flex; - - a { - color: pvar(--mainColor); - } - - + .breadcrumb-item { - @include padding-left(0.5rem); - - &::before { - @include padding-right(0.5rem); - - display: inline-block; - color: #6c757d; - content: '/'; - } - } - - &.active { - color: #6c757d; - } - } -} - -@mixin dashboard { - display: flex; - flex-wrap: wrap; - margin: 0 -5px; - - > div { - box-sizing: border-box; - flex: 0 0 math.percentage(math.div(1, 3)); - padding: 0 5px; - margin-bottom: 10px; - - > a { - @include disable-default-a-behaviour; - - text-decoration: none; - color: inherit; - display: block; - font-size: 18px; - - &:active, - &:focus, - &:hover { - opacity: .8; - } - } - - > a, - > div { - padding: 20px; - background: pvar(--submenuBackgroundColor); - border-radius: 4px; - box-sizing: border-box; - height: 100%; - } - } - - .dashboard-num, - .dashboard-text { - text-align: center; - font-size: 130%; - color: pvar(--mainForegroundColor); - line-height: 30px; - margin-bottom: 20px; - } - - .dashboard-label { - font-size: 90%; - color: pvar(--inputPlaceholderColor); - text-align: center; - } -} - @mixin divider($color: pvar(--submenuBackgroundColor), $background: pvar(--mainBackgroundColor)) { width: 95%; border-top: .05rem solid $color;