1
0
mirror of https://github.com/BookStackApp/BookStack.git synced 2024-10-29 23:22:34 +01:00

Standardised export views with base layout, Reduced included export styles

Related to #2666
This commit is contained in:
Dan Brown 2021-05-04 23:15:05 +01:00
parent 43b6633183
commit 95798a2eba
6 changed files with 73 additions and 117 deletions

View File

@ -1,16 +1,13 @@
@import "variables";
@import "mixins";
@import "spacing";
@import "html";
@import "text";
@import "layout";
@import "blocks";
@import "tables";
@import "header";
@import "lists";
@import "pages";
html, body {
background-color: #FFF;
}
@ -40,4 +37,25 @@ pre:after {
}
pre code {
white-space: pre-wrap;
}
.page-break {
page-break-after: always;
}
@media screen {
.page-break {
border-top: 1px solid #DDD;
}
}
ul.contents ul li {
list-style: circle;
}
.chapter-hint {
color: #888;
margin-top: 32px;
}
.chapter-hint + h1 {
margin-top: 0;
}

View File

@ -1,38 +1,8 @@
<!doctype html>
<html lang="{{ config('app.lang') }}">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>{{ $book->name }}</title>
@extends('export-layout')
@include('partials.export-styles', ['format' => $format])
<style>
.page-break {
page-break-after: always;
}
.chapter-hint {
color: #888;
margin-top: 32px;
}
.chapter-hint + h1 {
margin-top: 0;
}
ul.contents ul li {
list-style: circle;
}
@media screen {
.page-break {
border-top: 1px solid #DDD;
}
}
</style>
@yield('head')
@include('partials.export-custom-head')
</head>
<body>
<div class="page-content">
@section('title', $book->name)
@section('content')
<h1 style="font-size: 4.8em">{{$book->name}}</h1>
<p>{{ $book->description }}</p>
@ -73,8 +43,4 @@
@endif
@endforeach
</div>
</body>
</html>
@endsection

View File

@ -1,30 +1,8 @@
<!doctype html>
<html lang="{{ config('app.lang') }}">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>{{ $chapter->name }}</title>
@extends('export-layout')
@include('partials.export-styles', ['format' => $format])
<style>
.page-break {
page-break-after: always;
}
ul.contents ul li {
list-style: circle;
}
@media screen {
.page-break {
border-top: 1px solid #DDD;
}
}
</style>
@include('partials.export-custom-head')
</head>
<body>
<div class="page-content">
@section('title', $chapter->name)
@section('content')
<h1 style="font-size: 4.8em">{{$chapter->name}}</h1>
<p>{{ $chapter->description }}</p>
@ -42,8 +20,4 @@
<h1 id="page-{{$page->id}}">{{ $page->name }}</h1>
{!! $page->html !!}
@endforeach
</div>
</body>
</html>
@endsection

View File

@ -0,0 +1,15 @@
<!doctype html>
<html lang="{{ config('app.lang') }}">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>@yield('title')</title>
@include('partials.export-styles', ['format' => $format])
@include('partials.export-custom-head')
</head>
<body>
<div class="page-content">
@yield('content')
</div>
</body>
</html>

View File

@ -1,51 +1,13 @@
<!doctype html>
<html lang="{{ config('app.lang') }}">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>{{ $page->name }}</title>
@extends('export-layout')
@include('partials.export-styles', ['format' => $format])
@section('title', $page->name)
@if($format === 'pdf')
<style>
body {
font-size: 14px;
line-height: 1.2;
}
@section('content')
@include('pages.page-display')
h1, h2, h3, h4, h5, h6 {
line-height: 1.2;
}
table {
max-width: 800px !important;
font-size: 0.8em;
width: 100% !important;
}
table td {
width: auto !important;
}
</style>
@endif
@include('partials.export-custom-head')
</head>
<body>
<div id="page-show">
<div class="page-content">
@include('pages.page-display')
<hr>
<div class="text-muted text-small">
@include('partials.entity-export-meta', ['entity' => $page])
</div>
<hr>
<div class="text-muted text-small">
@include('partials.entity-export-meta', ['entity' => $page])
</div>
</div>
</body>
</html>
@endsection

View File

@ -6,6 +6,27 @@
@if ($format === 'pdf')
<style>
/* PDF size adjustments */
body {
font-size: 14px;
line-height: 1.2;
}
h1, h2, h3, h4, h5, h6 {
line-height: 1.2;
}
table {
max-width: 800px !important;
font-size: 0.8em;
width: 100% !important;
}
table td {
width: auto !important;
}
/* Patches for CSS variable colors */
a {
color: {{ setting('app-color') }};