Fixed more themes and styles/types

This commit is contained in:
Igor Scheller 2021-08-05 01:00:12 +02:00
parent a36e142f28
commit 6cfeedc57a
38 changed files with 178 additions and 59 deletions

View File

@ -160,7 +160,7 @@ return [
4 => [ 4 => [
'name' => 'Engelsystem 33c3 (2016)', 'name' => 'Engelsystem 33c3 (2016)',
'type' => 'dark', 'type' => 'dark',
'navbar_classes' => 'navbar-dark bg-darker border-dark', 'navbar_classes' => 'navbar-dark bg-body border-dark',
], ],
3 => [ 3 => [
'name' => 'Engelsystem 32c3 (2015)', 'name' => 'Engelsystem 32c3 (2015)',

View File

@ -29,15 +29,13 @@ function form_spinner($name, $label, $value)
return form_element($label, ' return form_element($label, '
<div class="input-group"> <div class="input-group">
<input id="spinner-' . $name . '" class="form-control" name="' . $name . '" value="' . $value . '" /> <input id="spinner-' . $name . '" class="form-control" name="' . $name . '" value="' . $value . '" />
<div class="input-group-btn"> <button id="spinner-' . $name . '-down" class="btn btn-secondary" type="button">
<button id="spinner-' . $name . '-down" class="btn btn-primary" type="button">
' . icon('dash-lg') . ' ' . icon('dash-lg') . '
</button> </button>
<button id="spinner-' . $name . '-up" class="btn btn-primary" type="button"> <button id="spinner-' . $name . '-up" class="btn btn-secondary" type="button">
' . icon('plus-lg') . ' ' . icon('plus-lg') . '
</button> </button>
</div> </div>
</div>
<script type="text/javascript"> <script type="text/javascript">
$(\'#spinner-' . $name . '-down\').click(function() { $(\'#spinner-' . $name . '-down\').click(function() {
var spinner = $(\'#spinner-' . $name . '\'); var spinner = $(\'#spinner-' . $name . '\');
@ -72,7 +70,7 @@ function form_date($name, $label, $value, $start_date = '', $end_date = '')
return form_element($label, ' return form_element($label, '
<div class="input-group date" id="' . $dom_id . '" data-min-date="' . $start_date . '" data-max-date="' . $end_date . '"> <div class="input-group date" id="' . $dom_id . '" data-min-date="' . $start_date . '" data-max-date="' . $end_date . '">
<input type="date" placeholder="YYYY-MM-DD" name="' . $name . '" class="form-control" value="' . htmlspecialchars($value) . '" autocomplete="off">' <input type="date" placeholder="YYYY-MM-DD" name="' . $name . '" class="form-control" value="' . htmlspecialchars($value) . '" autocomplete="off">'
. '<span class="input-group-addon">' . icon('grid-3x3-gap-fill') . '</span> . '<span class="input-group-text">' . icon('grid-3x3-gap-fill') . '</span>
</div> </div>
', $dom_id); ', $dom_id);
} }

View File

@ -1,5 +1,7 @@
<?php <?php
use Illuminate\Support\Str;
/** /**
* Render a stat for dashborad (big number with label). * Render a stat for dashborad (big number with label).
* If no style given, style is danger if number > 0, and success if number == 0. * If no style given, style is danger if number > 0, and success if number == 0.
@ -391,7 +393,11 @@ function render_table($columns, $rows, $data = true)
*/ */
function button($href, $label, $class = '') function button($href, $label, $class = '')
{ {
return '<a href="' . $href . '" class="btn btn-secondary ' . $class . '">' . $label . '</a>'; if (!Str::contains(Str::remove(['btn-sm', 'btn-xl'], $class), 'btn-')) {
$class = 'btn-secondary' . ($class ? ' ' . $class : '');
}
return '<a href="' . $href . '" class="btn ' . $class . '">' . $label . '</a>';
} }
/** /**

View File

@ -60,6 +60,14 @@ body {
mask-size: cover; mask-size: cover;
} }
.text-light .icon-icon_angel {
background-color: map.get($theme-colors, "light");
}
.dark .icon-icon_angel {
background-color: map.get($theme-colors, "dark");
}
a .icon-icon_angel { a .icon-icon_angel {
background-color: $link-color; background-color: $link-color;
} }
@ -278,11 +286,11 @@ span.ref-id[id] {
.card-header { .card-header {
&.bg-dark { &.bg-dark {
color: map.get($theme-colors, "light");; color: map.get($theme-colors, "light");
} }
&.bg-light { &.bg-light {
color: map.get($theme-colors, "dark");; color: map.get($theme-colors, "dark");
} }
} }

View File

@ -0,0 +1,33 @@
// Used for shift overview cards headers
@each $state, $value in $theme-colors {
$card-background: darken($value, 35%);
$card-border: $value;
$card-color: $value;
@if (contrast-ratio($card-background, $card-color) < $min-contrast-ratio*.7) {
$card-color: mix($value, color-contrast($card-background), 40%);
}
.card.bg-#{"" + $state} .card-header {
background-color: $card-background;
border-color: $card-border;
.badge.bg-light {
background-color: $card-color !important;
}
.badge.text-#{"" + $state} {
color: $card-background !important;
}
a.text-white {
color: $card-color !important;
}
.btn-#{"" + $state} {
background-color: $card-background;
border-color: $card-border !important;
color: $card-color;
}
}
}

View File

@ -50,10 +50,10 @@ $danger: #d9534f !default;
//## Settings for some of the most global styles. //## Settings for some of the most global styles.
$body-bg: #060606 !default; $body-bg: #060606 !default;
$body-color: $gray-light; $body-color: $gray-light !default;
//** Global text color on `<body>`. //** Global text color on `<body>`.
$text-color: $gray-light; $text-color: $gray-light !default;
$text-muted: $gray-light !default; $text-muted: $gray-light !default;
//** Global textual link color. //** Global textual link color.

View File

@ -0,0 +1,3 @@
// All dark themes
$input-group-addon-color: #222;
$input-disabled-bg: #111;

View File

@ -0,0 +1,7 @@
// All light themes
$secondary: #bec4ce;
.btn.btn-secondary {
background-color: rgba(255, 255, 255, 0.3);
}

View File

@ -1,4 +1,5 @@
// light theme // light theme
@import "light";
$primary: #337ab7; $primary: #337ab7;
$light: #f5f5f5; $light: #f5f5f5;

View File

@ -1,6 +1,8 @@
// Variables // Variables
// -------------------------------------------------- // --------------------------------------------------
@import "dark";
//== changed Colors //== changed Colors
$gray-darker: #222; $gray-darker: #222;

View File

@ -2,6 +2,7 @@
// Variables // Variables
// -------------------------------------------------- // --------------------------------------------------
@import "dark";
//== changed Colors //== changed Colors
@ -18,6 +19,7 @@ $text-muted: $primary;
@import "cyborg_styles.scss"; @import "cyborg_styles.scss";
// Specials for cccamp19 design // Specials for cccamp19 design
@import "card-glow";
.navbar-brand { .navbar-brand {
.icon-icon_angel { .icon-icon_angel {

View File

@ -1,6 +1,7 @@
// high contrast // high contrast
// Variables // Variables
// -------------------------------------------------- // --------------------------------------------------
@import "dark";
//== Colors //== Colors
@ -23,7 +24,7 @@ $warning: $brand-warning;
//== Scaffolding //== Scaffolding
$body-bg: #000; $body-bg: #000;
$text-color: #fff; $body-color: #fff;
//== Buttons //== Buttons
@ -45,6 +46,8 @@ $btn-warning-border: darken($btn-default-bg, 10%);
$btn-danger-color: #000; $btn-danger-color: #000;
$btn-danger-border: darken($btn-default-bg, 10%); $btn-danger-border: darken($btn-default-bg, 10%);
//= Navigation
$nav-tabs-link-active-color: $gray-lighter;
//== Forms //== Forms
@ -98,5 +101,17 @@ $headings-small-color: $gray-lighter;
// code tag // code tag
code { code {
background-color: $btn-default-bg; background-color: $btn-default-bg;
color: $input-color; color: #fff;
}
.navbar-dark .navbar-nav .nav-link {
color: #fff;
}
.badge {
color: #000 !important;
&.bg-dark {
color: #fff !important;
}
} }

View File

@ -1,6 +1,7 @@
// 36c3 // 36c3
//== Colors //== Colors
@import "dark";
$gray-dark: #282828; $gray-dark: #282828;
$gray-darker: #222; $gray-darker: #222;

View File

@ -1,6 +1,7 @@
// rc3 // rc3 violet
//== Colors //== Colors
@import "dark";
$gray-darker: #100e23; $gray-darker: #100e23;
$gray-dark: lighten($gray-darker, 15%); $gray-dark: lighten($gray-darker, 15%);
@ -12,6 +13,7 @@ $black: #000;
$brand-primary: #6800e7; $brand-primary: #6800e7;
$primary: $brand-primary; $primary: $brand-primary;
$brand-success: #05b9ec; $brand-success: #05b9ec;
$secondary: #3a327e;
$success: $brand-success; $success: $brand-success;
$brand-info: #670295; $brand-info: #670295;
$info: $brand-info; $info: $brand-info;

View File

@ -1,6 +1,7 @@
// rc3 teal // rc3 teal
//== Colors //== Colors
@import "dark";
$gray-darker: #0e1c23; $gray-darker: #0e1c23;
$gray-dark: lighten($gray-darker, 15%); $gray-dark: lighten($gray-darker, 15%);
@ -11,6 +12,7 @@ $black: #000;
$brand-primary: #05b9ec; $brand-primary: #05b9ec;
$primary: $brand-primary; $primary: $brand-primary;
$secondary: #32657e;
$brand-success: #02fae0; $brand-success: #02fae0;
$success: $brand-success; $success: $brand-success;
$brand-info: #025d83; $brand-info: #025d83;
@ -20,7 +22,6 @@ $warning: $brand-warning;
$brand-danger: #b239ff; $brand-danger: #b239ff;
$danger: $brand-danger; $danger: $brand-danger;
//== Scaffolding //== Scaffolding
$body-bg: #000; $body-bg: #000;

View File

@ -55,7 +55,7 @@ $plum: #1f0229;
$dark-green: #00292d; $dark-green: #00292d;
$blue: darken(#009951, 10%); $blue: darken(#009951, 10%);
.label.label-warning, .badge.bg-warning,
.progress-bar.progress-bar-warning { .progress-bar.progress-bar-warning {
color:white; color:white;
} }

View File

@ -1,4 +1,5 @@
// cccamp15 // cccamp15
@import "light";
$brand-primary: #758499; $brand-primary: #758499;
$primary: #758499; $primary: #758499;

View File

@ -1,4 +1,5 @@
// 32c3 (2015) // 32c3 (2015)
@import "light";
$brand-primary: #f19224; $brand-primary: #f19224;
$primary: #f19224; $primary: #f19224;
@ -57,4 +58,12 @@ $navbar-default-brand-hover-bg: #000;
color: #000; color: #000;
} }
.card.bg-info .card-header a {
color: lighten($brand-info, 50%);
&:hover {
color: lighten($brand-info, 50%);
}
}
@import "base.scss"; @import "base.scss";

View File

@ -1,4 +1,5 @@
// 33c3 (2016) // 33c3 (2016)
@import "dark";
// Variables // Variables
@ -20,6 +21,8 @@ $warning: rgb(255, 244, 95);
$brand-danger: rgb(277, 38, 60); $brand-danger: rgb(277, 38, 60);
$danger: rgb(277, 38, 60); $danger: rgb(277, 38, 60);
$text-muted: lighten($gray-light, 25%);
//== changed Scaffolding //== changed Scaffolding
$body-bg: #1d1d1b; $body-bg: #1d1d1b;
@ -86,6 +89,9 @@ $badge-color: #fff;
$headings-small-color: $gray-light; $headings-small-color: $gray-light;
// Navigation tabs
$nav-tabs-link-active-color: $gray-light;
// Bootswatch // Bootswatch
// ----------------------------------------------------- // -----------------------------------------------------
@import "cyborg_variables.scss"; @import "cyborg_variables.scss";
@ -97,6 +103,15 @@ $headings-small-color: $gray-light;
background-color: $btn-default-bg; background-color: $btn-default-bg;
} }
.badge.bg-warning {
color: #000;
}
.card.bg-secondary .card-header,
.card.bg-secondary .card-footer {
color: $gray-lighter;
}
// different code tag // different code tag
code { code {
background-color: $state-info-bg; background-color: $state-info-bg;

View File

@ -1,4 +1,5 @@
// 34c3 light (2017) // 34c3 light (2017)
@import "light";
$brand-primary: rgb(164, 28, 49); $brand-primary: rgb(164, 28, 49);
$primary: rgb(164, 28, 49); $primary: rgb(164, 28, 49);
@ -29,7 +30,7 @@ $state-danger-text: darken($brand-danger,40%);
$state-danger-bg: lighten($brand-danger,40%); $state-danger-bg: lighten($brand-danger,40%);
$state-danger-border: $brand-danger; $state-danger-border: $brand-danger;
.label.label-warning { .badge.bg-warning {
color: #000; color: #000;
} }

View File

@ -1,6 +1,7 @@
// 34c3 dark (2017) // 34c3 dark (2017)
// Variables // Variables
// -------------------------------------------------- // --------------------------------------------------
@import "dark";
//== changed Colors //== changed Colors
@ -20,7 +21,9 @@ $warning: rgb(255, 255, 51);
$brand-danger: rgb(255, 102, 0); $brand-danger: rgb(255, 102, 0);
$danger: rgb(255, 102, 0); $danger: rgb(255, 102, 0);
.label.label-warning, .progress-bar.progress-bar-warning { $secondary: #424242;
.badge.bg-warning, .progress-bar.progress-bar-warning {
color: #000; color: #000;
} }

View File

@ -2,6 +2,7 @@
// Variables // Variables
// -------------------------------------------------- // --------------------------------------------------
@import "dark";
$gray-darker: #000; $gray-darker: #000;
$gray-dark: #000; $gray-dark: #000;
@ -255,7 +256,7 @@ table,
background-image: linear-gradient(to right, rgb(0, 132, 176) , rgb(0, 163, 86)); background-image: linear-gradient(to right, rgb(0, 132, 176) , rgb(0, 163, 86));
} }
.label-warning { .bg-warning {
color: #000; color: #000;
} }

View File

@ -1,6 +1,7 @@
// cccamp19 blue (2019) // cccamp19 blue (2019)
// Variables // Variables
@import "dark";
//== changed Colors //== changed Colors
@ -17,6 +18,7 @@ $text-muted: $primary;
@import "cyborg_styles.scss"; @import "cyborg_styles.scss";
// Specials for cccamp19 design // Specials for cccamp19 design
@import "card-glow";
.navbar-brand { .navbar-brand {
.icon-icon_angel { .icon-icon_angel {

View File

@ -2,6 +2,7 @@
// Variables // Variables
// -------------------------------------------------- // --------------------------------------------------
@import "dark";
//== changed Colors //== changed Colors
@ -18,6 +19,7 @@ $text-muted: $primary;
@import "cyborg_styles.scss"; @import "cyborg_styles.scss";
// Specials for cccamp19 design // Specials for cccamp19 design
@import "card-glow";
.navbar-brand { .navbar-brand {
.icon-icon_angel { .icon-icon_angel {

View File

@ -4,7 +4,7 @@
{% block content_container %} {% block content_container %}
<div class="row"> <div class="row">
<div class="col-sm-6 col-sm-offset-3 error-big"> <div class="col-md-6 offset-md-3 col-lg-4 offset-lg-4 error-big">
<h2> <h2>
4<span class="pulse">:</span>{{ status|slice(1, 2) }} 4<span class="pulse">:</span>{{ status|slice(1, 2) }}
<small class="text-muted">{{ __("No sleep found") }}</small> <small class="text-muted">{{ __("No sleep found") }}</small>

View File

@ -14,7 +14,7 @@
{% if page() in ['news', 'meetings'] and is_user() and has_permission_to('atom') -%} {% if page() in ['news', 'meetings'] and is_user() and has_permission_to('atom') -%}
{% set parameters = {'key': user.api_key} -%} {% set parameters = {'key': user.api_key} -%}
{% if page() == 'meetings' -%} {% if page() == 'meetings' -%}
{% set parameters = parameters|merge({'meetings': 1}) -%} {% set parameters = {'meetings': 1}|merge(parameters) -%}
{% endif %} {% endif %}
<link href="{{ url('atom', parameters) }}" type="application/atom+xml" rel="alternate" title="Atom Feed"> <link href="{{ url('atom', parameters) }}" type="application/atom+xml" rel="alternate" title="Atom Feed">
{% endif %} {% endif %}

View File

@ -31,3 +31,7 @@
{% macro type_bg_class() -%} {% macro type_bg_class() -%}
{% if theme.type == 'light' %}bg-white{% else %}bg-dark{% endif %} {% if theme.type == 'light' %}bg-white{% else %}bg-dark{% endif %}
{%- endmacro %} {%- endmacro %}
{% macro type_text_class() -%}
{% if theme.type == 'light' %}text-dark{% else %}text-light{% endif %}
{%- endmacro %}

View File

@ -79,5 +79,5 @@
{%- endmacro %} {%- endmacro %}
{% macro submit(label, opt) %} {% macro submit(label, opt) %}
{{ _self.button(label|default(__('form.submit')), opt|default({})|merge({'type': 'submit', 'btn_type': 'primary'})) }} {{ _self.button(label|default(__('form.submit')), {'type': 'submit', 'btn_type': 'primary'}|merge(opt|default({}))) }}
{%- endmacro %} {%- endmacro %}

View File

@ -26,7 +26,7 @@
['light', 'dark'], ['light', 'dark'],
['dark', 'light'], ['dark', 'light'],
] %} ] %}
{% set types_buttons=types|merge(['link']) %} {% set types_buttons=['link']|merge(types) %}
{% set shortsum='Lorem ipsum dolor…' %} {% set shortsum='Lorem ipsum dolor…' %}
{% set lipsum='Lorem ipsum dolor sit amet, consectetur adipisici elit…' %} {% set lipsum='Lorem ipsum dolor sit amet, consectetur adipisici elit…' %}
{% set linksum='Lorem ipsum! Dolor <a href="#">link</a> amet, consectetur adipisici elit!' %} {% set linksum='Lorem ipsum! Dolor <a href="#">link</a> amet, consectetur adipisici elit!' %}

View File

@ -51,11 +51,11 @@
<div class="col-md-12"> <div class="col-md-12">
<h2>{{ __('form.preview') }}</h2> <h2>{{ __('form.preview') }}</h2>
<div class="card {% if theme.type =='light' %}bg-light{% else %}bg-secondary{% endif %}"> <div class="card {% if theme.type =='light' %}bg-light{% else %}bg-dark{% endif %}">
<div class="card-header"> <div class="card-header">
{{ faq.question }} {{ faq.question }}
</div> </div>
<div class="card-body {{ m.type_bg_class() }}"> <div class="card-body bg-body">
{{ faq.text|markdown }} {{ faq.text|markdown }}
</div> </div>
</div> </div>

View File

@ -30,7 +30,7 @@
{% for item in items %} {% for item in items %}
<div class="col-md-12 faq"> <div class="col-md-12 faq">
<span id="faq-{{ item.id }}" class="ref-id"></span> <span id="faq-{{ item.id }}" class="ref-id"></span>
<div class="card {% if theme.type =='light' %}bg-light{% else %}bg-secondary{% endif %} mb-4"> <div class="card {% if theme.type =='light' %}bg-light{% else %}bg-dark{% endif %} mb-4">
<h4 class="card-header"> <h4 class="card-header">
{{ item.question }} {{ item.question }}
<small class="text-muted"> <small class="text-muted">
@ -38,11 +38,11 @@
</small> </small>
</h4> </h4>
<div class="card-body {{ m.type_bg_class() }}"> <div class="card-body bg-body">
{{ item.text|markdown }} {{ item.text|markdown }}
</div> </div>
<div class="card-footer d-flex align-items-center"> <div class="card-footer {% if theme.type =='light' %}bg-light{% else %}bg-dark{% endif %} d-flex align-items-center">
<div class="me-3"> <div class="me-3">
{{ m.icon('clock') }} {{ item.updated_at.format(__('Y-m-d H:i')) }} {{ m.icon('clock') }} {{ item.updated_at.format(__('Y-m-d H:i')) }}
</div> </div>

View File

@ -29,8 +29,8 @@
</div> </div>
<div class="row mb-5"> <div class="row mb-5">
<div class="col-sm-6 offset-sm-6 col-md-4 offset-md-4"> <div class="col-md-6 offset-md-3 col-lg-4 offset-lg-4">
<div class="card bg-dark"> <div class="card {{ m.type_bg_class() }}">
<div class="card-body"> <div class="card-body">
{% include 'layouts/parts/messages.twig' %} {% include 'layouts/parts/messages.twig' %}
@ -38,7 +38,7 @@
{{ csrf() }} {{ csrf() }}
<div class="mb-3"> <div class="mb-3">
<div class="input-group input-group-lg"> <div class="input-group input-group-lg">
<span class="input-group-text text-light"> <span class="input-group-text {{ m.type_text_class() }}">
{{ m.angel }} {{ m.angel }}
</span> </span>
<input <input
@ -54,7 +54,7 @@
<div class="mb-3"> <div class="mb-3">
<div class="input-group input-group-lg"> <div class="input-group input-group-lg">
<span class="input-group-text text-light"> <span class="input-group-text {{ m.type_text_class() }}">
<i class="bi bi-key"></i> <i class="bi bi-key"></i>
</span> </span>
<input <input
@ -71,7 +71,8 @@
</div> </div>
{% if config('oauth') is not empty %} {% if config('oauth') is not empty %}
<div class="mb-3 btn-group btn-group-justified"> <div class="row">
<div class="mb-3 btn-group">
{% for name,config in config('oauth') %} {% for name,config in config('oauth') %}
<a href="{{ url('oauth/' ~ name) }}" class="btn btn-primary btn-lg{% if config.hidden|default(false) %} d-none{% endif %}"> <a href="{{ url('oauth/' ~ name) }}" class="btn btn-primary btn-lg{% if config.hidden|default(false) %} d-none{% endif %}">
{{ __( {{ __(
@ -81,6 +82,7 @@
</a> </a>
{% endfor %} {% endfor %}
</div> </div>
</div>
{% endif %} {% endif %}
<div class="text-center"> <div class="text-center">

View File

@ -70,7 +70,7 @@
{% if news.is_meeting %}{{ __('news.is_meeting') }}{% endif %} {% if news.is_meeting %}{{ __('news.is_meeting') }}{% endif %}
{{ news.title }} {{ news.title }}
</div> </div>
<div class="card-body {{ m.type_bg_class() }}"> <div class="card-body bg-body">
{{ news.text|raw|markdown(false) }} {{ news.text|raw|markdown(false) }}
</div> </div>
</div> </div>

View File

@ -17,7 +17,7 @@
<div class="card-body {{ m.type_bg_class() }}"> <div class="card-body {{ m.type_bg_class() }}">
{{ comment.text|nl2br }} {{ comment.text|nl2br }}
</div> </div>
<div class="card-footer text-muted d-flex align-items-center"> <div class="card-footer {% if theme.type =='light' %}bg-light{% else %}bg-dark{% endif %} text-muted d-flex align-items-center">
<div class="me-3"> <div class="me-3">
{{ m.icon('clock') }} {{ m.icon('clock') }}
{{ comment.created_at.format(__('Y-m-d H:i')) }} {{ comment.created_at.format(__('Y-m-d H:i')) }}

View File

@ -48,7 +48,7 @@
{% endblock %} {% endblock %}
{% macro news(news, show_comments_link, is_overview) %} {% macro news(news, show_comments_link, is_overview) %}
<div class="card {% if news.is_meeting %}bg-info{% else %}{% if theme.type =='light' %}bg-light{% else %}bg-secondary{% endif %}{% endif %} mb-4"> <div class="card {% if news.is_meeting %}bg-info{% else %}{% if theme.type =='light' %}bg-light{% else %}bg-dark{% endif %}{% endif %} mb-4">
{% if is_overview|default(false) %} {% if is_overview|default(false) %}
<div class="card-header {% if news.is_meeting and theme.type == 'dark' %}text-white{% endif %}"> <div class="card-header {% if news.is_meeting and theme.type == 'dark' %}text-white{% endif %}">
<a href="{{ url('news/' ~ news.id) }}" class="text-inherit"> <a href="{{ url('news/' ~ news.id) }}" class="text-inherit">
@ -59,11 +59,11 @@
</div> </div>
{% endif %} {% endif %}
<div class="card-body {{ m.type_bg_class() }}"> <div class="card-body bg-body">
{{ news.text|raw|markdown(false) }} {{ news.text|raw|markdown(false) }}
</div> </div>
<div class="card-footer {% if theme.type =='light' %}bg-light{% else %}bg-secondary{% endif %} text-muted"> <div class="card-footer {% if theme.type =='light' %}bg-light{% else %}bg-dark{% endif %} text-muted">
{% if news.updated_at != news.created_at and not is_overview %} {% if news.updated_at != news.created_at and not is_overview %}
<div class="d-flex align-items-center"> <div class="d-flex align-items-center">
<div class="me-3"> <div class="me-3">

View File

@ -56,7 +56,7 @@
<h2>{{ __('form.preview') }}</h2> <h2>{{ __('form.preview') }}</h2>
<div class="card {% if theme.type =='light' %}bg-light{% else %}bg-secondary{% endif %} mb-4"> <div class="card {% if theme.type =='light' %}bg-light{% else %}bg-secondary{% endif %} mb-4">
<div class="card-body {{ m.type_bg_class() }}"> <div class="card-body bg-body">
{{ question.text|nl2br }} {{ question.text|nl2br }}
</div> </div>
</div> </div>
@ -65,7 +65,7 @@
{% if question.answer %} {% if question.answer %}
<div class="col-md-11 offset-md-1"> <div class="col-md-11 offset-md-1">
<div class="card bg-info"> <div class="card bg-info">
<div class="card-body {{ m.type_bg_class() }}"> <div class="card-body bg-body">
{{ question.answer|markdown }} {{ question.answer|markdown }}
</div> </div>
</div> </div>

View File

@ -28,11 +28,11 @@
<div class="row mb-4"> <div class="row mb-4">
<div class="col-md-12"> <div class="col-md-12">
<div class="card {% if theme.type =='light' %}bg-light{% else %}bg-secondary{% endif %}"> <div class="card {% if theme.type =='light' %}bg-light{% else %}bg-secondary{% endif %}">
<div class="card-body {{ m.type_bg_class() }}"> <div class="card-body bg-body">
{{ question.text|nl2br }} {{ question.text|nl2br }}
</div> </div>
<div class="card-footer d-flex align-items-center"> <div class="card-footer {% if theme.type =='light' %}bg-light{% else %}bg-dark{% endif %} d-flex align-items-center">
<div class="me-3"> <div class="me-3">
{{ m.icon('clock') }} {{ question.created_at.format(__('Y-m-d H:i')) }} {{ m.icon('clock') }} {{ question.created_at.format(__('Y-m-d H:i')) }}
</div> </div>
@ -65,10 +65,10 @@
{% if question.answer %} {% if question.answer %}
<div class="col-md-11 offset-md-1 mt-3"> <div class="col-md-11 offset-md-1 mt-3">
<div class="card bg-info"> <div class="card bg-info">
<div class="card-body {{ m.type_bg_class() }}"> <div class="card-body bg-body">
{{ question.answer|markdown }} {{ question.answer|markdown }}
</div> </div>
<div class="card-footer {% if theme.type =='light' %}bg-light{% else %}bg-secondary{% endif %} d-flex align-items-center"> <div class="card-footer {% if theme.type =='light' %}bg-light{% else %}bg-dark{% endif %} d-flex align-items-center">
<div class="me-3"> <div class="me-3">
{{ m.icon('clock') }} {{ question.updated_at.format(__('Y-m-d H:i')) }} {{ m.icon('clock') }} {{ question.updated_at.format(__('Y-m-d H:i')) }}
</div> </div>

View File

@ -39,18 +39,18 @@
</div> </div>
</div> </div>
<div class="form-group d-print-none" style="margin-top: .5em"> <div class="form-group d-print-none" style="margin-top: .5em">
<div class="btn-group"> <div class="btn-group mb-1">
<a href="javascript:setDay(-1)" class="btn btn-secondary ">%set_yesterday%</a> <a href="javascript:setDay(-1)" class="btn btn-secondary ">%set_yesterday%</a>
<a href="javascript:setDay()" class="btn btn-secondary ">%set_today%</a> <a href="javascript:setDay()" class="btn btn-secondary ">%set_today%</a>
<a href="javascript:setDay(1)" class="btn btn-secondary ">%set_tomorrow%</a> <a href="javascript:setDay(1)" class="btn btn-secondary ">%set_tomorrow%</a>
</div> </div>
<div class="btn-group"> <div class="btn-group mb-1">
<a href="javascript:setHours(-8)" class="btn btn-secondary ">%set_last_8h%</a> <a href="javascript:setHours(-8)" class="btn btn-secondary ">%set_last_8h%</a>
<a href="javascript:setHours(-4)" class="btn btn-secondary ">%set_last_4h%</a> <a href="javascript:setHours(-4)" class="btn btn-secondary ">%set_last_4h%</a>
<a href="javascript:setHours(4)" class="btn btn-secondary ">%set_next_4h%</a> <a href="javascript:setHours(4)" class="btn btn-secondary ">%set_next_4h%</a>
<a href="javascript:setHours(8)" class="btn btn-secondary ">%set_next_8h%</a> <a href="javascript:setHours(8)" class="btn btn-secondary ">%set_next_8h%</a>
</div> </div>
<div class="btn-group"> <div class="btn-group mb-1">
%buttons% %buttons%
</div> </div>
</div> </div>