Adopt new Bootstrap 5 dark mode support

This commit is contained in:
Christopher C. Wells 2023-07-09 09:26:13 -07:00
parent 9c17b617b7
commit ad5f81d84a
26 changed files with 144 additions and 229 deletions

View File

@ -28,14 +28,7 @@ $light: $gray-100;
$dark: $gray-800;
// Body
// Settings for the `<body>` element.
$body-bg: $gray-900;
$body-color: $gray-400;
// Links
// Style anchor elements.
$link-color: $info;
$link-decoration: none;
@ -43,94 +36,19 @@ $link-hover-color: color.adjust($link-color, $lightness: -15%);
// Components
// Define common padding and border radius sizes and more.
$border-color: $gray-200;
$component-active-color: $gray-400;
$component-active-bg: $primary;
// Fonts
// Font, line-height, and color for body text, headings, and more.
$text-muted: $gray-600 !default;
$blockquote-small-color: $gray-600 !default;
$hr-border-color: rgba($black, .1) !default;
$mark-bg: #fcf8e3 !default;
// Forms
$input-bg: $white;
$input-disabled-bg: $gray-600;
$input-color: $black;
$input-border-color: rgba($gray-600, .15);
$input-group-addon-bg: $gray-500;
// Tables
$table-cell-padding-y: 0.75rem;
$table-cell-padding-x: 0.75rem;
$table-striped-bg: $dark;
// Dropdowns
// Dropdown menu container and contents.
$dropdown-bg: $gray-700;
$dropdown-divider-bg: $gray-800;
$dropdown-link-color: $body-color;
$dropdown-link-hover-color: color.adjust($body-color, $lightness: -5%);
$dropdown-link-hover-bg: $primary;
$dropdown-link-active-color: $component-active-color;
$dropdown-link-active-bg: $component-active-bg;
$dropdown-header-color: color.adjust($body-color, $lightness: -25%);
// Pagination
$pagination-color: $link-color;
$pagination-bg: $dark;
$pagination-border-color: color.adjust($dark, $lightness: 5%);
$pagination-hover-color: $link-hover-color;
$pagination-hover-bg: $gray-900;
$pagination-hover-border-color: $gray-800;
$pagination-active-color: $body-color;
$pagination-active-bg: $primary;
$pagination-active-border-color: $primary;
$pagination-disabled-color: $gray-600;
$pagination-disabled-bg: $pagination-bg;
$pagination-disabled-border-color: $pagination-border-color;
// Cards
$card-bg: $dark;
$card-cap-bg: rgba($light, .05);
// Progress bars
$progress-bg: $gray-600;
// List group
$list-group-bg: $dark;
$list-group-hover-bg: color.adjust($list-group-bg, $lightness: -5%);
$list-group-active-color: $component-active-color !default;
$list-group-active-bg: $component-active-bg !default;
$list-group-active-border-color: $list-group-active-bg !default;
$list-group-action-color: $gray-400;
$list-group-action-hover-color: $list-group-action-color;
// Breadcrumbs
$breadcrumb-active-color: $gray-600;
$breadcrumb-bg: none;
$breadcrumb-padding-y: 0.75rem;
$breadcrumb-padding-x: 1rem;

View File

@ -4,7 +4,7 @@
{% get_current_timezone as TIMEZONE %}
<!DOCTYPE html>
<html lang="en">
<html lang="en" data-bs-theme="dark">
<head>
<meta charset="utf-8" />
<title>{% block title %}{% endblock %} | Baby Buddy</title>

View File

@ -23,7 +23,7 @@
</form>
<p>
<a class="btn btn-dark btn-sm"
<a class="btn btn btn-sm"
data-bs-toggle="collapse"
href="#filter_form"
role="button"

View File

@ -2,7 +2,7 @@
{% load babybuddy i18n static timers %}
{% block nav %}
<nav class="navbar navbar-expand-md navbar-dark bg-dark sticky-top">
<nav class="navbar navbar-expand-md navbar bg-dark sticky-top">
<div class="container-fluid">
<a class="navbar-brand me-2" href={% url "babybuddy:root-router" %}>
<img src="{% static "babybuddy/logo/icon-brand.png" %}" width="30" height="30"
@ -13,14 +13,14 @@
</a>
<div class="d-lg-none d-md-none d-flex me-auto p-0 ms-2">
<div>
<a class="text-muted"
<a class="text-body-secondary"
href="{% url 'dashboard:dashboard' %}"
aria-expanded="false"><i class="icon-2x icon-dashboard" aria-hidden="true"></i>
</a>
&nbsp;
</div>
<div>
<a class="text-muted"
<a class="text-body-secondary"
href="{% url 'core:timeline' %}"
aria-expanded="false"><i class="icon-2x icon-timeline" aria-hidden="true"></i>
</a>

View File

@ -8,7 +8,7 @@
{% endblock %}
{% block content %}
<div class="px-2 py-5 bg-dark rounded-3">
<div class="px-2 py-5 bg rounded-3">
<div class="container-fluid">
<h1 class="display-3">{% trans "Welcome to Baby Buddy!" %}</h1>
<p class="lead">

View File

@ -10,7 +10,7 @@
<div class="alert alert-danger" role="alert">
{{ main }} {{ reason }}
</div>
<div class="px-2 py-5 bg-dark rounded-3">
<div class="px-2 py-5 bg rounded-3">
<div class="container-fluid">
<h2>{% trans "How to Fix" %}</h2>
{% blocktrans trimmed with origin=origin %}

View File

