github-mirror/BookStack
2
0
Fork 0
mirror of https://github.com/BookStackApp/BookStack.git synced 2025-06-10 13:43:38 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Updated settings nav to be more flexible

Browse Source 
Uses flexbox layout, flexed to content instead of rigid thirds like
before. Also extracted row into own file
This commit is contained in:
Dan Brown
2020-09-26 16:26:30 +01:00
parent de2756dd95
commit 328d2514c4
4 changed files with 28 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
resources/sass/_layout.scss
View File

@ -124,6 +124,9 @@ body.flexbox {
.flex-container-row { .flex-container-row {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
&.v-center {
align-items: center;
}
} }
.flex-container-column { .flex-container-column {
@ -131,9 +134,17 @@ body.flexbox {
flex-direction: column; flex-direction: column;
} }
.flex-container-column.wrap, .flex-container-row.wrap {
flex-wrap: wrap;
}
.flex { .flex {
min-height: 0; min-height: 0;
flex: 1; flex: 1;
&.fit-content {
flex-basis: auto;
flex-grow: 0;
}
} }
.justify-flex-end { .justify-flex-end {

11
resources/views/settings/index.blade.php
View File

@ -3,16 +3,7 @@
@section('body') @section('body')
<div class="container small"> <div class="container small">
<div class="grid left-focus v-center no-row-gap"> @include('settings.navbar-with-version', ['selected' => 'settings'])
<div class="py-m">
@include('settings.navbar', ['selected' => 'settings'])
</div>
<div class="text-right p-m">
<a target="_blank" rel="noopener noreferrer" href="https://github.com/BookStackApp/BookStack/releases">
BookStack @if(strpos($version, 'v') !== 0) version @endif {{ $version }}
</a>
</div>
</div>
<div class="card content-wrap auto-height"> <div class="card content-wrap auto-height">
<h2 id="features" class="list-heading">{{ trans('settings.app_features_security') }}</h2> <h2 id="features" class="list-heading">{{ trans('settings.app_features_security') }}</h2>

11
resources/views/settings/maintenance.blade.php
View File

@ -3,16 +3,7 @@
@section('body') @section('body')
<div class="container small"> <div class="container small">
<div class="grid left-focus v-center no-row-gap"> @include('settings.navbar-with-version', ['selected' => 'maintenance'])
<div class="py-m">
@include('settings.navbar', ['selected' => 'maintenance'])
</div>
<div class="text-right p-m">
<a target="_blank" rel="noopener noreferrer" href="https://github.com/BookStackApp/BookStack/releases">
BookStack @if(strpos($version, 'v') !== 0) version @endif {{ $version }}
</a>
</div>
</div>
<div id="image-cleanup" class="card content-wrap auto-height"> <div id="image-cleanup" class="card content-wrap auto-height">
<h2 class="list-heading">{{ trans('settings.maint_image_cleanup') }}</h2> <h2 class="list-heading">{{ trans('settings.maint_image_cleanup') }}</h2>

15
resources/views/settings/navbar-with-version.blade.php Normal file
View File

@ -0,0 +1,15 @@
{{--
$selected - String name of the selected tab
$version - Version of bookstack to display
--}}
<div class="flex-container-row v-center wrap">
<div class="py-m flex fit-content">
@include('settings.navbar', ['selected' => $selected])
</div>
<div class="flex"></div>
<div class="text-right p-m flex fit-content">
<a target="_blank" rel="noopener noreferrer" href="https://github.com/BookStackApp/BookStack/releases">
BookStack @if(strpos($version, 'v') !== 0) version @endif {{ $version }}
</a>
</div>
</div>