mirror of
https://github.com/freedombox/FreedomBox.git
synced 2026-05-20 10:34:30 +00:00
fix toggle buttle html layout and responsive design css
Reviewed-by: James Valleroy <jvalleroy@mailbox.org>
This commit is contained in:
parent
0dd4d1acf2
commit
9cd203411d
@ -3,6 +3,7 @@
|
|||||||
{% load static %}
|
{% load static %}
|
||||||
|
|
||||||
<header class="app-header {% if not icon_filename %} app-header-single-column {% endif %}">
|
<header class="app-header {% if not icon_filename %} app-header-single-column {% endif %}">
|
||||||
|
|
||||||
{% if icon_filename %}
|
{% if icon_filename %}
|
||||||
|
|
||||||
<img src="{% static 'theme/icons/' %}{{ icon_filename }}.svg" alt="{{ name }}"/>
|
<img src="{% static 'theme/icons/' %}{{ icon_filename }}.svg" alt="{{ name }}"/>
|
||||||
@ -10,13 +11,22 @@
|
|||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
<section class="app-description" >
|
<section class="app-description" >
|
||||||
{% block pagetitle %}
|
<section class='header-bar'>
|
||||||
{% if setup %}
|
{% block pagetitle %}
|
||||||
<h2>{% trans "Installation" %}: {{ short_description|default:'' }} ({{ name }})</h2>
|
{% if setup %}
|
||||||
{% else %}
|
<h2>{% trans "Installation" %}: {{ short_description|default:'' }} ({{ name }})</h2>
|
||||||
<h2>{{ name }}</h2>
|
{% else %}
|
||||||
{% endif %}
|
<h2>{{ name }}</h2>
|
||||||
{% endblock %}
|
{% endif %}
|
||||||
|
{% endblock %}
|
||||||
|
<div id='app-toggle-container' class="app-toggle-container">
|
||||||
|
{% if is_enabled %}
|
||||||
|
<button id="app-toggle-button" value="False" class="btn toggle-button toggle-button--toggled"></button>
|
||||||
|
{% else %}
|
||||||
|
<button id="app-toggle-button" value="True" class="btn toggle-button"></button>
|
||||||
|
{% endif %}
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
{% block description %}
|
{% block description %}
|
||||||
{% for paragraph in description %}
|
{% for paragraph in description %}
|
||||||
|
|||||||
@ -579,4 +579,34 @@ a.menu_link_active {
|
|||||||
padding: 10px;
|
padding: 10px;
|
||||||
transition: height 0.5s width 0.5s;
|
transition: height 0.5s width 0.5s;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.header-bar {
|
||||||
|
display: flex;
|
||||||
|
flex-flow: column-reverse;
|
||||||
|
justify-content: center;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-bar h2 {
|
||||||
|
margin: 0 0 15px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-bar .app-toggle-container {
|
||||||
|
display: flex;
|
||||||
|
flex-flow: row;
|
||||||
|
justify-content: center;
|
||||||
|
margin: 30px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-bar .toggle-button {
|
||||||
|
transform: scale(1.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-container {
|
||||||
|
margin: 0 10vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-list {
|
||||||
|
margin: 20px 10vw;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
Loading…
x
Reference in New Issue
Block a user