@ -12,7 +12,7 @@
{{ form.username.label }}
</label>
<div class="input-group mb-3 fade-in">
<span class="input-group-text text-muted"><i class="icon-user" aria-hidden="true"></i></span>
<span class="input-group-text text-body-secondary"><i class="icon-user" aria-hidden="true"></i></span>
{% render_field form.username name='username' class+='form-control' id='username-input-group' placeholder=form.username.label %}
</div>
@ -20,7 +20,7 @@
{{ form.password.label }}
</label>
<div class="input-group mb-3 fade-in">
<span class="input-group-text text-muted"><i class="icon-lock" aria-hidden="true"></i></span>
<span class="input-group-text text-body-secondary"><i class="icon-lock" aria-hidden="true"></i></span>
{% render_field form.password name='password' class+='form-control' id='password-input-group' placeholder=form.password.label %}
</div>

View File

@ -26,7 +26,7 @@
{{ form.new_password1.label }}
</label>
<div class="input-group mb-3 fade-in">
<span class="input-group-text text-muted"><i class="icon-lock" aria-hidden="true"></i></span>
<span class="input-group-text text-body-secondary"><i class="icon-lock" aria-hidden="true"></i></span>
{% render_field form.new_password1 name='new_password1' class+='form-control' id='password1-input-group' %}
</div>
@ -34,7 +34,7 @@
{{ form.new_password2.label }}
</label>
<div class="input-group mb-3 fade-in">
<span class="input-group-text text-muted"><i class="icon-lock" aria-hidden="true"></i></span>
<span class="input-group-text text-body-secondary"><i class="icon-lock" aria-hidden="true"></i></span>
{% render_field form.new_password2 name='new_password2' class+='form-control' id='password2-input-group' %}
</div>

View File

@ -21,7 +21,7 @@
{{ form.email.label }}
</label>
<div class="input-group mb-3 fade-in">
<span class="input-group-text text-muted"><i class="icon-mail" aria-hidden="true"></i></span>
<span class="input-group-text text-body-secondary"><i class="icon-mail" aria-hidden="true"></i></span>
{% render_field form.email name='email' class+='form-control' id='email-input-group' placeholder=form.email.label %}
</div>

View File

@ -10,7 +10,7 @@
{% endblock %}
{% block content %}
<div class="p-5 mb-4 bg-dark rounded-3 text-center">
<div class="p-5 mb-4 bg rounded-3 text-center">
<div class="container-fluid py-1">
<h1 id="timer-status"
class="display-1">
@ -20,7 +20,7 @@
</h1>
{% if timer.child and CHILD_COUNT > 1 %}
<h2 class="text-muted">
<h2 class="text-body-secondary">
{{ timer.child }}
</h2>
{% endif %}
@ -28,7 +28,7 @@
<p class="lead text-secondary">
{% trans "Started" %} {{ object.start }}
</p>
<p class="text-muted">
<p class="text-body-secondary">
{% blocktrans trimmed with user=object.user_username %}
{{ timer }} created by {{ user }}
{% endblocktrans %}

View File

@ -20,7 +20,7 @@
<div class="new-tags">
<div class="create-tag-inputs input-group">
<input class="form-control" type="text" name="" placeholder="{% trans "Tag name" %}">
<button id="add-tag" class="btn btn-outline-primary bg-dark" type="button">{% trans "Add" %}</button>
<button id="add-tag" class="btn btn-outline-primary bg" type="button">{% trans "Add" %}</button>
</div>
{% if widget.tag_suggestions.quick %}
<span>{% trans "Recently used:" %}</span>

View File

@ -34,7 +34,7 @@
</div>
{% endif %}
</div>
<div class="card-footer text-muted">
<div class="card-footer text-body-secondary">
{% blocktrans trimmed with since=object.time|timesince time=object.time|time %}
{{ since }} ago ({{ time }})
{% endblocktrans %}

View File

@ -18,11 +18,10 @@
{% block content %}
{% for key, info in stats.items %}
{% if info.wet > 0 or info.solid > 0 or info.empty > 0 %}
<div class="progress mt-3">
<div class="progress mt-3" role="progressbar">
{% if info.wet_pct > 0 %}
<div class="progress-bar bg-primary lead"
role="progressbar"
style="width: {{ info.wet_pct|safe }}%;">
{{ info.wet|floatformat:'0' }}&nbsp;{% trans "wet" %}
</div>
@ -30,7 +29,6 @@
{% if info.solid_pct > 0 %}
<div class="progress-bar bg-secondary lead"
role="progressbar"
style="width: {{ info.solid_pct|safe }}%;">
{{ info.solid|floatformat:'0' }}&nbsp;{% trans "solid" %}
</div>
@ -38,7 +36,6 @@
{% if info.empty_pct > 0 %}
<div class="progress-bar bg-transparent lead"
role="progressbar"
style="width: {{ info.empty_pct|safe }}%;">
{{ info.empty|floatformat:'0' }}
</div>

View File

@ -30,7 +30,7 @@
{% endif %}
</div>
{% blocktrans trimmed with since=feeding.date.date|dayssince %}
<div class="text-center small text-muted">
<div class="text-center small text-body-secondary">
{{ since }}
</div>
{% endblocktrans %}

View File

@ -14,7 +14,7 @@
{% for feeding in feedings %}
<div class="carousel-item{% if forloop.counter == feedings|length %} active{% endif %}">
<div class="last-feeding-method text-center">{{ feeding.get_method_display }}</div>
<div class="text-center small text-muted">
<div class="text-center small text-body-secondary">
{% if forloop.last %}
{% trans "most recent" %}
{% else %}

