Replaced Moment with Carbon #84

Merged
Ghost merged 148 commits from develop into beta 2022-09-22 05:53:36 +02:00
3 changed files with 94 additions and 41 deletions
Showing only changes of commit a5cf8816f0 - Show all commits

View file

@ -251,17 +251,62 @@ section#site-features > div.site-maintenance {
color: var(--primary); color: var(--primary);
} }
section[class="member-settings"] > div[class="theme"] button[data-enabled="true"] { /*
color: var(--white); SITE FEATURES TAB
background: var(--secondary-highlight); */
section#site-themes > button {
background: var(--secondary);
display: inline-block; display: inline-block;
border-radius: 3px; border-radius: 3px;
padding: 3px; padding: 3px;
width: 83%; width: 250px;
margin-right: 5px; height: 200px;
margin: 10px 0;
} }
section[class="member-settings"] > div[class="theme"] a { section#site-themes > button > div {
height: 145px;
width: 100%;
display: flex;
justify-content: center;
align-items: center;
top: -10px;
position: relative;
border-radius: 3px;
}
section#site-themes > button[data-enabled="true"] > div {
background: var(--secondary-highlight);
color: var(--secondary);
}
section#site-themes > button[data-enabled="true"] label {
color: var(--primary);
}
section#site-themes > button[data-enabled="false"] > div {
background: var(--primary);
color: var(--secondary);
}
section#site-themes > button[data-enabled="false"] label {
color: var(--secondary);
}
section#site-themes > button[data-enabled="true"] > svg {
fill: var(--primary);
position: relative;
top: 5px;
}
section#site-themes > button[data-enabled="false"] > svg {
fill: var(--primary);
position: relative;
top: 5px;
}
section#site-themes > a {
background: var(--secondary-highlight); background: var(--secondary-highlight);
display: inline-block; display: inline-block;
width: 15%; width: 15%;
@ -269,15 +314,8 @@ section[class="member-settings"] > div[class="theme"] a {
text-align: center; text-align: center;
vertical-align: top; vertical-align: top;
top: 13px; top: 13px;
position: relative; position: absolute;
} z-index: 30;
section[class="member-settings"] > div[class="theme"] button[data-enabled="false"] {
color: var(--primary);
background: var(--secondary);
display: block;
border-radius: 3px;
padding: 3px;
} }
section[class="data-settings"] { section[class="data-settings"] {

View file

@ -170,9 +170,19 @@ export default class SettingsIndex {
e.preventDefault(); e.preventDefault();
let themes = document.querySelectorAll('.theme-select'); let themes = document.querySelectorAll('.theme-select');
for (var i = 0, length = themes.length; i < length; i++) { for (var i = 0, length = themes.length; i < length; i++) {
e.target.id == themes[i].id let theme = e.target.id;
? themes[i].setAttribute('data-enabled', 'true') if (e.target.id == '') {
: themes[i].setAttribute('data-enabled', 'false'); theme = e.target.getAttribute('for');
}
if (theme == themes[i].id) {
themes[i].setAttribute('data-enabled', 'true');
document.getElementById('label-' + themes[i].id).innerHTML =
'ACTIVE THEME';
} else {
themes[i].setAttribute('data-enabled', 'false');
document.getElementById('label-' + themes[i].id).innerHTML =
'INACTIVE THEME';
}
} }
} }
handleMailOptions(e) { handleMailOptions(e) {

View file

@ -43,7 +43,7 @@
</div> </div>
</section> </section>
<section id="site-features" class="section-tab show"> <section id="site-features" class="section-tab hide">
<div class="features-mail"> <div class="features-mail">
<label>SYSTEM EMAIL</label> <label>SYSTEM EMAIL</label>
<div> <div>
@ -142,28 +142,33 @@
</div> </div>
</div> </div>
</section> </section>
<section id="site-themes" class="section-tab hide"> <section id="site-themes" class="section-tab show">
MEMBER THEMES @foreach($themes as $theme)
<div class="theme"> @if($theme['name'] == $currentTheme)
<label>Themes</label><br/> <!--
@foreach($themes as $theme) <a target="_blank" href='/theme'>Edit</a>
@if($theme['name'] == $currentTheme) -->
<button id="{{ $theme['name'] }}" class="theme-select" data-enabled="true"> <button id="{{ $theme['name'] }}" class="theme-select" data-enabled="true">
<svg id="nav-menu-icon" class="icon"> <div for="{{ $theme['name'] }}">
<use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-palette"/> <label id="label-{{ $theme['name'] }}">ACTIVE THEME</label>
</svg> </div>
<span>{{ $theme['display-name'] }}</span> <svg id="nav-menu-icon" class="icon">
</button><a target="_blank" href='/theme'>Edit</a> <use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-palette"/>
@else </svg>
<button href="#" id="{{ $theme['name'] }}" class="theme-select" data-enabled="false"> <span for="{{ $theme['name'] }}">{{ $theme['display-name'] }}</span>
<svg id="nav-menu-icon" class="icon"> </button>
<use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-palette"/> @else
</svg> <button id="{{ $theme['name'] }}" class="theme-select" data-enabled="false">
<span>{{ $theme['display-name'] }}</span> <div for="{{ $theme['name'] }}">
</button> <label id="label-{{ $theme['name'] }}">INACTIVE THEME</label>
@endif </div>
@endforeach <svg id="nav-menu-icon" class="icon">
</div> <use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-palette"/>
</svg>
<span for="{{ $theme['name'] }}">{{ $theme['display-name'] }}</span>
</button>
@endif
@endforeach
</section> </section>
</section> </section>
</article> </article>