diff --git a/src/plainui/jinja2/plainui/component_gallery.html b/src/plainui/jinja2/plainui/component_gallery.html
index 3214cc05930fd920b74febfbf41216d2f03e6f31..65a1d773b8b3ada00ece26d288439edec583904f 100644
--- a/src/plainui/jinja2/plainui/component_gallery.html
+++ b/src/plainui/jinja2/plainui/component_gallery.html
@@ -214,8 +214,8 @@
<dt class="h2 pb-3 mb-3 border-bottom">Functional Buttons</dt>
<dd class="mb-10 d-flex">
<span class="mr-auto"></span>
- {{ fbtns.share(share_url="URL", color="secondary") }}
- {{ fbtns.fav(fav_id="1", fav_type="assembly", fav_is=true, color="primary") }}
+ {{ fbtns.share(share_url="URL") }}
+ {{ fbtns.fav(fav_id="1", fav_type="assembly", fav_is=true) }}
{{ fbtns.schedule(sch_id="2", sch_is=false) }}
{{ fbtns.stream(stream_url="URL") }}
{{ fbtns.report(report_url="URL") }}
diff --git a/src/plainui/jinja2/plainui/components/function_btns.html b/src/plainui/jinja2/plainui/components/function_btns.html
index 58b6fa58df70fd8192867841c7a24b23ce032b87..0f36ef22984ab60b61cb0d0662b59a13e94c104f 100644
--- a/src/plainui/jinja2/plainui/components/function_btns.html
+++ b/src/plainui/jinja2/plainui/components/function_btns.html
@@ -5,7 +5,7 @@
csrf_input
#}
-{% macro fav(fav_id, fav_type, fav_is, color="secondary", next=request.get_full_path() ) -%}
+{% macro fav(fav_id, fav_type, fav_is, color="transparent", next=request.get_full_path() ) -%}
<form action="{{ url('plainui:modify_favorites') }}" class="d-inline-block" method="POST">
{{ csrf_input }}
<input type="hidden" name="next" value="{{ next ~ '#fav_' ~ fav_id}}">
@@ -32,7 +32,7 @@
</form>
{%- endmacro %}
-{% macro schedule(sch_id, sch_is, color="secondary", next=request.get_full_path() ) -%}
+{% macro schedule(sch_id, sch_is, color="transparent", next=request.get_full_path() ) -%}
<form action="{{ url('plainui:modify_personal_calendar') }}" class="d-inline-block" method="POST">
{{ csrf_input }}
<input type="hidden" name="next" value="{{ next ~ '#sch_' ~ sch_id }}">
@@ -56,7 +56,7 @@
</form>
{%- endmacro %}
-{% macro share(share_url, title=_("share this "), color="secondary" ) -%}
+{% macro share(share_url, title=_("share this "), color="transparent" ) -%}
<a href="{{ share_url }}" class="ml-2 btn-icon-big btn btn-{{ color }}" title="{{ title }}" target="_blank">
<svg width="1rem" height="1rem" viewBox="0 0 16 16" class="bi bi-share" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M13.5 1a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3zM11 2.5a2.5 2.5 0 1 1 .603 1.628l-6.718 3.12a2.499 2.499 0 0 1 0 1.504l6.718 3.12a2.5 2.5 0 1 1-.488.876l-6.718-3.12a2.5 2.5 0 1 1 0-3.256l6.718-3.12A2.5 2.5 0 0 1 11 2.5zm-8.5 4a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3zm11 5.5a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3z"/>
@@ -64,7 +64,7 @@
</a>
{%- endmacro %}
-{% macro stream(stream_url, title=_("open stream"), color="secondary" ) -%}
+{% macro stream(stream_url, title=_("open stream"), color="transparent" ) -%}
<a href="{{ stream_url }}" class="ml-2 btn-icon-big btn btn-{{ color }}" target="_blank" title="{{ title }}">
<svg width="1rem" height="1rem" viewBox="0 0 16 16" class="bi bi-file-play" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M4 0h8a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V2a2 2 0 0 1 2-2zm0 1a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H4z"/>
@@ -73,7 +73,7 @@
</a>
{%- endmacro %}
#
-{% macro report(report_url, kind="url", next=request.get_full_path() , title=_("report this url"), color="secondary" ) -%}
+{% macro report(report_url, kind="url", next=request.get_full_path() , title=_("report this url"), color="transparent" ) -%}
<a href="{{ url('plainui:report_content') ~ '?kind=' ~ kind ~ '&kind_data=' ~ report_url | urlencode ~ '&next=' ~ next }}" class="ml-2 btn-icon-big btn btn-{{ color }}" title="{{ title }}">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-exclamation-diamond-fill" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M9.05.435c-.58-.58-1.52-.58-2.1 0L.436 6.95c-.58.58-.58 1.519 0 2.098l6.516 6.516c.58.58 1.519.58 2.098 0l6.516-6.516c.58-.58.58-1.519 0-2.098L9.05.435zM8 4a.905.905 0 0 0-.9.995l.35 3.507a.552.552 0 0 0 1.1 0l.35-3.507A.905.905 0 0 0 8 4zm.002 6a1 1 0 1 0 0 2 1 1 0 0 0 0-2z"/>
@@ -81,7 +81,7 @@
</a>
{%- endmacro %}
-{% macro edit(edit, title=_("edit this"), color="secondary" ) -%}
+{% macro edit(edit, title=_("edit this"), color="transparent" ) -%}
<a href="{{ edit }}" class="ml-2 btn-icon-big btn btn-{{ color }}" title="{{ title }}">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-pencil" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M12.146.146a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1 0 .708l-10 10a.5.5 0 0 1-.168.11l-5 2a.5.5 0 0 1-.65-.65l2-5a.5.5 0 0 1 .11-.168l10-10zM11.207 2.5L13.5 4.793 14.793 3.5 12.5 1.207 11.207 2.5zm1.586 3L10.5 3.207 4 9.707V10h.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.5h.293l6.5-6.5zm-9.761 5.175l-.106.106-1.528 3.821 3.821-1.528.106-.106A.5.5 0 0 1 5 12.5V12h-.5a.5.5 0 0 1-.5-.5V11h-.5a.5.5 0 0 1-.468-.325z"/>
diff --git a/src/plainui/jinja2/plainui/components/title.html b/src/plainui/jinja2/plainui/components/title.html
index afe065ad11633ed817a24a85639c0e0d1a7d132b..af62211f3fd36f7deead0e74c3959b14ceff8a7c 100644
--- a/src/plainui/jinja2/plainui/components/title.html
+++ b/src/plainui/jinja2/plainui/components/title.html
@@ -14,22 +14,22 @@
{% if conf %}
<div class="col-sm-auto text-righ align-self-center">
{% if share_url %}
- {{ fbtns.share(share_url, color="secondary") }}
+ {{ fbtns.share(share_url, color="transparent") }}
{% endif %}
{% if fav_type and fav_id %}
- {{ fbtns.fav(fav_id, fav_type, fav_is, color="secondary") }}
+ {{ fbtns.fav(fav_id, fav_type, fav_is, color="transparent") }}
{% endif %}
{% if sch_id %}
- {{ fbtns.schedule(sch_id, sch_is, color="secondary") }}
+ {{ fbtns.schedule(sch_id, sch_is, color="transparent") }}
{% endif %}
{% if stream_url %}
- {{ fbtns.stream(stream_url, color="secondary") }}
+ {{ fbtns.stream(stream_url, color="transparent") }}
{% endif %}
{% if report_url %}
- {{ fbtns.report(report_url, kind=report_kind, color="secondary") }}
+ {{ fbtns.report(report_url, kind=report_kind, color="transparent") }}
{% endif %}
</div>
{% endif %}
diff --git a/src/plainui/jinja2/plainui/header.html b/src/plainui/jinja2/plainui/header.html
index 9008d1a2b6e5006c72bd0970363e6120240d25a2..ebc91956c1470fd224144037786f6020dd827ca7 100644
--- a/src/plainui/jinja2/plainui/header.html
+++ b/src/plainui/jinja2/plainui/header.html
@@ -5,19 +5,19 @@
<header id="header" class="rc3-header container mb-3 mt-6">
{{ logoMacro.logo(static('plainui/img/rc3-logo-' + scope + '.svg'), url('plainui:index'), conf.name + " logo", conf.name + " logo") }}
<nav class="rc3-header__main">
- <a class="btn {{ 'btn-primary' if view_name == 'plainui:world' else 'btn-secondary' }} rc3-header__main-linkbox" href="{{ url('plainui:world') }}" title="{{ _("world") }}">
+ <a class="btn {{ 'btn-transparent' if view_name == 'plainui:world' else 'btn-transparent' }} rc3-header__main-linkbox" href="{{ url('plainui:world') }}" title="{{ _("world") }}">
{{ _("world") }}
</a>
- <a class="btn {{ 'btn-primary' if view_name != 'plainui:world' and view_name != 'plainui:static_page' else 'btn-secondary' }} rc3-header__main-linkbox" href="{{ url('plainui:index') }}" title="{{ _("platform") }}">
+ <a class="btn {{ 'btn-transparent' if view_name != 'plainui:world' and view_name != 'plainui:static_page' else 'btn-transparent' }} rc3-header__main-linkbox" href="{{ url('plainui:index') }}" title="{{ _("platform") }}">
{{ _("platform") }}
</a>
- <a class="btn {{ 'btn-primary' if view_name == 'plainui:static_page' else 'btn-secondary' }} rc3-header__main-linkbox" href="{{ url('plainui:static_page', page_slug='start' ) }}" title="{{ _("info") }}">
+ <a class="btn {{ 'btn-transparent' if view_name == 'plainui:static_page' else 'btn-transparent' }} rc3-header__main-linkbox" href="{{ url('plainui:static_page', page_slug='start' ) }}" title="{{ _("info") }}">
{{ _("info") }}
</a>
<form class="rc3-header__main-search input-group" method="POST" action="{{ url('plainui:search') }}" role="search">
{{ csrf_input }}
<input class="form-control col rc3-header__main-search-input" name="q" type="text" placeholder="{{ _("search") }}" value="{% if search_query is defined %}{{ search_query }}{% endif %}">
- <button class="rc3-header__main-search-btn input-group-append btn btn-secondary">
+ <button class="rc3-header__main-search-btn input-group-append btn btn-transparent">
<svg width="1em" height="1em" viewBox="0 0 16 16" class=" bi bi-search" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<title>{{ _("search") }}</title>
<path fill-rule="evenodd" d="M10.442 10.442a1 1 0 0 1 1.415 0l3.85 3.85a1 1 0 0 1-1.414 1.415l-3.85-3.85a1 1 0 0 1 0-1.415z"/>
@@ -27,15 +27,15 @@
</form>
</nav>
<div class="rc3-header__additional">
- <a class="btn rc3-header__additional-linkbox {{ 'btn-primary' if view_name == 'plainui:userprofile' else 'btn-secondary' }}" href="{{ url('plainui:userprofile') }}" title="{{ _('Profile') }}">
+ <a class="btn rc3-header__additional-linkbox {{ 'btn-transparent' if view_name == 'plainui:userprofile' else 'btn-transparent' }}" href="{{ url('plainui:userprofile') }}" title="{{ _('Profile') }}">
{{ avatar.avatar(request.user, scope) }}
</a>
- <a class="btn rc3-header__additional-linkbox {{ 'btn-primary' if view_name == 'plainui:my_fahrplan' else 'btn-secondary' }}" href="{{ url('plainui:my_fahrplan') }}">
+ <a class="btn rc3-header__additional-linkbox {{ 'btn-transparent' if view_name == 'plainui:my_fahrplan' else 'btn-transparent' }}" href="{{ url('plainui:my_fahrplan') }}">
{{ _("My Plan") }}
</a>
<div class="rc3-header__additional-box-2x1">
{%- if request.user.is_authenticated %}
- <a class="btn btn-secondary rc3-header__additional-linkbox" href="{{ url('plainui:logout') }}" title="{{ _("logout") }}">
+ <a class="btn btn-transparent rc3-header__additional-linkbox" href="{{ url('plainui:logout') }}" title="{{ _("logout") }}">
{{ _("logout") }}
</a>
{% else %}
@@ -43,16 +43,16 @@
{{ _("login") }}
</a>
{% endif %}
- <a class="btn rc3-header__additional-linkbox {{ 'btn-primary' if view_name == 'plainui:board' else 'btn-secondary' }}" href="{{ url('plainui:board') }}" title="{{ _("board") }}">
+ <a class="btn rc3-header__additional-linkbox {{ 'btn-transparent' if view_name == 'plainui:board' else 'btn-transparent' }}" href="{{ url('plainui:board') }}" title="{{ _("board") }}">
{{ _("board") }}
</a>
</div>
- <a class="btn btn-block rc3-header__additional-linkbox {{ 'btn-primary' if view_name == 'plainui:personal_message' else 'btn-secondary' }}" href="{{ url('plainui:personal_message') }}" title="{{ _("Messages") }}">
+ <a class="btn btn-block rc3-header__additional-linkbox {{ 'btn-transparent' if view_name == 'plainui:personal_message' else 'btn-transparent' }}" href="{{ url('plainui:personal_message') }}" title="{{ _("Messages") }}">
{{ _("Mess ages") -}}
{% set num_unread = num_of_unread_messages(request) -%}
{% if num_unread %}<span class="rc3-header__additional-linkbox-badge badge badge-info font-headings">{{num_unread}}</span>{% endif %}
</a>
- <a class="btn rc3-header__additional-linkbox {{ 'btn-primary' if view_name == 'plainui:fahrplan' else 'btn-secondary' }}" href="{{ url('plainui:fahrplan') }}" title="{{ _("Fahrplan") }}">
+ <a class="btn rc3-header__additional-linkbox {{ 'btn-transparent' if view_name == 'plainui:fahrplan' else 'btn-transparent' }}" href="{{ url('plainui:fahrplan') }}" title="{{ _("Fahrplan") }}">
{{ _("Fahr plan") }}
</a>
{#
@@ -60,12 +60,12 @@
<form class="rc3-header__additional-box-1x2" method="POST" action="{{ url('plainui:modify_high_contrast') }}">
{{ csrf_input }}
<input type="hidden" name="next" value="{{request.get_full_path() }}">
- <button class="btn rc3-header__additional-button {{ 'btn-primary' if request.user.high_contrast == false else 'btn-secondary'}}" title="{{ _("Low Contrast") }}" name="set" value="n">
+ <button class="btn rc3-header__additional-button {{ 'btn-transparent' if request.user.high_contrast == false else 'btn-transparent'}}" title="{{ _("Low Contrast") }}" name="set" value="n">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-moon" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M14.53 10.53a7 7 0 0 1-9.058-9.058A7.003 7.003 0 0 0 8 15a7.002 7.002 0 0 0 6.53-4.47z"/>
</svg>
</button>
- <button class="btn rc3-header__additional-button {{ 'btn-primary' if request.user.high_contrast else 'btn-secondary'}}" title="{{ _("High Contrast") }}" name="set" value="y">
+ <button class="btn rc3-header__additional-button {{ 'btn-transparent' if request.user.high_contrast else 'btn-transparent'}}" title="{{ _("High Contrast") }}" name="set" value="y">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-sun" viewBox="0 0 16 16">
<path d="M3.5 8a4.5 4.5 0 1 1 9 0 4.5 4.5 0 0 1-9 0z"/>
<path fill-rule="evenodd" d="M8.202.28a.25.25 0 0 0-.404 0l-.91 1.255a.25.25 0 0 1-.334.067L5.232.79a.25.25 0 0 0-.374.155l-.36 1.508a.25.25 0 0 1-.282.19l-1.532-.245a.25.25 0 0 0-.286.286l.244 1.532a.25.25 0 0 1-.189.282l-1.509.36a.25.25 0 0 0-.154.374l.812 1.322a.25.25 0 0 1-.067.333l-1.256.91a.25.25 0 0 0 0 .405l1.256.91a.25.25 0 0 1 .067.334L.79 10.768a.25.25 0 0 0 .154.374l1.51.36a.25.25 0 0 1 .188.282l-.244 1.532a.25.25 0 0 0 .286.286l1.532-.244a.25.25 0 0 1 .282.189l.36 1.508a.25.25 0 0 0 .374.155l1.322-.812a.25.25 0 0 1 .333.067l.91 1.256a.25.25 0 0 0 .405 0l.91-1.256a.25.25 0 0 1 .334-.067l1.322.812a.25.25 0 0 0 .374-.155l.36-1.508a.25.25 0 0 1 .282-.19l1.532.245a.25.25 0 0 0 .286-.286l-.244-1.532a.25.25 0 0 1 .189-.282l1.508-.36a.25.25 0 0 0 .155-.374l-.812-1.322a.25.25 0 0 1 .067-.333l1.256-.91a.25.25 0 0 0 0-.405l-1.256-.91a.25.25 0 0 1-.067-.334l.812-1.322a.25.25 0 0 0-.155-.374l-1.508-.36a.25.25 0 0 1-.19-.282l.245-1.532a.25.25 0 0 0-.286-.286l-1.532.244a.25.25 0 0 1-.282-.189l-.36-1.508a.25.25 0 0 0-.374-.155l-1.322.812a.25.25 0 0 1-.333-.067L8.203.28zM8 2.5a5.5 5.5 0 1 0 0 11 5.5 5.5 0 0 0 0-11z"/>
@@ -77,10 +77,10 @@
<form class="rc3-header__additional-box-2x1 rc3-header__nomob" method="POST" action="{{ url('plainui:modify_language') }}">
{{ csrf_input }}
<input type="hidden" name="next" value="{{ request.get_full_path() }}">
- <button class="btn rc3-header__additional-button {{ 'btn-primary' if get_language() == 'de' else 'btn-secondary' }}" name="language" value="de">
+ <button class="btn rc3-header__additional-button {{ 'btn-transparent' if get_language() == 'de' else 'btn-transparent' }}" name="language" value="de">
{{ _("de") }}
</button>
- <button class="btn rc3-header__additional-button {{ 'btn-primary' if get_language() == 'en' else 'btn-secondary' }}" name="language" value="en">
+ <button class="btn rc3-header__additional-button {{ 'btn-transparent' if get_language() == 'en' else 'btn-transparent' }}" name="language" value="en">
{{ _("en") }}
</button>
</form>
diff --git a/src/plainui/styles/_button-classes.scss b/src/plainui/styles/_button-classes.scss
index 306393df2a4a2add4c2e08268586589d5628c94b..886fc07031c30f759f83db71f4fa3605a1ea79a7 100644
--- a/src/plainui/styles/_button-classes.scss
+++ b/src/plainui/styles/_button-classes.scss
@@ -212,6 +212,22 @@
.btn-transparent {
background-color: transparent;
color: $primary;
+
+ &:hover,&.active {
+ // text-shadow: $btn-hover-text-shadow;
+ filter: drop-shadow( 0 0 9px rgba(255, 255, 255, .7));
+ }
+
+ &:focus,
+ &.focus,
+ &:focus-visible {
+ text-shadow: $btn-hover-text-shadow;
+ box-shadow: $btn-focus-box-shadow;
+ }
+
+ &:focus-visible {
+ outline: none;
+ }
}
// add new styles
diff --git a/src/plainui/styles/utils/_bootstrap-theme-plattform.scss b/src/plainui/styles/utils/_bootstrap-theme-plattform.scss
index 3fec9332872c38a1aa88e951402206ea1170a130..2a7285e1373e89c31f3602a410c73644344aab1e 100644
--- a/src/plainui/styles/utils/_bootstrap-theme-plattform.scss
+++ b/src/plainui/styles/utils/_bootstrap-theme-plattform.scss
@@ -59,7 +59,8 @@ $input-btn-focus-color: $primary;
$btn-color: $gray-100;
$btn-primary-color: null;
-$input-btn-focus-box-shadow: 0px 0px 3px 3px #BAF0FF, 0px 0px 2px 2px $tertiary, inset 0px 0px 15px rgba(32, 29, 71, 0.55);
+// $input-btn-focus-box-shadow: 0px 0px 3px 3px #BAF0FF, 0px 0px 2px 2px $tertiary, inset 0px 0px 15px rgba(32, 29, 71, 0.55);
+$input-btn-focus-box-shadow: 0px 0px 3px 3px #BAF0FF, 0px 0px 2px 2px $tertiary, inset 0px 0px 15px rgba(253, 253, 253, 0.55);
$btn-hover-text-shadow: 0px 0px 4px rgba(255, 255, 255, 0.75);
$box-shadow-morphism: 2px 2px 4px #000000, -2px -2px 4px #1A1638;
$btn-active-box-shadow: $input-btn-focus-box-shadow;
diff --git a/src/plainui/styles/utils/_forms.scss b/src/plainui/styles/utils/_forms.scss
index e57a11af84dd12af14ab34545557a390354f24ab..d8287ba818b7b8750daa3931b8976119efcc12fe 100644
--- a/src/plainui/styles/utils/_forms.scss
+++ b/src/plainui/styles/utils/_forms.scss
@@ -10,3 +10,7 @@ $input-box-shadow: button.$btn-box-shadow;
$label-margin-bottom: 0;
$form-text-margin-top: 0.5rem;
$form-feedback-font-size: $medium-font-size;
+
+.form-control {
+ background-color: transparent !important;
+}
\ No newline at end of file