View File

@ -30,7 +30,7 @@
{% endif %}
</div>
{% blocktrans trimmed with since=sleep.date.date|dayssince %}
<div class="text-center small text-muted">
<div class="text-center small text-body-secondary">
{{ since }}
</div>
{% endblocktrans %}

View File

@ -23,7 +23,7 @@
<a href="{% url 'core:timer-detail' timer.id %}"
class="list-group-item list-group-item-action">
<strong>{{ timer.title_with_child }}</strong>
<p class="text-muted small m-0">
<p class="text-body-secondary small m-0">
{% blocktrans trimmed with start=timer.start|time user=timer.user_username %}
Started by {{ user }} at {{ start }}
{% endblocktrans %}

View File

@ -16,7 +16,7 @@
{% endblock %}
{% block listgroup %}
<ul class="list-group list-group-flush text-muted small">
<ul class="list-group list-group-flush text-body-secondary small">
{% for instance in instances %}
<li class="list-group-item">
{% blocktrans trimmed with duration=instance.duration|duration_string end=instance.end|time %}

View File

@ -1,6 +1,6 @@
{% load i18n %}
<div class="child-actions btn-group btn-group-lg border rounded border-light bg-dark center-block" role="group" aria-label="{% trans "Child actions" %}">
<div class="child-actions btn-group btn-group-lg border rounded border-light bg center-block" role="group" aria-label="{% trans "Child actions" %}">
{% if perms.core.view_child %}
<a href="{% url 'dashboard:dashboard-child' object.slug %}" class="btn" title="{% trans "Dashboard" %}">

View File

@ -12,7 +12,7 @@
{% if html %}
{{ html|safe }}
{% else %}
<div class="px-2 py-5 bg-dark rounded-3 text-center display-5">
<div class="px-2 py-5 bg rounded-3 text-center display-5">
<div class="container-fluid">
<i class="icon-sad" aria-hidden="true"></i>
{% trans "There is not enough data to generate this report." %}

View File

