Settings CSS Remix
Wasn't feeling the previous CSS responsive structure, so edited it to be a bit more streamline. Also fixed small issue with the backup API request. Made a small change to notifications so the alert stays live while the system is processing a request rather than going back to an unalert state.
This commit is contained in:
Ro
parent
bfb0873f5f
commit
2ce86fad2e
6 changed files with 268 additions and 241 deletions
|
|
@ -2,6 +2,7 @@
|
||||||
|
|
||||||
namespace brain\utility;
|
namespace brain\utility;
|
||||||
|
|
||||||
|
use brain\data\Settings;
|
||||||
use Carbon\Carbon;
|
use Carbon\Carbon;
|
||||||
|
|
||||||
class Maintenance
|
class Maintenance
|
||||||
|
|
|
||||||
|
|
@ -10,7 +10,6 @@
|
||||||
|
|
||||||
{% block mainContent %}
|
{% block mainContent %}
|
||||||
<article role="settings">
|
<article role="settings">
|
||||||
<h2>Info</h2>
|
|
||||||
<section role="member-settings">
|
<section role="member-settings">
|
||||||
<div role="member-avatar">
|
<div role="member-avatar">
|
||||||
<div role="avatar" style="background: url({{ member['avatar'] }} ) no-repeat center center / cover"></div>
|
<div role="avatar" style="background: url({{ member['avatar'] }} ) no-repeat center center / cover"></div>
|
||||||
|
|
@ -23,114 +22,103 @@
|
||||||
<div>
|
<div>
|
||||||
<input type='text' name='handle' id='settings-handle' placeholder='handle' value="{{ member['handle'] }}" autofocus/>
|
<input type='text' name='handle' id='settings-handle' placeholder='handle' value="{{ member['handle'] }}" autofocus/>
|
||||||
<input type='text' name='email' id='settings-email' placeholder='email' value="{{ member['email'] }}" autofocus/>
|
<input type='text' name='email' id='settings-email' placeholder='email' value="{{ member['email'] }}" autofocus/>
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<input type='text' name='base-url' id='settings-url' placeholder='url' value="{{ baseUrl }}" autofocus/>
|
<input type='text' name='base-url' id='settings-url' placeholder='url' value="{{ baseUrl }}" autofocus/>
|
||||||
<input type='text' name='base-title' id='settings-title' placeholder='site title' value="{{ siteTitle }}" autofocus/>
|
<input type='text' name='base-title' id='settings-title' placeholder='site title' value="{{ siteTitle }}" autofocus/>
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<textarea id="settings-desc" type='text' name='settings_desc' class='settings-dec' placeholder='description stuff' , autofocus>{{ desc }}</textarea>
|
<textarea id="settings-desc" type='text' name='settings_desc' class='settings-dec' placeholder='description stuff' , autofocus>{{ desc }}</textarea>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
|
||||||
<h2>Options</h2>
|
<div>
|
||||||
<section role="site-settings">
|
<button id="create-backup">
|
||||||
|
<i class="ti ti-disc"></i>
|
||||||
|
<span>BACK UP YOUR SITE</span>
|
||||||
|
</button><br/>
|
||||||
|
{% if lastBackup != '' %}
|
||||||
|
LAST BACK UP<br/>
|
||||||
|
<a href="/api/v1/files">{{ lastBackup }}</a><br/>
|
||||||
|
{% else %}
|
||||||
|
<span>span No back ups. Frowny face.</span>
|
||||||
|
{% endif %}
|
||||||
|
</div>
|
||||||
<div role="features">
|
<div role="features">
|
||||||
<label>Features</label>
|
{% if apiStatus is defined and apiStatus == "true" %}
|
||||||
<br>
|
<button id="api-access-toggle" title="allow external api" data-enabled="true">
|
||||||
{% if apiStatus is defined and apiStatus == "true" %}
|
<i class="ti ti-phone-incoming"></i>
|
||||||
<button id="api-access-toggle" title="allow external api" data-enabled="true">
|
<span id="api-status">API ACCESS ENABLED</span>
|
||||||
<i class="ti ti-phone-incoming"></i>
|
|
||||||
<span id="api-status">API ACCESS ENABLED</span>
|
|
||||||
</button>
|
|
||||||
|
|
||||||
{% else %}
|
|
||||||
<button id="api-access-toggle" title="allow external api" data-enabled="false">
|
|
||||||
<i class="ti ti-phone-incoming"></i>
|
|
||||||
<span id="api-status">API ACCESS NOT ENABLED</span>
|
|
||||||
</button>
|
|
||||||
|
|
||||||
{% endif %}
|
|
||||||
{% if dynamicRenderStatus is defined and dynamicRenderStatus == "true" %}
|
|
||||||
<button id="dynamic-render-toggle" title="allow external api" data-enabled="true">
|
|
||||||
<i class="ti ti-arrow-merge"></i>
|
|
||||||
<span id="dynamic-render-status">DYNAMIC PAGE RENDERING</span>
|
|
||||||
</button>
|
|
||||||
|
|
||||||
{% else %}
|
|
||||||
<button id="dynamic-render-toggle" title="allow external api" data-enabled="false">
|
|
||||||
<i class="ti ti-arrow-merge"></i>
|
|
||||||
<span id="dynamic-render-status">STATIC PAGE RENDERING</span>
|
|
||||||
</button>
|
|
||||||
|
|
||||||
{% endif %}
|
|
||||||
</div>
|
|
||||||
<div role="theme">
|
|
||||||
<label>Themes</label><br/>
|
|
||||||
{% for theme in themes %}
|
|
||||||
{% if theme.name == currentTheme %}
|
|
||||||
<button id="{{ theme.name }}" class="theme-select" data-enabled="true">
|
|
||||||
<i class="ti ti-brush"></i>
|
|
||||||
<span>{{ theme['display-name'] }}</span>
|
|
||||||
</button>
|
|
||||||
{% else %}
|
|
||||||
<button href="#" id="{{ theme.name }}" class="theme-select" data-enabled="false">
|
|
||||||
<i class="ti ti-brush-off"></i>
|
|
||||||
<span>{{ theme['display-name'] }}</span>
|
|
||||||
</button>
|
|
||||||
{% endif %}
|
|
||||||
|
|
||||||
{% endfor %}
|
|
||||||
</div>
|
|
||||||
<div role="mail">
|
|
||||||
<label>Email</label><br/>
|
|
||||||
{% if mailOption == "option-none" or mailOption == "" %}
|
|
||||||
<a href="#" class="mail-option" id="option-none" data-enabled="true">NONE</a>
|
|
||||||
{% else %}
|
|
||||||
<a href="#" class="mail-option" id="option-none" data-enabled="false">NONE</a>
|
|
||||||
{% endif %}
|
|
||||||
{% if mailOption == "option-mg" or mailOption == "" %}
|
|
||||||
<a href="#" class="mail-option" id="option-mg" data-enabled="true">MAILGUN</a>
|
|
||||||
{% else %}
|
|
||||||
<a href="#" class="mail-option" id="option-mg" data-enabled="false">MAILGUN</a>
|
|
||||||
{% endif %}
|
|
||||||
{% if mailOption == "option-smtp" or mailOption == "" %}
|
|
||||||
<a href="#" class="mail-option" id="option-smtp" data-enabled="true">SMTP</a>
|
|
||||||
{% else %}
|
|
||||||
<a href="#" class="mail-option" id="option-smtp" data-enabled="false">SMTP</a>
|
|
||||||
{% endif %}
|
|
||||||
|
|
||||||
{% apply spaceless %}
|
|
||||||
{{ include("dash/partials/mailforms.twig") }}
|
|
||||||
{% endapply %}
|
|
||||||
<button id="send-mail">
|
|
||||||
<i class="ti ti-mailbox"></i>
|
|
||||||
<span>TEST MAIL</span>
|
|
||||||
</button>
|
</button>
|
||||||
<br/><br/>
|
|
||||||
</div>
|
{% else %}
|
||||||
</section>
|
<button id="api-access-toggle" title="allow external api" data-enabled="false">
|
||||||
<h2>Data</h2>
|
<i class="ti ti-phone-incoming"></i>
|
||||||
<section role="data-settings">
|
<span id="api-status">API ACCESS NOT ENABLED</span>
|
||||||
<div>
|
</button>
|
||||||
<label>API KEY</label>
|
|
||||||
<br/>
|
{% endif %}
|
||||||
{{ member['key'] }}
|
{% if dynamicRenderStatus is defined and dynamicRenderStatus == "true" %}
|
||||||
<br/>
|
<button id="dynamic-render-toggle" title="allow external api" data-enabled="true">
|
||||||
<label>FORM TOKEN</label><br/>
|
<i class="ti ti-arrow-merge"></i>
|
||||||
{{ ftoken }}
|
<span id="dynamic-render-status">DYNAMIC PAGE RENDERING</span>
|
||||||
</div>
|
</button>
|
||||||
<div>
|
|
||||||
<button id="create-backup">
|
{% else %}
|
||||||
<i class="ti ti-disc"></i>
|
<button id="dynamic-render-toggle" title="allow external api" data-enabled="false">
|
||||||
<span>BACK UP YOUR SITE</span>
|
<i class="ti ti-arrow-merge"></i>
|
||||||
</button><br/>
|
<span id="dynamic-render-status">STATIC PAGE RENDERING</span>
|
||||||
{% if lastBackup != '' %}
|
</button>
|
||||||
LAST BACK UP<br/>
|
|
||||||
<a href="/api/v1/files">{{ lastBackup }}</a><br/>
|
{% endif %}
|
||||||
|
</div>
|
||||||
|
<div role="theme">
|
||||||
|
<label>Themes</label><br/>
|
||||||
|
{% for theme in themes %}
|
||||||
|
{% if theme.name == currentTheme %}
|
||||||
|
<button id="{{ theme.name }}" class="theme-select" data-enabled="true">
|
||||||
|
<i class="ti ti-brush"></i>
|
||||||
|
<span>{{ theme['display-name'] }}</span>
|
||||||
|
</button>
|
||||||
{% else %}
|
{% else %}
|
||||||
<span>span No back ups. Frowny face.</span>
|
<button href="#" id="{{ theme.name }}" class="theme-select" data-enabled="false">
|
||||||
|
<i class="ti ti-brush-off"></i>
|
||||||
|
<span>{{ theme['display-name'] }}</span>
|
||||||
|
</button>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
|
||||||
</section>
|
{% endfor %}
|
||||||
</article>
|
</div>
|
||||||
{% endblock %}
|
<div role="mail">
|
||||||
|
<label>Email</label><br/>
|
||||||
|
{% if mailOption == "option-none" or mailOption == "" %}
|
||||||
|
<a href="#" class="mail-option" id="option-none" data-enabled="true">NONE</a>
|
||||||
|
{% else %}
|
||||||
|
<a href="#" class="mail-option" id="option-none" data-enabled="false">NONE</a>
|
||||||
|
{% endif %}
|
||||||
|
{% if mailOption == "option-mg" or mailOption == "" %}
|
||||||
|
<a href="#" class="mail-option" id="option-mg" data-enabled="true">MAILGUN</a>
|
||||||
|
{% else %}
|
||||||
|
<a href="#" class="mail-option" id="option-mg" data-enabled="false">MAILGUN</a>
|
||||||
|
{% endif %}
|
||||||
|
{% if mailOption == "option-smtp" or mailOption == "" %}
|
||||||
|
<a href="#" class="mail-option" id="option-smtp" data-enabled="true">SMTP</a>
|
||||||
|
{% else %}
|
||||||
|
<a href="#" class="mail-option" id="option-smtp" data-enabled="false">SMTP</a>
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
{% apply spaceless %}
|
||||||
|
{{ include("dash/partials/mailforms.twig") }}
|
||||||
|
{% endapply %}
|
||||||
|
<button id="send-mail">
|
||||||
|
<i class="ti ti-mailbox"></i>
|
||||||
|
<span>TEST MAIL</span>
|
||||||
|
</button>
|
||||||
|
<br/><br/>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label>API KEY</label>
|
||||||
|
<br/>
|
||||||
|
{{ member['key'] }}
|
||||||
|
<br/>
|
||||||
|
<label>FORM TOKEN</label><br/>
|
||||||
|
{{ ftoken }}
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</article>
|
||||||
|
{% endblock %}
|
||||||
|
|
|
||||||
|
|
@ -16,13 +16,11 @@ article[role="settings"] label {
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
}
|
}
|
||||||
|
|
||||||
section[role="member-settings"],
|
section[role="member-settings"] {
|
||||||
section[role="site-settings"],
|
|
||||||
section[role="data-settings"],
|
|
||||||
section[role="backup-settings"] {
|
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: 1fr 1fr 1fr;
|
grid-template-columns: 1fr 1fr 1fr 1fr;
|
||||||
gap: 10px;
|
grid-auto-columns: auto;
|
||||||
|
gap: 15px;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
max-width: 900px;
|
max-width: 900px;
|
||||||
margin: 10px auto;
|
margin: 10px auto;
|
||||||
|
|
@ -32,8 +30,47 @@ section[role="member-settings"] {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
section[role="member-settings"] > div[role="member-avatar"] {
|
section[role="member-settings"] > div:nth-child(1) {
|
||||||
height: 300px;
|
grid-column: 1/2;
|
||||||
|
grid-row: 1/3;
|
||||||
|
}
|
||||||
|
|
||||||
|
section[role="member-settings"] > div:nth-child(2) {
|
||||||
|
grid-column: 2/4;
|
||||||
|
grid-row: 1/3;
|
||||||
|
}
|
||||||
|
|
||||||
|
section[role="member-settings"] > div:nth-child(3) {
|
||||||
|
grid-row: 1/3;
|
||||||
|
}
|
||||||
|
|
||||||
|
section[role="member-settings"] > div:nth-child(4) {
|
||||||
|
color: var(--white);
|
||||||
|
}
|
||||||
|
|
||||||
|
section[role="member-settings"] > div:nth-child(4) a {
|
||||||
|
font-weight: bold;
|
||||||
|
text-decoration: underline;
|
||||||
|
color: var(--tertiary);
|
||||||
|
}
|
||||||
|
|
||||||
|
section[role="member-settings"] > div:nth-child(5) {
|
||||||
|
grid-column: 2/4;
|
||||||
|
}
|
||||||
|
|
||||||
|
section[role="member-settings"] > div:nth-child(6) {
|
||||||
|
grid-column: 1/3;
|
||||||
|
}
|
||||||
|
|
||||||
|
section[role="member-settings"] > div:nth-child(7) {
|
||||||
|
grid-column: 3/5;
|
||||||
|
min-height: 325px;
|
||||||
|
}
|
||||||
|
|
||||||
|
section[role="member-settings"] > div:nth-child(8) {
|
||||||
|
grid-column: 1/4;
|
||||||
|
color: var(--white);
|
||||||
|
word-wrap: break-word;
|
||||||
}
|
}
|
||||||
|
|
||||||
section[role="member-settings"] > div[role="member-avatar"] div,
|
section[role="member-settings"] > div[role="member-avatar"] div,
|
||||||
|
|
@ -55,15 +92,7 @@ section[role="member-settings"] div input[type="text"] {
|
||||||
|
|
||||||
section[role="member-settings"] div textarea {
|
section[role="member-settings"] div textarea {
|
||||||
width: 99%;
|
width: 99%;
|
||||||
height: 86%;
|
height: 63%;
|
||||||
}
|
|
||||||
|
|
||||||
section[role="member-settings"] > div:nth-child(1) {
|
|
||||||
grid-column: 1/2;
|
|
||||||
}
|
|
||||||
|
|
||||||
section[role="member-settings"] > div:nth-child(2) {
|
|
||||||
grid-column: 2/4;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
article[role="settings"] button {
|
article[role="settings"] button {
|
||||||
|
|
@ -80,20 +109,22 @@ article[role="settings"] button > span {
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
section[role="site-settings"]
|
section[role="member-settings"]
|
||||||
> div[role="features"]
|
> div[role="features"]
|
||||||
button[data-enabled="true"] {
|
button[data-enabled="true"] {
|
||||||
color: var(--white);
|
color: var(--white);
|
||||||
}
|
}
|
||||||
|
|
||||||
section[role="site-settings"]
|
section[role="member-settings"]
|
||||||
> div[role="features"]
|
> div[role="features"]
|
||||||
button[data-enabled="false"] {
|
button[data-enabled="false"] {
|
||||||
color: var(--primary);
|
color: var(--primary);
|
||||||
background: var(--secondary);
|
background: var(--secondary);
|
||||||
}
|
}
|
||||||
|
|
||||||
section[role="site-settings"] > div[role="theme"] button[data-enabled="true"] {
|
section[role="member-settings"]
|
||||||
|
> div[role="theme"]
|
||||||
|
button[data-enabled="true"] {
|
||||||
color: var(--white);
|
color: var(--white);
|
||||||
background: var(--highlight);
|
background: var(--highlight);
|
||||||
display: block;
|
display: block;
|
||||||
|
|
@ -101,7 +132,9 @@ section[role="site-settings"] > div[role="theme"] button[data-enabled="true"] {
|
||||||
padding: 3px;
|
padding: 3px;
|
||||||
}
|
}
|
||||||
|
|
||||||
section[role="site-settings"] > div[role="theme"] button[data-enabled="false"] {
|
section[role="member-settings"]
|
||||||
|
> div[role="theme"]
|
||||||
|
button[data-enabled="false"] {
|
||||||
color: var(--primary);
|
color: var(--primary);
|
||||||
background: var(--secondary);
|
background: var(--secondary);
|
||||||
display: block;
|
display: block;
|
||||||
|
|
@ -109,7 +142,7 @@ section[role="site-settings"] > div[role="theme"] button[data-enabled="false"] {
|
||||||
padding: 3px;
|
padding: 3px;
|
||||||
}
|
}
|
||||||
|
|
||||||
section[role="site-settings"] > div[role="mail"] a {
|
section[role="member-settings"] > div[role="mail"] a {
|
||||||
margin-right: 3px;
|
margin-right: 3px;
|
||||||
color: var(--secondary);
|
color: var(--secondary);
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
|
|
@ -118,18 +151,18 @@ section[role="site-settings"] > div[role="mail"] a {
|
||||||
border-top: var(--primary) 1px solid;
|
border-top: var(--primary) 1px solid;
|
||||||
}
|
}
|
||||||
|
|
||||||
section[role="site-settings"] > div[role="mail"] a[data-enabled="true"] {
|
section[role="member-settings"] > div[role="mail"] a[data-enabled="true"] {
|
||||||
color: var(--tertiary);
|
color: var(--tertiary);
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
border-top: var(--highlight) 1px solid;
|
border-top: var(--highlight) 1px solid;
|
||||||
}
|
}
|
||||||
|
|
||||||
section[role="site-settings"] > div[role="mail"] div[data-enabled="false"] {
|
section[role="member-settings"] > div[role="mail"] div[data-enabled="false"] {
|
||||||
visibility: hidden;
|
visibility: hidden;
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
section[role="site-settings"] > div[role="mail"] input {
|
section[role="member-settings"] > div[role="mail"] input {
|
||||||
width: 96%;
|
width: 96%;
|
||||||
height: 30px;
|
height: 30px;
|
||||||
padding: 5px;
|
padding: 5px;
|
||||||
|
|
@ -140,17 +173,6 @@ section[role="data-settings"] {
|
||||||
color: var(--white);
|
color: var(--white);
|
||||||
}
|
}
|
||||||
|
|
||||||
section[role="data-settings"] div:nth-child(1) {
|
|
||||||
grid-column: 1/3;
|
|
||||||
word-wrap: break-word;
|
|
||||||
}
|
|
||||||
|
|
||||||
section[role="data-settings"] a {
|
|
||||||
font-weight: bold;
|
|
||||||
text-decoration: underline;
|
|
||||||
color: var(--tertiary);
|
|
||||||
}
|
|
||||||
|
|
||||||
@media only screen and (max-width: 900px) {
|
@media only screen and (max-width: 900px) {
|
||||||
main > article[role="settings"] {
|
main > article[role="settings"] {
|
||||||
width: 97%;
|
width: 97%;
|
||||||
|
|
@ -161,68 +183,81 @@ section[role="data-settings"] a {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media only screen and (max-width: 480px) {
|
@media only screen and (max-width: 650px) {
|
||||||
article[role="settings"] button {
|
section[role="member-settings"] {
|
||||||
width: 98%;
|
|
||||||
}
|
|
||||||
|
|
||||||
article[role="settings"] button > span {
|
|
||||||
font-size: 0.6em;
|
|
||||||
}
|
|
||||||
|
|
||||||
section[role="member-settings"],
|
|
||||||
section[role="site-settings"],
|
|
||||||
section[role="data-settings"],
|
|
||||||
section[role="backup-settings"] {
|
|
||||||
grid-template-columns: 1fr 1fr;
|
grid-template-columns: 1fr 1fr;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
section[role="member-settings"] div textarea {
|
||||||
|
height: 80px;
|
||||||
|
}
|
||||||
|
|
||||||
|
section[role="member-settings"] > div:nth-child(1) {
|
||||||
|
grid-column: 1/2;
|
||||||
|
grid-row: 1/3;
|
||||||
|
height: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
section[role="member-settings"] > div:nth-child(2) {
|
section[role="member-settings"] > div:nth-child(2) {
|
||||||
grid-column: 2/3;
|
grid-column: 2/3;
|
||||||
|
grid-row: 1/3;
|
||||||
}
|
}
|
||||||
|
|
||||||
section[role="member-settings"] > div:nth-child(5) {
|
section[role="member-settings"] > div:nth-child(3) {
|
||||||
grid-column: 1/3;
|
grid-column: 1/3;
|
||||||
|
grid-row: 3/5;
|
||||||
}
|
}
|
||||||
|
|
||||||
main > article[role="settings"] > section[role="member-settings"] {
|
section[role="member-settings"] > div:nth-child(4) {
|
||||||
width: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
section[role="member-settings"] > div[role="member-avatar"] {
|
|
||||||
height: 200px;
|
|
||||||
}
|
|
||||||
|
|
||||||
section[role="site-settings"] > div:nth-child(3) {
|
|
||||||
grid-column: 1/3;
|
|
||||||
}
|
|
||||||
|
|
||||||
section[role="data-settings"] > div:nth-child(2) {
|
|
||||||
grid-column: 1/3;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media only screen and (max-width: 330px) {
|
|
||||||
section[role="member-settings"],
|
|
||||||
section[role="site-settings"],
|
|
||||||
section[role="data-settings"],
|
|
||||||
section[role="backup-settings"] {
|
|
||||||
grid-template-columns: 1fr;
|
|
||||||
grid-auto-rows: 1fr 1fr auto auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
section[role="member-settings"] > div:nth-child(2),
|
|
||||||
section[role="member-settings"] > div:nth-child(3),
|
|
||||||
section[role="member-settings"] > div:nth-child(4),
|
|
||||||
section[role="member-settings"] > div:nth-child(5) {
|
|
||||||
grid-column: 1/2;
|
grid-column: 1/2;
|
||||||
}
|
}
|
||||||
|
|
||||||
section[role="site-settings"] > div:nth-child(1) {
|
section[role="member-settings"] > div:nth-child(5) {
|
||||||
grid-column: 1/3;
|
grid-column: 2/3;
|
||||||
}
|
}
|
||||||
|
|
||||||
article[role="settings"] button > span {
|
section[role="member-settings"] > div:nth-child(6) {
|
||||||
font-size: 0.8em;
|
grid-column: 1/2;
|
||||||
|
}
|
||||||
|
|
||||||
|
section[role="member-settings"] > div:nth-child(7) {
|
||||||
|
grid-column: 2/3;
|
||||||
|
min-height: 325px;
|
||||||
|
}
|
||||||
|
|
||||||
|
section[role="member-settings"] > div:nth-child(8) {
|
||||||
|
grid-column: 1/3;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media only screen and (max-width: 530px) {
|
||||||
|
section[role="member-settings"] {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
section[role="member-settings"] div textarea {
|
||||||
|
height: 80px;
|
||||||
|
}
|
||||||
|
|
||||||
|
section[role="member-settings"] > div:nth-child(1) {
|
||||||
|
grid-row: 1/3;
|
||||||
|
height: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
section[role="member-settings"] > div:nth-child(2) {
|
||||||
|
grid-row: 3/5;
|
||||||
|
}
|
||||||
|
|
||||||
|
section[role="member-settings"] > div:nth-child(3) {
|
||||||
|
grid-column: 1;
|
||||||
|
grid-row: 5/7;
|
||||||
|
}
|
||||||
|
|
||||||
|
section[role="member-settings"] > div:nth-child(4),
|
||||||
|
section[role="member-settings"] > div:nth-child(5),
|
||||||
|
section[role="member-settings"] > div:nth-child(6),
|
||||||
|
section[role="member-settings"] > div:nth-child(7),
|
||||||
|
section[role="member-settings"] > div:nth-child(8) {
|
||||||
|
grid-column: 1/3;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -445,7 +445,7 @@ const $7e781a188206b2b3$export$d46ee33f41c7e43d = "apiUseNotAuthorized";
|
||||||
data = {
|
data = {
|
||||||
task: "create_backup"
|
task: "create_backup"
|
||||||
};
|
};
|
||||||
this._request(url, event, method, type, data).then((result)=>{
|
this._request(url, null, event, method, type, data).then((result)=>{
|
||||||
resolve(result);
|
resolve(result);
|
||||||
}).catch((err)=>{
|
}).catch((err)=>{
|
||||||
reject(err);
|
reject(err);
|
||||||
|
|
@ -4186,6 +4186,7 @@ class $accfb6154319a04b$export$2e2bcd8739ae039 {
|
||||||
$accfb6154319a04b$var$iconGood.style.display = "none";
|
$accfb6154319a04b$var$iconGood.style.display = "none";
|
||||||
$accfb6154319a04b$var$iconNotGood.style.display = "none";
|
$accfb6154319a04b$var$iconNotGood.style.display = "none";
|
||||||
var color = "";
|
var color = "";
|
||||||
|
$accfb6154319a04b$var$responseText.innerHTML = text;
|
||||||
if (status !== null) {
|
if (status !== null) {
|
||||||
if (status) {
|
if (status) {
|
||||||
color = "#32cd32";
|
color = "#32cd32";
|
||||||
|
|
@ -4200,7 +4201,6 @@ class $accfb6154319a04b$export$2e2bcd8739ae039 {
|
||||||
color = "#200317";
|
color = "#200317";
|
||||||
$accfb6154319a04b$var$iconWorking.style.display = "block";
|
$accfb6154319a04b$var$iconWorking.style.display = "block";
|
||||||
}
|
}
|
||||||
$accfb6154319a04b$var$responseText.innerHTML = text;
|
|
||||||
new (0, $8b9e2899b2e82f52$export$2e2bcd8739ae039)({
|
new (0, $8b9e2899b2e82f52$export$2e2bcd8739ae039)({
|
||||||
targets: document.querySelector('[role="top-nav"]'),
|
targets: document.querySelector('[role="top-nav"]'),
|
||||||
rotateX: "180deg",
|
rotateX: "180deg",
|
||||||
|
|
@ -4226,30 +4226,32 @@ class $accfb6154319a04b$export$2e2bcd8739ae039 {
|
||||||
duration: 400,
|
duration: 400,
|
||||||
complete: ()=>{
|
complete: ()=>{
|
||||||
setTimeout(()=>{
|
setTimeout(()=>{
|
||||||
(0, $8b9e2899b2e82f52$export$2e2bcd8739ae039)({
|
if (status !== null) {
|
||||||
targets: $accfb6154319a04b$var$notifyText,
|
(0, $8b9e2899b2e82f52$export$2e2bcd8739ae039)({
|
||||||
backgroundColor: color,
|
targets: $accfb6154319a04b$var$notifyText,
|
||||||
opacity: 0,
|
backgroundColor: color,
|
||||||
easing: "easeInOutQuad",
|
opacity: 0,
|
||||||
duration: 400
|
easing: "easeInOutQuad",
|
||||||
});
|
duration: 400
|
||||||
(0, $8b9e2899b2e82f52$export$2e2bcd8739ae039)({
|
});
|
||||||
targets: $accfb6154319a04b$var$notifyIcons,
|
(0, $8b9e2899b2e82f52$export$2e2bcd8739ae039)({
|
||||||
width: 0,
|
targets: $accfb6154319a04b$var$notifyIcons,
|
||||||
opacity: 0,
|
width: 0,
|
||||||
easing: "easeOutQuint",
|
opacity: 0,
|
||||||
duration: 350
|
easing: "easeOutQuint",
|
||||||
});
|
duration: 350
|
||||||
new (0, $8b9e2899b2e82f52$export$2e2bcd8739ae039)({
|
});
|
||||||
targets: document.querySelector('[role="top-nav"]'),
|
new (0, $8b9e2899b2e82f52$export$2e2bcd8739ae039)({
|
||||||
rotateX: "0deg",
|
targets: document.querySelector('[role="top-nav"]'),
|
||||||
easing: "easeOutQuint"
|
rotateX: "0deg",
|
||||||
});
|
easing: "easeOutQuint"
|
||||||
new (0, $8b9e2899b2e82f52$export$2e2bcd8739ae039)({
|
});
|
||||||
targets: document.querySelector('[role="notify"]'),
|
new (0, $8b9e2899b2e82f52$export$2e2bcd8739ae039)({
|
||||||
rotateX: "180deg",
|
targets: document.querySelector('[role="notify"]'),
|
||||||
easing: "easeOutQuint"
|
rotateX: "180deg",
|
||||||
});
|
easing: "easeOutQuint"
|
||||||
|
});
|
||||||
|
}
|
||||||
}, 2500);
|
}, 2500);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -135,8 +135,7 @@ class MaintenanceManager {
|
||||||
method = REQUEST_TYPE_POST;
|
method = REQUEST_TYPE_POST;
|
||||||
type = CONTENT_TYPE_JSON;
|
type = CONTENT_TYPE_JSON;
|
||||||
data = { task: 'create_backup' };
|
data = { task: 'create_backup' };
|
||||||
|
this._request(url, null, event, method, type, data)
|
||||||
this._request(url, event, method, type, data)
|
|
||||||
.then(result => {
|
.then(result => {
|
||||||
resolve(result);
|
resolve(result);
|
||||||
})
|
})
|
||||||
|
|
|
||||||
|
|
@ -24,6 +24,7 @@ export default class Notfications {
|
||||||
iconNotGood.style.display = 'none';
|
iconNotGood.style.display = 'none';
|
||||||
|
|
||||||
var color = '';
|
var color = '';
|
||||||
|
responseText.innerHTML = text;
|
||||||
if (status !== null) {
|
if (status !== null) {
|
||||||
if (status) {
|
if (status) {
|
||||||
color = '#32cd32';
|
color = '#32cd32';
|
||||||
|
|
@ -38,7 +39,6 @@ export default class Notfications {
|
||||||
color = '#200317';
|
color = '#200317';
|
||||||
iconWorking.style.display = 'block';
|
iconWorking.style.display = 'block';
|
||||||
}
|
}
|
||||||
responseText.innerHTML = text;
|
|
||||||
|
|
||||||
new anime({
|
new anime({
|
||||||
targets: document.querySelector('[role="top-nav"]'),
|
targets: document.querySelector('[role="top-nav"]'),
|
||||||
|
|
@ -67,33 +67,35 @@ export default class Notfications {
|
||||||
duration: 400,
|
duration: 400,
|
||||||
complete: () => {
|
complete: () => {
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
anime({
|
if (status !== null) {
|
||||||
targets: notifyText,
|
anime({
|
||||||
backgroundColor: color,
|
targets: notifyText,
|
||||||
opacity: 0,
|
backgroundColor: color,
|
||||||
easing: 'easeInOutQuad',
|
opacity: 0,
|
||||||
duration: 400
|
easing: 'easeInOutQuad',
|
||||||
});
|
duration: 400
|
||||||
|
});
|
||||||
|
|
||||||
anime({
|
anime({
|
||||||
targets: notifyIcons,
|
targets: notifyIcons,
|
||||||
width: 0,
|
width: 0,
|
||||||
opacity: 0,
|
opacity: 0,
|
||||||
easing: 'easeOutQuint',
|
easing: 'easeOutQuint',
|
||||||
duration: 350
|
duration: 350
|
||||||
});
|
});
|
||||||
|
|
||||||
new anime({
|
new anime({
|
||||||
targets: document.querySelector('[role="top-nav"]'),
|
targets: document.querySelector('[role="top-nav"]'),
|
||||||
rotateX: '0deg',
|
rotateX: '0deg',
|
||||||
easing: 'easeOutQuint'
|
easing: 'easeOutQuint'
|
||||||
});
|
});
|
||||||
|
|
||||||
new anime({
|
new anime({
|
||||||
targets: document.querySelector('[role="notify"]'),
|
targets: document.querySelector('[role="notify"]'),
|
||||||
rotateX: '180deg',
|
rotateX: '180deg',
|
||||||
easing: 'easeOutQuint'
|
easing: 'easeOutQuint'
|
||||||
});
|
});
|
||||||
|
}
|
||||||
}, 2500);
|
}, 2500);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue