github-mirror/BookStack
2
0
Fork 0
mirror of https://github.com/BookStackApp/BookStack.git synced 2024-11-24 01:13:35 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Some further dark-mode fixes, added toggle to homepage

Browse Source 
- Homepage toggle especially useful for not-logged-in users since they
do not have a dropdown.
This commit is contained in:
Dan Brown 2020-04-12 19:06:34 +01:00
parent b80b6ed942
commit 88dfb40c63
No known key found for this signature in database
GPG Key ID: 46D9F943C24A2EF9
8 changed files with 31 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
resources/sass/_header.scss
View File

@ -167,8 +167,8 @@ header .search-box {
@include smaller-than($l) {
header .header-links {
@include lightDark(background-color, #fff, #333);
display: none;
background-color: #FFF;
z-index: 10;
right: $-m;
border-radius: 4px;
@ -180,19 +180,18 @@ header .search-box {
display: block;
}
}
header .links a, header .dropdown-container ul li a {
header .links a, header .dropdown-container ul li a, header .dropdown-container ul li button {
text-align: start;
display: block;
padding: $-s $-m;
color: $text-dark;
fill: $text-dark;
@include lightDark(color, $text-dark, #eee);
svg {
margin-inline-end: $-s;
}
&:hover {
background-color: #EEE;
color: #444;
fill: #444;
@include lightDark(background-color, #eee, #333);
@include lightDark(color, #000, #fff);
text-decoration: none;
}
}

2
resources/sass/_lists.scss
View File

@ -581,6 +581,8 @@ ul.pagination {
@include lightDark(color, #555, #eee);
fill: currentColor;
white-space: nowrap;
line-height: 1.6;
cursor: pointer;
&:hover, &:focus {
text-decoration: none;
background-color: var(--color-primary-light);

10
resources/views/common/header.blade.php
View File

@ -72,15 +72,7 @@
</li>
<li><hr></li>
<li>
<form action="{{ url('/settings/users/toggle-dark-mode') }}" method="post">
{{ csrf_field() }}
{{ method_field('patch') }}
@if(setting()->getForCurrentUser('dark-mode-enabled'))
<button>@icon('light-mode'){{ trans('common.light_mode') }}</button>
@else
<button>@icon('dark-mode'){{ trans('common.dark_mode') }}</button>
@endif
</form>
@include('partials.dark-mode-toggle')
</li>
</ul>
</div>

1
resources/views/common/home-book.blade.php
View File

@ -14,6 +14,7 @@
<div class="icon-list text-primary">
@include('partials.view-toggle', ['view' => $view, 'type' => 'books'])
@include('components.expand-toggle', ['target' => '.entity-list.compact .entity-item-snippet', 'key' => 'home-details'])
@include('partials.dark-mode-toggle', ['classes' => 'text-muted icon-list-item text-primary'])
</div>
</div>
@stop

1
resources/views/common/home-custom.blade.php
View File

@ -19,6 +19,7 @@
<h5>{{ trans('common.actions') }}</h5>
<div class="icon-list text-primary">
@include('components.expand-toggle', ['target' => '.entity-list.compact .entity-item-snippet', 'key' => 'home-details'])
@include('partials.dark-mode-toggle', ['classes' => 'text-muted icon-list-item text-primary'])
</div>
</div>
@stop

1
resources/views/common/home-shelves.blade.php
View File

@ -14,6 +14,7 @@
<div class="icon-list text-primary">
@include('partials.view-toggle', ['view' => $view, 'type' => 'shelves'])
@include('components.expand-toggle', ['target' => '.entity-list.compact .entity-item-snippet', 'key' => 'home-details'])
@include('partials.dark-mode-toggle', ['classes' => 'text-muted icon-list-item text-primary'])
</div>
</div>
@stop

13
resources/views/common/home.blade.php
View File

@ -3,8 +3,17 @@
@section('body')
<div class="container px-xl py-s">
<div class="icon-list inline block">
@include('components.expand-toggle', ['target' => '.entity-list.compact .entity-item-snippet', 'key' => 'home-details'])
<div class="grid half">
<div>
<div class="icon-list inline block">
@include('components.expand-toggle', ['target' => '.entity-list.compact .entity-item-snippet', 'key' => 'home-details'])
</div>
</div>
<div class="text-m-right">
<div class="icon-list inline block">
@include('partials.dark-mode-toggle', ['classes' => 'text-muted icon-list-item text-primary'])
</div>
</div>
</div>
</div>

9
resources/views/partials/dark-mode-toggle.blade.php Normal file
View File

@ -0,0 +1,9 @@
<form action="{{ url('/settings/users/toggle-dark-mode') }}" method="post">
{{ csrf_field() }}
{{ method_field('patch') }}
@if(setting()->getForCurrentUser('dark-mode-enabled'))
<button class="{{ $classes ?? '' }}"><span>@icon('light-mode')</span><span>{{ trans('common.light_mode') }}</span></button>
@else
<button class="{{ $classes ?? '' }}"><span>@icon('dark-mode')</span><span>{{ trans('common.dark_mode') }}</span></button>
@endif
</form>