@ -78,18 +78,18 @@
--bs-body-font-size: 1rem;
--bs-body-font-weight: 400;
--bs-body-line-height: 1.5;
--bs-body-color: #ced4da;
--bs-body-color-rgb: 206, 212, 218;
--bs-body-bg: #212529;
--bs-body-bg-rgb: 33, 37, 41;
--bs-body-color: #212529;
--bs-body-color-rgb: 33, 37, 41;
--bs-body-bg: #fff;
--bs-body-bg-rgb: 255, 255, 255;
--bs-emphasis-color: #000;
--bs-emphasis-color-rgb: 0, 0, 0;
--bs-secondary-color: rgba(206, 212, 218, 0.75);
--bs-secondary-color-rgb: 206, 212, 218;
--bs-secondary-color: rgba(33, 37, 41, 0.75);
--bs-secondary-color-rgb: 33, 37, 41;
--bs-secondary-bg: #e9ecef;
--bs-secondary-bg-rgb: 233, 236, 239;
--bs-tertiary-color: rgba(206, 212, 218, 0.5);
--bs-tertiary-color-rgb: 206, 212, 218;
--bs-tertiary-color: rgba(33, 37, 41, 0.5);
--bs-tertiary-color-rgb: 33, 37, 41;
--bs-tertiary-bg: #f8f9fa;
--bs-tertiary-bg-rgb: 248, 249, 250;
--bs-heading-color: inherit;
@ -99,7 +99,7 @@
--bs-link-hover-color: #219cb4;
--bs-link-hover-color-rgb: 33, 156, 180;
--bs-code-color: #d63384;
--bs-highlight-bg: #fcf8e3;
--bs-highlight-bg: #fff3cd;
--bs-border-width: 1px;
--bs-border-style: solid;
--bs-border-color: #e9ecef;
@ -207,7 +207,7 @@ hr {
margin: 1rem 0;
color: inherit;
border: 0;
border-top: var(--bs-border-width) solid rgba(0, 0, 0, 0.1);
border-top: var(--bs-border-width) solid;
opacity: 0.25;
}
@ -2108,10 +2108,10 @@ progress {
font-size: 1rem;
font-weight: 400;
line-height: 1.5;
color: #000;
background-color: #fff;
color: var(--bs-body-color);
background-color: var(--bs-body-bg);
background-clip: padding-box;
border: var(--bs-border-width) solid rgba(108, 117, 125, 0.15);
border: var(--bs-border-width) solid var(--bs-border-color);
appearance: none;
border-radius: var(--bs-border-radius);
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
@ -2128,8 +2128,8 @@ progress {
cursor: pointer;
}
.form-control:focus {
color: #000;
background-color: #fff;
color: var(--bs-body-color);
background-color: var(--bs-body-bg);
border-color: #9bd5f4;
outline: 0;
box-shadow: 0 0 0 0.25rem rgba(55, 171, 233, 0.25);
@ -2148,14 +2148,14 @@ progress {
opacity: 1;
}
.form-control:disabled {
background-color: #6c757d;
background-color: var(--bs-secondary-bg);
opacity: 1;
}
.form-control::file-selector-button {
padding: 0.375rem 0.75rem;
margin: -0.375rem -0.75rem;
margin-inline-end: 0.75rem;
color: #000;
color: var(--bs-body-color);
background-color: var(--bs-tertiary-bg);
pointer-events: none;
border-color: inherit;
@ -2258,13 +2258,13 @@ textarea.form-control-lg {
font-size: 1rem;
font-weight: 400;
line-height: 1.5;
color: #000;
background-color: #fff;
color: var(--bs-body-color);
background-color: var(--bs-body-bg);
background-image: var(--bs-form-select-bg-img), var(--bs-form-select-bg-icon, none);
background-repeat: no-repeat;
background-position: right 0.75rem center;
background-size: 16px 12px;
border: var(--bs-border-width) solid rgba(108, 117, 125, 0.15);
border: var(--bs-border-width) solid var(--bs-border-color);
border-radius: var(--bs-border-radius);
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
appearance: none;
@ -2284,11 +2284,11 @@ textarea.form-control-lg {
background-image: none;
}
.form-select:disabled {
background-color: #6c757d;
background-color: var(--bs-secondary-bg);
}
.form-select:-moz-focusring {
color: transparent;
text-shadow: 0 0 0 #000;
text-shadow: 0 0 0 var(--bs-body-color);
}
.form-select-sm {
@ -2334,7 +2334,7 @@ textarea.form-control-lg {
}
.form-check-input {
--bs-form-check-bg: #fff;
--bs-form-check-bg: var(--bs-body-bg);
width: 1em;
height: 1em;
margin-top: 0.25em;
@ -2451,10 +2451,10 @@ textarea.form-control-lg {
outline: 0;
}
.form-range:focus::-webkit-slider-thumb {
box-shadow: 0 0 0 1px #212529, 0 0 0 0.25rem rgba(55, 171, 233, 0.25);
box-shadow: 0 0 0 1px #fff, 0 0 0 0.25rem rgba(55, 171, 233, 0.25);
}
.form-range:focus::-moz-range-thumb {
box-shadow: 0 0 0 1px #212529, 0 0 0 0.25rem rgba(55, 171, 233, 0.25);
box-shadow: 0 0 0 1px #fff, 0 0 0 0.25rem rgba(55, 171, 233, 0.25);
}
.form-range::-moz-focus-outer {
border: 0;
@ -2592,7 +2592,7 @@ textarea.form-control-lg {
z-index: -1;
height: 1.5em;
content: "";
background-color: #fff;
background-color: var(--bs-body-bg);
border-radius: var(--bs-border-radius);
}
.form-floating > .form-control:-webkit-autofill ~ label {
@ -2606,7 +2606,7 @@ textarea.form-control-lg {
color: #6c757d;
}
.form-floating > :disabled ~ label::after {
background-color: #6c757d;
background-color: var(--bs-secondary-bg);
}
.input-group {
@ -2644,11 +2644,11 @@ textarea.form-control-lg {
font-size: 1rem;
font-weight: 400;
line-height: 1.5;
color: #000;
color: var(--bs-body-color);
text-align: center;
white-space: nowrap;
background-color: #adb5bd;
border: var(--bs-border-width) solid rgba(108, 117, 125, 0.15);
background-color: var(--bs-tertiary-bg);
border: var(--bs-border-width) solid var(--bs-border-color);
border-radius: var(--bs-border-radius);
}
@ -3334,23 +3334,23 @@ textarea.form-control-lg {
--bs-dropdown-spacer: 0.125rem;
--bs-dropdown-font-size: 1rem;
--bs-dropdown-color: var(--bs-body-color);
--bs-dropdown-bg: #495057;
--bs-dropdown-bg: var(--bs-body-bg);
--bs-dropdown-border-color: var(--bs-border-color-translucent);
--bs-dropdown-border-radius: var(--bs-border-radius);
--bs-dropdown-border-width: var(--bs-border-width);
--bs-dropdown-inner-border-radius: calc(var(--bs-border-radius) - var(--bs-border-width));
--bs-dropdown-divider-bg: #343a40;
--bs-dropdown-divider-bg: var(--bs-border-color-translucent);
--bs-dropdown-divider-margin-y: 0.5rem;
--bs-dropdown-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
--bs-dropdown-link-color: #ced4da;
--bs-dropdown-link-hover-color: #bfc7cf;
--bs-dropdown-link-hover-bg: #37abe9;
--bs-dropdown-link-color: var(--bs-body-color);
--bs-dropdown-link-hover-color: var(--bs-body-color);
--bs-dropdown-link-hover-bg: var(--bs-tertiary-bg);
--bs-dropdown-link-active-color: #ced4da;
--bs-dropdown-link-active-bg: #37abe9;
--bs-dropdown-link-disabled-color: var(--bs-tertiary-color);
--bs-dropdown-item-padding-x: 1rem;
--bs-dropdown-item-padding-y: 0.25rem;
--bs-dropdown-header-color: #8594a3;
--bs-dropdown-header-color: #6c757d;
--bs-dropdown-header-padding-x: 1rem;
--bs-dropdown-header-padding-y: 0.5rem;
position: absolute;
@ -3608,7 +3608,7 @@ textarea.form-control-lg {
--bs-dropdown-box-shadow: ;
--bs-dropdown-link-color: #dee2e6;
--bs-dropdown-link-hover-color: #fff;
--bs-dropdown-divider-bg: #343a40;
--bs-dropdown-divider-bg: var(--bs-border-color-translucent);
--bs-dropdown-link-hover-bg: rgba(255, 255, 255, 0.15);
--bs-dropdown-link-active-color: #ced4da;
--bs-dropdown-link-active-bg: #37abe9;
@ -3876,7 +3876,7 @@ textarea.form-control-lg {
--bs-navbar-toggler-padding-y: 0.25rem;
--bs-navbar-toggler-padding-x: 0.75rem;
--bs-navbar-toggler-font-size: 1.25rem;
--bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28206, 212, 218, 0.75%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
--bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%2833, 37, 41, 0.75%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
--bs-navbar-toggler-border-color: rgba(var(--bs-emphasis-color-rgb), 0.15);
--bs-navbar-toggler-border-radius: var(--bs-border-radius);
--bs-navbar-toggler-focus-width: 0.25rem;
@ -4299,11 +4299,11 @@ textarea.form-control-lg {
--bs-card-inner-border-radius: calc(var(--bs-border-radius) - (var(--bs-border-width)));
--bs-card-cap-padding-y: 0.5rem;
--bs-card-cap-padding-x: 1rem;
--bs-card-cap-bg: rgba(248, 249, 250, 0.05);
--bs-card-cap-bg: rgba(var(--bs-body-color-rgb), 0.03);
--bs-card-cap-color: ;
--bs-card-height: ;
--bs-card-color: ;
--bs-card-bg: #343a40;
--bs-card-bg: var(--bs-body-bg);
--bs-card-img-overlay-padding: 1rem;
--bs-card-group-margin: 0.75rem;
position: relative;
@ -4485,7 +4485,7 @@ textarea.form-control-lg {
--bs-accordion-btn-padding-y: 1rem;
--bs-accordion-btn-color: var(--bs-body-color);
--bs-accordion-btn-bg: var(--bs-accordion-bg);
--bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ced4da'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
--bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
--bs-accordion-btn-icon-width: 1.25rem;
--bs-accordion-btn-icon-transform: rotate(-180deg);
--bs-accordion-btn-icon-transition: transform 0.2s ease-in-out;
@ -4617,11 +4617,11 @@ textarea.form-control-lg {
--bs-breadcrumb-padding-x: 1rem;
--bs-breadcrumb-padding-y: 0.75rem;
--bs-breadcrumb-margin-bottom: 1rem;
--bs-breadcrumb-bg: none;
--bs-breadcrumb-bg: ;
--bs-breadcrumb-border-radius: ;
--bs-breadcrumb-divider-color: var(--bs-secondary-color);
--bs-breadcrumb-item-padding-x: 0.5rem;
--bs-breadcrumb-item-active-color: #6c757d;
--bs-breadcrumb-item-active-color: var(--bs-secondary-color);
display: flex;
flex-wrap: wrap;
padding: var(--bs-breadcrumb-padding-y) var(--bs-breadcrumb-padding-x);
@ -4649,23 +4649,23 @@ textarea.form-control-lg {
--bs-pagination-padding-x: 0.75rem;
--bs-pagination-padding-y: 0.375rem;
--bs-pagination-font-size: 1rem;
--bs-pagination-color: #44c4dd;
--bs-pagination-bg: #343a40;
--bs-pagination-color: var(--bs-link-color);
--bs-pagination-bg: var(--bs-body-bg);
--bs-pagination-border-width: var(--bs-border-width);
--bs-pagination-border-color: #3f474e;
--bs-pagination-border-color: var(--bs-border-color);
--bs-pagination-border-radius: var(--bs-border-radius);
--bs-pagination-hover-color: #219cb4;
--bs-pagination-hover-bg: #212529;
--bs-pagination-hover-border-color: #343a40;
--bs-pagination-hover-color: var(--bs-link-hover-color);
--bs-pagination-hover-bg: var(--bs-tertiary-bg);
--bs-pagination-hover-border-color: var(--bs-border-color);
--bs-pagination-focus-color: var(--bs-link-hover-color);
--bs-pagination-focus-bg: var(--bs-secondary-bg);
--bs-pagination-focus-box-shadow: 0 0 0 0.25rem rgba(55, 171, 233, 0.25);
--bs-pagination-active-color: #ced4da;
--bs-pagination-active-bg: #37abe9;
--bs-pagination-active-border-color: #37abe9;
--bs-pagination-disabled-color: #6c757d;
--bs-pagination-disabled-bg: #343a40;
--bs-pagination-disabled-border-color: #3f474e;
--bs-pagination-disabled-color: var(--bs-secondary-color);
--bs-pagination-disabled-bg: var(--bs-secondary-bg);
--bs-pagination-disabled-border-color: var(--bs-border-color);
display: flex;
padding-left: 0;
list-style: none;
@ -4869,7 +4869,7 @@ textarea.form-control-lg {
.progress-stacked {
--bs-progress-height: 1rem;
--bs-progress-font-size: 0.75rem;
--bs-progress-bg: #6c757d;
--bs-progress-bg: var(--bs-secondary-bg);
--bs-progress-border-radius: var(--bs-border-radius);
--bs-progress-box-shadow: var(--bs-box-shadow-inset);
--bs-progress-bar-color: #fff;
@ -4924,19 +4924,19 @@ textarea.form-control-lg {
.list-group {
--bs-list-group-color: var(--bs-body-color);
--bs-list-group-bg: #343a40;
--bs-list-group-bg: var(--bs-body-bg);
--bs-list-group-border-color: var(--bs-border-color);
--bs-list-group-border-width: var(--bs-border-width);
--bs-list-group-border-radius: var(--bs-border-radius);
--bs-list-group-item-padding-x: 1rem;
--bs-list-group-item-padding-y: 0.5rem;
--bs-list-group-action-color: #ced4da;
--bs-list-group-action-hover-color: #ced4da;
--bs-list-group-action-hover-bg: #292d32;
--bs-list-group-action-color: var(--bs-secondary-color);
--bs-list-group-action-hover-color: var(--bs-emphasis-color);
--bs-list-group-action-hover-bg: var(--bs-tertiary-bg);
--bs-list-group-action-active-color: var(--bs-body-color);
--bs-list-group-action-active-bg: var(--bs-secondary-bg);
--bs-list-group-disabled-color: var(--bs-secondary-color);
--bs-list-group-disabled-bg: #343a40;
--bs-list-group-disabled-bg: var(--bs-body-bg);
--bs-list-group-active-color: #ced4da;
--bs-list-group-active-bg: #37abe9;
--bs-list-group-active-border-color: #37abe9;
@ -12079,7 +12079,7 @@ textarea.form-control-lg {
margin-bottom: 0;
}
.card-dashboard .card-body .card-text {
color: #6c757d;
color: var(--bs-secondary-color);
}
.card-dashboard .card-body .carousel {
margin-left: -1rem;

Binary file not shown.

View File

@ -78,18 +78,18 @@
--bs-body-font-size: 1rem;
--bs-body-font-weight: 400;
--bs-body-line-height: 1.5;
--bs-body-color: #ced4da;
--bs-body-color-rgb: 206, 212, 218;
--bs-body-bg: #212529;
--bs-body-bg-rgb: 33, 37, 41;
--bs-body-color: #212529;
--bs-body-color-rgb: 33, 37, 41;
--bs-body-bg: #fff;
--bs-body-bg-rgb: 255, 255, 255;
--bs-emphasis-color: #000;
--bs-emphasis-color-rgb: 0, 0, 0;
--bs-secondary-color: rgba(206, 212, 218, 0.75);
--bs-secondary-color-rgb: 206, 212, 218;
--bs-secondary-color: rgba(33, 37, 41, 0.75);
--bs-secondary-color-rgb: 33, 37, 41;
--bs-secondary-bg: #e9ecef;
--bs-secondary-bg-rgb: 233, 236, 239;
--bs-tertiary-color: rgba(206, 212, 218, 0.5);
--bs-tertiary-color-rgb: 206, 212, 218;
--bs-tertiary-color: rgba(33, 37, 41, 0.5);
--bs-tertiary-color-rgb: 33, 37, 41;
--bs-tertiary-bg: #f8f9fa;
--bs-tertiary-bg-rgb: 248, 249, 250;
--bs-heading-color: inherit;
@ -99,7 +99,7 @@
--bs-link-hover-color: #219cb4;
--bs-link-hover-color-rgb: 33, 156, 180;
--bs-code-color: #d63384;
--bs-highlight-bg: #fcf8e3;
--bs-highlight-bg: #fff3cd;
--bs-border-width: 1px;
--bs-border-style: solid;
--bs-border-color: #e9ecef;
@ -207,7 +207,7 @@ hr {
margin: 1rem 0;
color: inherit;
border: 0;
border-top: var(--bs-border-width) solid rgba(0, 0, 0, 0.1);
border-top: var(--bs-border-width) solid;
opacity: 0.25;
}
@ -2108,10 +2108,10 @@ progress {
font-size: 1rem;
font-weight: 400;
line-height: 1.5;
color: #000;
background-color: #fff;
color: var(--bs-body-color);
background-color: var(--bs-body-bg);
background-clip: padding-box;
border: var(--bs-border-width) solid rgba(108, 117, 125, 0.15);
border: var(--bs-border-width) solid var(--bs-border-color);
appearance: none;
border-radius: var(--bs-border-radius);
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
@ -2128,8 +2128,8 @@ progress {
cursor: pointer;
}
.form-control:focus {
color: #000;
background-color: #fff;
color: var(--bs-body-color);
background-color: var(--bs-body-bg);
border-color: #9bd5f4;
outline: 0;
box-shadow: 0 0 0 0.25rem rgba(55, 171, 233, 0.25);
@ -2148,14 +2148,14 @@ progress {
opacity: 1;
}
.form-control:disabled {
background-color: #6c757d;
background-color: var(--bs-secondary-bg);
opacity: 1;
}
.form-control::file-selector-button {
padding: 0.375rem 0.75rem;
margin: -0.375rem -0.75rem;
margin-inline-end: 0.75rem;
color: #000;
color: var(--bs-body-color);
background-color: var(--bs-tertiary-bg);
pointer-events: none;
border-color: inherit;
@ -2258,13 +2258,13 @@ textarea.form-control-lg {
font-size: 1rem;
font-weight: 400;
line-height: 1.5;
color: #000;
background-color: #fff;
color: var(--bs-body-color);
background-color: var(--bs-body-bg);
background-image: var(--bs-form-select-bg-img), var(--bs-form-select-bg-icon, none);
background-repeat: no-repeat;
background-position: right 0.75rem center;
background-size: 16px 12px;
border: var(--bs-border-width) solid rgba(108, 117, 125, 0.15);
border: var(--bs-border-width) solid var(--bs-border-color);
border-radius: var(--bs-border-radius);
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
appearance: none;
@ -2284,11 +2284,11 @@ textarea.form-control-lg {
background-image: none;
}
.form-select:disabled {
background-color: #6c757d;
background-color: var(--bs-secondary-bg);
}
.form-select:-moz-focusring {
color: transparent;
text-shadow: 0 0 0 #000;
text-shadow: 0 0 0 var(--bs-body-color);
}
.form-select-sm {
@ -2334,7 +2334,7 @@ textarea.form-control-lg {
}
.form-check-input {
--bs-form-check-bg: #fff;
--bs-form-check-bg: var(--bs-body-bg);
width: 1em;
height: 1em;
margin-top: 0.25em;
@ -2451,10 +2451,10 @@ textarea.form-control-lg {
outline: 0;
}
.form-range:focus::-webkit-slider-thumb {
box-shadow: 0 0 0 1px #212529, 0 0 0 0.25rem rgba(55, 171, 233, 0.25);
box-shadow: 0 0 0 1px #fff, 0 0 0 0.25rem rgba(55, 171, 233, 0.25);
}
.form-range:focus::-moz-range-thumb {
box-shadow: 0 0 0 1px #212529, 0 0 0 0.25rem rgba(55, 171, 233, 0.25);
box-shadow: 0 0 0 1px #fff, 0 0 0 0.25rem rgba(55, 171, 233, 0.25);
}
.form-range::-moz-focus-outer {
border: 0;
@ -2592,7 +2592,7 @@ textarea.form-control-lg {
z-index: -1;
height: 1.5em;
content: "";
background-color: #fff;
background-color: var(--bs-body-bg);
border-radius: var(--bs-border-radius);
}
.form-floating > .form-control:-webkit-autofill ~ label {
@ -2606,7 +2606,7 @@ textarea.form-control-lg {
color: #6c757d;
}
.form-floating > :disabled ~ label::after {
background-color: #6c757d;
background-color: var(--bs-secondary-bg);
}
.input-group {
@ -2644,11 +2644,11 @@ textarea.form-control-lg {
font-size: 1rem;
font-weight: 400;
line-height: 1.5;
color: #000;
color: var(--bs-body-color);
text-align: center;
white-space: nowrap;
background-color: #adb5bd;
border: var(--bs-border-width) solid rgba(108, 117, 125, 0.15);
background-color: var(--bs-tertiary-bg);
border: var(--bs-border-width) solid var(--bs-border-color);
border-radius: var(--bs-border-radius);
}
@ -3334,23 +3334,23 @@ textarea.form-control-lg {
--bs-dropdown-spacer: 0.125rem;
--bs-dropdown-font-size: 1rem;
--bs-dropdown-color: var(--bs-body-color);
--bs-dropdown-bg: #495057;
--bs-dropdown-bg: var(--bs-body-bg);
--bs-dropdown-border-color: var(--bs-border-color-translucent);
--bs-dropdown-border-radius: var(--bs-border-radius);
--bs-dropdown-border-width: var(--bs-border-width);
--bs-dropdown-inner-border-radius: calc(var(--bs-border-radius) - var(--bs-border-width));
--bs-dropdown-divider-bg: #343a40;
--bs-dropdown-divider-bg: var(--bs-border-color-translucent);
--bs-dropdown-divider-margin-y: 0.5rem;
--bs-dropdown-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
--bs-dropdown-link-color: #ced4da;
--bs-dropdown-link-hover-color: #bfc7cf;
--bs-dropdown-link-hover-bg: #37abe9;
--bs-dropdown-link-color: var(--bs-body-color);
--bs-dropdown-link-hover-color: var(--bs-body-color);
--bs-dropdown-link-hover-bg: var(--bs-tertiary-bg);
--bs-dropdown-link-active-color: #ced4da;
--bs-dropdown-link-active-bg: #37abe9;
--bs-dropdown-link-disabled-color: var(--bs-tertiary-color);
--bs-dropdown-item-padding-x: 1rem;
--bs-dropdown-item-padding-y: 0.25rem;
--bs-dropdown-header-color: #8594a3;
--bs-dropdown-header-color: #6c757d;
--bs-dropdown-header-padding-x: 1rem;
--bs-dropdown-header-padding-y: 0.5rem;
position: absolute;
@ -3608,7 +3608,7 @@ textarea.form-control-lg {
--bs-dropdown-box-shadow: ;
--bs-dropdown-link-color: #dee2e6;
--bs-dropdown-link-hover-color: #fff;
--bs-dropdown-divider-bg: #343a40;
--bs-dropdown-divider-bg: var(--bs-border-color-translucent);
--bs-dropdown-link-hover-bg: rgba(255, 255, 255, 0.15);
--bs-dropdown-link-active-color: #ced4da;
--bs-dropdown-link-active-bg: #37abe9;
@ -3876,7 +3876,7 @@ textarea.form-control-lg {
--bs-navbar-toggler-padding-y: 0.25rem;
--bs-navbar-toggler-padding-x: 0.75rem;
--bs-navbar-toggler-font-size: 1.25rem;
--bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28206, 212, 218, 0.75%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
--bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%2833, 37, 41, 0.75%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
--bs-navbar-toggler-border-color: rgba(var(--bs-emphasis-color-rgb), 0.15);
--bs-navbar-toggler-border-radius: var(--bs-border-radius);
--bs-navbar-toggler-focus-width: 0.25rem;
@ -4299,11 +4299,11 @@ textarea.form-control-lg {
--bs-card-inner-border-radius: calc(var(--bs-border-radius) - (var(--bs-border-width)));
--bs-card-cap-padding-y: 0.5rem;
--bs-card-cap-padding-x: 1rem;
--bs-card-cap-bg: rgba(248, 249, 250, 0.05);
--bs-card-cap-bg: rgba(var(--bs-body-color-rgb), 0.03);
--bs-card-cap-color: ;
--bs-card-height: ;
--bs-card-color: ;
--bs-card-bg: #343a40;
--bs-card-bg: var(--bs-body-bg);
--bs-card-img-overlay-padding: 1rem;
--bs-card-group-margin: 0.75rem;
position: relative;
@ -4485,7 +4485,7 @@ textarea.form-control-lg {
--bs-accordion-btn-padding-y: 1rem;
--bs-accordion-btn-color: var(--bs-body-color);
--bs-accordion-btn-bg: var(--bs-accordion-bg);
--bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ced4da'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
--bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
--bs-accordion-btn-icon-width: 1.25rem;
--bs-accordion-btn-icon-transform: rotate(-180deg);
--bs-accordion-btn-icon-transition: transform 0.2s ease-in-out;
@ -4617,11 +4617,11 @@ textarea.form-control-lg {
--bs-breadcrumb-padding-x: 1rem;
--bs-breadcrumb-padding-y: 0.75rem;
--bs-breadcrumb-margin-bottom: 1rem;
--bs-breadcrumb-bg: none;
--bs-breadcrumb-bg: ;
--bs-breadcrumb-border-radius: ;
--bs-breadcrumb-divider-color: var(--bs-secondary-color);
--bs-breadcrumb-item-padding-x: 0.5rem;
--bs-breadcrumb-item-active-color: #6c757d;
--bs-breadcrumb-item-active-color: var(--bs-secondary-color);
display: flex;
flex-wrap: wrap;
padding: var(--bs-breadcrumb-padding-y) var(--bs-breadcrumb-padding-x);
@ -4649,23 +4649,23 @@ textarea.form-control-lg {
--bs-pagination-padding-x: 0.75rem;
--bs-pagination-padding-y: 0.375rem;
--bs-pagination-font-size: 1rem;
--bs-pagination-color: #44c4dd;
--bs-pagination-bg: #343a40;
--bs-pagination-color: var(--bs-link-color);
--bs-pagination-bg: var(--bs-body-bg);
--bs-pagination-border-width: var(--bs-border-width);
--bs-pagination-border-color: #3f474e;
--bs-pagination-border-color: var(--bs-border-color);
--bs-pagination-border-radius: var(--bs-border-radius);
--bs-pagination-hover-color: #219cb4;
--bs-pagination-hover-bg: #212529;
--bs-pagination-hover-border-color: #343a40;
--bs-pagination-hover-color: var(--bs-link-hover-color);
--bs-pagination-hover-bg: var(--bs-tertiary-bg);
--bs-pagination-hover-border-color: var(--bs-border-color);
--bs-pagination-focus-color: var(--bs-link-hover-color);
--bs-pagination-focus-bg: var(--bs-secondary-bg);
--bs-pagination-focus-box-shadow: 0 0 0 0.25rem rgba(55, 171, 233, 0.25);
--bs-pagination-active-color: #ced4da;
--bs-pagination-active-bg: #37abe9;
--bs-pagination-active-border-color: #37abe9;
--bs-pagination-disabled-color: #6c757d;
--bs-pagination-disabled-bg: #343a40;
--bs-pagination-disabled-border-color: #3f474e;
--bs-pagination-disabled-color: var(--bs-secondary-color);
--bs-pagination-disabled-bg: var(--bs-secondary-bg);
--bs-pagination-disabled-border-color: var(--bs-border-color);
display: flex;
padding-left: 0;
list-style: none;
@ -4869,7 +4869,7 @@ textarea.form-control-lg {
.progress-stacked {
--bs-progress-height: 1rem;
--bs-progress-font-size: 0.75rem;
--bs-progress-bg: #6c757d;
--bs-progress-bg: var(--bs-secondary-bg);
--bs-progress-border-radius: var(--bs-border-radius);
--bs-progress-box-shadow: var(--bs-box-shadow-inset);
--bs-progress-bar-color: #fff;
@ -4924,19 +4924,19 @@ textarea.form-control-lg {
.list-group {
--bs-list-group-color: var(--bs-body-color);
--bs-list-group-bg: #343a40;
--bs-list-group-bg: var(--bs-body-bg);
--bs-list-group-border-color: var(--bs-border-color);
--bs-list-group-border-width: var(--bs-border-width);
--bs-list-group-border-radius: var(--bs-border-radius);
--bs-list-group-item-padding-x: 1rem;
--bs-list-group-item-padding-y: 0.5rem;
--bs-list-group-action-color: #ced4da;
--bs-list-group-action-hover-color: #ced4da;
--bs-list-group-action-hover-bg: #292d32;
--bs-list-group-action-color: var(--bs-secondary-color);
--bs-list-group-action-hover-color: var(--bs-emphasis-color);
--bs-list-group-action-hover-bg: var(--bs-tertiary-bg);
--bs-list-group-action-active-color: var(--bs-body-color);
--bs-list-group-action-active-bg: var(--bs-secondary-bg);
--bs-list-group-disabled-color: var(--bs-secondary-color);
--bs-list-group-disabled-bg: #343a40;
--bs-list-group-disabled-bg: var(--bs-body-bg);
--bs-list-group-active-color: #ced4da;
--bs-list-group-active-bg: #37abe9;
--bs-list-group-active-border-color: #37abe9;
@ -12079,7 +12079,7 @@ textarea.form-control-lg {
margin-bottom: 0;
}
.card-dashboard .card-body .card-text {
color: #6c757d;
color: var(--bs-secondary-color);
}
.card-dashboard .card-body .carousel {
margin-left: -1rem;

Binary file not shown.

Binary file not shown.

File diff suppressed because one or more lines are too long