reorganized text editor
moved page meta data to it's own ui to clean up the page editing experience as it was becoming a bit crowded. also moved to saving and deleting buttons to title bar so they are always available added a note to web routes to reorganize them within the web routes file to reduce the confusion present by having them in their own Controllers. it's just an extra layer that's not needed
This commit is contained in:
parent
16856f6c25
commit
9c200ea78d
GPG key ID:
976711B5057688B7
11 changed files with 322 additions and 232 deletions
|
|
@ -1,5 +1,4 @@
|
|||
{
|
||||
"plugins": ["@shufo/prettier-plugin-blade"],
|
||||
"overrides": [
|
||||
{ "files": ".prettierrc", "options": { "parser": "json" } },
|
||||
{
|
||||
|
|
|
|||
|
|
@ -89,53 +89,56 @@ class DashController extends Controller
|
|||
$page = [];
|
||||
$views = [];
|
||||
$mode == 'edit' ? $page = $this->pages->getByUuid($uuid) : $page = [];
|
||||
$mode == 'edit' ? $title = $page['title'] : $title = 'Add New';
|
||||
$mode == 'edit' ? $title = 'Edit Page' : $title = 'Add New';
|
||||
$mode == 'edit' ? $views = $this->themes->getCustomViews($page['layout']) : $views[] = 'page';
|
||||
|
||||
//just a patch for now to get this out of the template
|
||||
if ($mode == 'edit') {
|
||||
$id = $page['id'];
|
||||
$uuid = $page['uuid'];
|
||||
$slug = $page['slug'];
|
||||
$feature = $page['feature'];
|
||||
$layout = $page['layout'];
|
||||
$tags = $page['tags'];
|
||||
$content = $page['content'];
|
||||
$date = $page['created'];
|
||||
$updated = $page['updated'];
|
||||
$media = $page['media'];
|
||||
$files = $page['docs'];
|
||||
$id = $page['id'];
|
||||
$uuid = $page['uuid'];
|
||||
$slug = $page['slug'];
|
||||
$feature = $page['feature'];
|
||||
$layout = $page['layout'];
|
||||
$tags = $page['tags'];
|
||||
$content = $page['content'];
|
||||
$date = $page['created'];
|
||||
$updated = $page['updated'];
|
||||
$media = $page['media'];
|
||||
$files = $page['docs'];
|
||||
$editTitle = $page['title'];
|
||||
} else {
|
||||
$id = "";
|
||||
$uuid = "";
|
||||
$slug = "";
|
||||
$feature = "";
|
||||
$layout = "";
|
||||
$tags = "";
|
||||
$content = "";
|
||||
$date = "";
|
||||
$updated = "";
|
||||
$media = "";
|
||||
$files = "";
|
||||
$id = "";
|
||||
$uuid = "";
|
||||
$slug = "";
|
||||
$feature = "";
|
||||
$layout = "";
|
||||
$tags = "";
|
||||
$content = "";
|
||||
$date = "";
|
||||
$updated = "";
|
||||
$media = "";
|
||||
$files = "";
|
||||
$editTitle = "";
|
||||
};
|
||||
|
||||
return view('back.page', [
|
||||
"status" => $this->member::status(),
|
||||
"mode" => $mode,
|
||||
"page" => $page,
|
||||
"views" => $views,
|
||||
"id" => $id,
|
||||
"uuid" => $uuid,
|
||||
"slug" => $slug,
|
||||
"feature" => $feature,
|
||||
"layout" => $layout,
|
||||
"tags" => $tags,
|
||||
"content" => $content,
|
||||
"date" => $date,
|
||||
"updated" => $updated,
|
||||
"media" => $media,
|
||||
"files" => $files,
|
||||
"title" => urldecode($title),
|
||||
"status" => $this->member::status(),
|
||||
"mode" => $mode,
|
||||
"page" => $page,
|
||||
"views" => $views,
|
||||
"id" => $id,
|
||||
"uuid" => $uuid,
|
||||
"slug" => $slug,
|
||||
"feature" => $feature,
|
||||
"layout" => $layout,
|
||||
"tags" => $tags,
|
||||
"content" => $content,
|
||||
"date" => $date,
|
||||
"updated" => $updated,
|
||||
"media" => $media,
|
||||
"files" => $files,
|
||||
"title" => urldecode($title),
|
||||
"editTitle" => urldecode($editTitle),
|
||||
]);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -4,69 +4,116 @@
|
|||
* Small, reusable classes
|
||||
*/
|
||||
|
||||
|
||||
/*
|
||||
* Padding
|
||||
*/
|
||||
.p1 { padding: 5px; }
|
||||
.pt1 { padding-top: 5px; }
|
||||
.pl1 { padding-left: 5px; }
|
||||
.pr1 { padding-right: 5px; }
|
||||
.pb1 { padding-bottom: 5px; }
|
||||
|
||||
.p2 { padding: 10px; }
|
||||
.pt2 { padding-top: 10px; }
|
||||
.pl2 { padding-left: 10px; }
|
||||
.pr2 { padding-right: 10px; }
|
||||
.pb2 { padding-bottom: 10px; }
|
||||
.p1 {
|
||||
padding: 5px;
|
||||
}
|
||||
.pt1 {
|
||||
padding-top: 5px;
|
||||
}
|
||||
.pl1 {
|
||||
padding-left: 5px;
|
||||
}
|
||||
.pr1 {
|
||||
padding-right: 5px;
|
||||
}
|
||||
.pb1 {
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
|
||||
.p2 {
|
||||
padding: 10px;
|
||||
}
|
||||
.pt2 {
|
||||
padding-top: 10px;
|
||||
}
|
||||
.pl2 {
|
||||
padding-left: 10px;
|
||||
}
|
||||
.pr2 {
|
||||
padding-right: 10px;
|
||||
}
|
||||
.pb2 {
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Margin
|
||||
*/
|
||||
.mt1 { margin-top: 5px; }
|
||||
.ml1 { margin-left: 5px; }
|
||||
.mr1 { margin-right: 5px; }
|
||||
.mb1 { margin-bottom: 5px; }
|
||||
|
||||
.mt2 { margin-top: 10px; }
|
||||
.ml2 { margin-left: 10px; }
|
||||
.mr2 { margin-right: 10px; }
|
||||
.mb2 { margin-bottom: 10px; }
|
||||
.mt1 {
|
||||
margin-top: 5px;
|
||||
}
|
||||
.ml1 {
|
||||
margin-left: 5px;
|
||||
}
|
||||
.mr1 {
|
||||
margin-right: 5px;
|
||||
}
|
||||
.mb1 {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.mt2 {
|
||||
margin-top: 10px;
|
||||
}
|
||||
.ml2 {
|
||||
margin-left: 10px;
|
||||
}
|
||||
.mr2 {
|
||||
margin-right: 10px;
|
||||
}
|
||||
.mb2 {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Layout
|
||||
*/
|
||||
.row {
|
||||
display: flex;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.col {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.items-center {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.justify-center {
|
||||
display: flex;
|
||||
justify-content: flex;
|
||||
display: flex;
|
||||
justify-content: flex;
|
||||
}
|
||||
|
||||
.grow {
|
||||
flex-grow: 1;
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Borders and rounding
|
||||
*/
|
||||
.rounded {
|
||||
overflow: hidden;
|
||||
border-radius: 5px;
|
||||
overflow: hidden;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Show/Hide
|
||||
*/
|
||||
|
||||
.hide-el {
|
||||
display: none;
|
||||
visibility: hidden;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.show-grid {
|
||||
display: grid;
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,12 +1,27 @@
|
|||
/* FILE MANAGER */
|
||||
main > section.file-manager {
|
||||
width: 100%;
|
||||
section.meta {
|
||||
background: var(--primary-highlight);
|
||||
padding: 20px 0;
|
||||
margin-top: 75px;
|
||||
display: grid;
|
||||
grid-template-columns: 70% 1fr;
|
||||
width: 90%;
|
||||
max-width: 800px;
|
||||
margin: 50px auto 0;
|
||||
position: absolute;
|
||||
top: 215px;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
padding: 10px;
|
||||
z-index: 500;
|
||||
border-radius: 3px;
|
||||
transition: all 0.2s linear;
|
||||
/* JUST FOR TESTING, ADD FINAL TO ATOMIC */
|
||||
}
|
||||
|
||||
main > section.file-manager label.list-title {
|
||||
/* FILE MANAGER */
|
||||
main > section > div.file-manager {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
main > section > div.file-manager label.list-title {
|
||||
width: 100%;
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
|
|
@ -14,22 +29,22 @@ main > section.file-manager label.list-title {
|
|||
color: var(--primary);
|
||||
}
|
||||
|
||||
main > section.file-manager > div.file-drop {
|
||||
main > section > div.file-manager > div.file-drop {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
min-height: 100px;
|
||||
background: var(--white);
|
||||
color: var(--primary);
|
||||
color: var(--white);
|
||||
background: var(--primary);
|
||||
vertical-align: middle;
|
||||
border-radius: 5px;
|
||||
max-width: 900px;
|
||||
margin: 10px auto;
|
||||
}
|
||||
|
||||
main > section.file-manager > div.page-images-list,
|
||||
main > section.file-manager > div.page-files-list {
|
||||
main > section > div.file-manager > div.page-images-list,
|
||||
main > section > div.file-manager > div.page-files-list {
|
||||
max-width: 900px;
|
||||
width: 100%;
|
||||
margin: 10px auto;
|
||||
|
|
@ -38,8 +53,8 @@ main > section.file-manager > div.page-files-list {
|
|||
gap: 10px;
|
||||
}
|
||||
|
||||
main > section.file-manager > div.page-images-list > div,
|
||||
main > section.file-manager > div.page-files-list > div {
|
||||
main > section > div.file-manager > div.page-images-list > div,
|
||||
main > section > div.file-manager > div.page-files-list > div {
|
||||
width: 100%;
|
||||
height: 150px;
|
||||
border-radius: 3px;
|
||||
|
|
@ -48,7 +63,7 @@ main > section.file-manager > div.page-files-list > div {
|
|||
cursor: pointer;
|
||||
}
|
||||
|
||||
main > section.file-manager > div.page-images-list > div > div.item-progress {
|
||||
main > section > div.file-manager > div.page-images-list > div > div.item-progress {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: var(--primary);
|
||||
|
|
@ -70,80 +85,70 @@ main > section.text-editor > div.text-editor-control > button:nth-child(10) {
|
|||
border-radius: 0 3px 3px 0;
|
||||
}
|
||||
|
||||
main > section.file-manager > div.page-images-list > div > button.media-remove,
|
||||
main > section.file-manager > div.page-files-list > div > button.media-remove {
|
||||
main > section > div.file-manager > div.page-images-list > div > button.media-remove,
|
||||
main > section > div.file-manager > div.page-files-list > div > button.media-remove {
|
||||
color: var(--white);
|
||||
margin: 5px;
|
||||
padding: 10px 15px 7px;
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
main > section.file-manager > div.page-images-list > div.video-item > video {
|
||||
main > section > div.file-manager > div.page-images-list > div.video-item > video {
|
||||
object-fit: cover;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
main > section.file-manager > div.page-images-list > div.video-item > button,
|
||||
main > section.file-manager > div.page-files-list > div.audio-item > button,
|
||||
main > section.file-manager > div.page-files-list > div.file-item > button {
|
||||
main > section > div.file-manager > div.page-images-list > div.video-item > button,
|
||||
main > section > div.file-manager > div.page-files-list > div.audio-item > button,
|
||||
main > section > div.file-manager > div.page-files-list > div.file-item > button {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
main > section.file-manager > div.page-files-list > div.audio-item {
|
||||
main > section > div.file-manager > div.page-files-list > div.audio-item {
|
||||
background: url("/assets/images/global/upload-audio.png") no-repeat center center /
|
||||
cover;
|
||||
}
|
||||
|
||||
main > section.file-manager > div.page-files-list > div.file-item {
|
||||
main > section > div.file-manager > div.page-files-list > div.file-item {
|
||||
background: url("/assets/images/global/upload-doc.png") no-repeat center center / cover;
|
||||
}
|
||||
|
||||
main > section.file-manager > div.page-files-list > div.file-item > a {
|
||||
main > section > div.file-manager > div.page-files-list > div.file-item > a {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
background: var(--secondary);
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
main > section.file-manager > div.page-files-list > div.audio-item > audio {
|
||||
main > section > div.file-manager > div.page-files-list > div.audio-item > audio {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* PAGE META */
|
||||
|
||||
main > section.page-meta {
|
||||
width: 100%;
|
||||
background: var(--secondary-highlight);
|
||||
main > section > div.page-meta {
|
||||
padding: 10px;
|
||||
font-size: 0.8em;
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
main > section.page-meta > div.page-meta-wrapper {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 20px;
|
||||
width: 100%;
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
color: var(--secondary);
|
||||
}
|
||||
|
||||
main section.page-meta textarea#post-title-text {
|
||||
main div.page-meta textarea#post-title-text {
|
||||
font-family: var(--base-type);
|
||||
width: 100%;
|
||||
height: 80px;
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
main section.page-meta textarea#post-tags {
|
||||
main div.page-meta textarea#post-tags {
|
||||
font-family: var(--base-type);
|
||||
width: 100%;
|
||||
height: 80px;
|
||||
}
|
||||
|
||||
main section.page-meta select {
|
||||
main div.page-meta select {
|
||||
background: var(--primary);
|
||||
color: var(--secondary);
|
||||
border-radius: 3px;
|
||||
|
|
@ -154,11 +159,11 @@ main section.page-meta select {
|
|||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
main section.page-meta div.page-options {
|
||||
main div.page-meta div.page-options {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
main section.page-meta div.page-meta-wrapper div.page-options button {
|
||||
main div.page-meta div.page-options button {
|
||||
width: 25%;
|
||||
height: 45px;
|
||||
transition: all 0.3s linear;
|
||||
|
|
@ -169,19 +174,15 @@ main section.page-meta div.page-meta-wrapper div.page-options button {
|
|||
text-align: center;
|
||||
}
|
||||
|
||||
main
|
||||
> section.page-meta
|
||||
> div.page-meta-wrapper
|
||||
> div.page-options
|
||||
> button.post-option-btn:nth-child(3) {
|
||||
main > div.page-meta > div.page-options > button.post-option-btn:nth-child(3) {
|
||||
border-radius: 3px 0 0 3px;
|
||||
}
|
||||
|
||||
main > section.page-meta > div.page-meta-wrapper > div.page-options > a > button {
|
||||
main > section > div.page-meta > div.page-options > a > button {
|
||||
border-radius: 0 3px 3px 0;
|
||||
}
|
||||
|
||||
main section.page-meta div.page-meta-wrapper div.page-created input {
|
||||
main div.page-meta div.page-created input {
|
||||
display: none;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
|
@ -191,7 +192,18 @@ main section.page-meta div.page-meta-wrapper div.page-created input {
|
|||
main > section.text-editor {
|
||||
width: 100%;
|
||||
max-width: 900px;
|
||||
margin: 10px auto;
|
||||
margin: 90px auto;
|
||||
}
|
||||
|
||||
main > section.text-editor .page-title #post-title-text {
|
||||
font-size: 2em;
|
||||
font-family: var(--base-type);
|
||||
width: 99%;
|
||||
padding: 5px;
|
||||
font-weight: 550;
|
||||
height: 48px;
|
||||
border-bottom: 1px solid var(--primary-highlight);
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
main section.text-editor .icon-hide {
|
||||
|
|
@ -270,10 +282,10 @@ main section.text-editor div.edit-post-wrapper pre code {
|
|||
/* RESPONSIVE */
|
||||
|
||||
@media only screen and (max-width: 900px) {
|
||||
main > section.file-manager > div.file-drop,
|
||||
main > section.file-manager > div.page-images-list,
|
||||
main > section.file-manager > div.page-files-list,
|
||||
main > section.page-meta > div.page-meta-wrapper,
|
||||
main > div.file-manager > div.file-drop,
|
||||
main > div.file-manager > div.page-images-list,
|
||||
main > div.file-manager > div.page-files-list,
|
||||
main > div.page-meta > div.page-meta-wrapper,
|
||||
main > section.text-editor {
|
||||
width: 97%;
|
||||
}
|
||||
|
|
@ -284,20 +296,20 @@ main section.text-editor div.edit-post-wrapper pre code {
|
|||
}
|
||||
|
||||
@media only screen and (max-width: 480px) {
|
||||
main > section.file-manager > div.page-images-list,
|
||||
main > section.file-manager > div.page-files-list {
|
||||
main > div.file-manager > div.page-images-list,
|
||||
main > div.file-manager > div.page-files-list {
|
||||
grid-template-columns: 1fr 1fr 1fr;
|
||||
}
|
||||
|
||||
main > section.file-manager > div.file-drop,
|
||||
main > section.file-manager > div.page-images-list,
|
||||
main > section.file-manager > div.page-files-list,
|
||||
main > section.page-meta > div.page-meta-wrapper,
|
||||
main > div.file-manager > div.file-drop,
|
||||
main > div.file-manager > div.page-images-list,
|
||||
main > div.file-manager > div.page-files-list,
|
||||
main > div.page-meta > div.page-meta-wrapper,
|
||||
main > section.text-editor {
|
||||
width: 95%;
|
||||
}
|
||||
|
||||
main > section.page-meta > div.page-meta-wrapper {
|
||||
main > div.page-meta > div.page-meta-wrapper {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -105,6 +105,18 @@ export default class PostEditor {
|
|||
);
|
||||
}
|
||||
}
|
||||
let metabtn = document.getElementById('meta-info-toggle');
|
||||
let meta = document.querySelector('.meta');
|
||||
metabtn.addEventListener('click', e => {
|
||||
let metaO = window.getComputedStyle(meta).getPropertyValue('opacity');
|
||||
if (metaO == 0) {
|
||||
meta.classList.remove('hide-el');
|
||||
meta.classList.add('show-grid');
|
||||
} else {
|
||||
meta.classList.add('hide-el');
|
||||
meta.classList.remove('show-grid');
|
||||
}
|
||||
});
|
||||
}
|
||||
//--------------------------
|
||||
// event handlers
|
||||
|
|
|
|||
|
|
@ -1,42 +1,34 @@
|
|||
@extends('frame')
|
||||
@section('title', 'The Dash | Editing '. $title)
|
||||
@section('title', 'The Dash | Editing '. $editTitle)
|
||||
|
||||
@section('main-content')
|
||||
<section data-index="{{$id}}" data-uuid="{{$uuid}}" data-slug="{{$slug}}" data-layout="{{$layout}}" class="file-manager">
|
||||
@if($feature == '')
|
||||
<div class="file-drop">
|
||||
<label for="page-files-upload">DRAG AND DROP FILES OR CLICK TO SELECT</label>
|
||||
</div>
|
||||
<label class="list-title">IMAGES AND VIDEO</label>
|
||||
<div id="page-images-list" class="page-images-list"></div>
|
||||
<label class="list-title">FILES</label>
|
||||
<div class="page-files-list"></div>
|
||||
@else
|
||||
<div class="file-drop">
|
||||
<label for="page-files-upload">DRAG AND DROP FILES OR CLICK TO SELECT</label>
|
||||
</div>
|
||||
<label class="list-title">IMAGES AND VIDEO</label>
|
||||
<div id="page-images-list" class="page-images-list">
|
||||
@include('includes.media-list')
|
||||
</div>
|
||||
<label class="list-title">FILES</label>
|
||||
<div class="page-files-list">
|
||||
@include('includes.files-list')
|
||||
</div>
|
||||
@endif
|
||||
</section>
|
||||
<section class="page-meta">
|
||||
<div class="page-meta-wrapper">
|
||||
<div class="page-title">
|
||||
<strong>TITLE</strong>
|
||||
<textarea id="post-title-text" class="input-dark" type="text" name="post-title-text" class="post-edit" placeholder="TITLE">{{$title}}</textarea>
|
||||
</div>
|
||||
<div class="page-tags">
|
||||
<strong>TAGS</strong>
|
||||
<textarea id="post-tags" class="input-dark" type="text" name="post-tags" class="form-control" placeholder="tags [comma seperated]">{{$tags}}</textarea>
|
||||
</div>
|
||||
<section class="meta hide-el">
|
||||
<div data-index="{{$id}}" data-uuid="{{$uuid}}" data-slug="{{$slug}}" data-layout="{{$layout}}" class="file-manager">
|
||||
@if($feature == '')
|
||||
<div class="file-drop">
|
||||
<label for="page-files-upload">DRAG AND DROP FILES OR CLICK TO SELECT</label>
|
||||
</div>
|
||||
<label class="list-title">IMAGES AND VIDEO</label>
|
||||
<div id="page-images-list" class="page-images-list"></div>
|
||||
<label class="list-title">FILES</label>
|
||||
<div class="page-files-list"></div>
|
||||
@else
|
||||
<div class="file-drop">
|
||||
<label for="page-files-upload">DRAG AND DROP FILES OR CLICK TO SELECT</label>
|
||||
</div>
|
||||
<label class="list-title">IMAGES AND VIDEO</label>
|
||||
<div id="page-images-list" class="page-images-list">
|
||||
@include('includes.media-list')
|
||||
</div>
|
||||
<label class="list-title">FILES</label>
|
||||
<div class="page-files-list">
|
||||
@include('includes.files-list')
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
<div class="page-meta">
|
||||
<div class="page-layouts">
|
||||
<strong>LAYOUTS</strong>
|
||||
LAYOUTS
|
||||
<select id="page-templates">
|
||||
@foreach($views as $view)
|
||||
@if($view == $layout)
|
||||
|
|
@ -47,18 +39,22 @@
|
|||
@endforeach
|
||||
</select>
|
||||
</div>
|
||||
<div class="page-tags">
|
||||
TAGS
|
||||
<textarea id="post-tags" class="input-dark" type="text" name="post-tags" class="form-control" placeholder="tags [comma seperated]">{{$tags}}</textarea>
|
||||
</div>
|
||||
<div class="page-options">
|
||||
<strong>OPTIONS</strong>
|
||||
OPTIONS
|
||||
@include('includes.options')
|
||||
</div>
|
||||
<div class="page-updated">
|
||||
<strong>UPDATED</strong>
|
||||
UPDATED
|
||||
<span id="post-date" type="text">
|
||||
{{$updated}}
|
||||
</span>
|
||||
</div>
|
||||
<div class="page-created">
|
||||
<strong>CREATED</strong>
|
||||
CREATED
|
||||
<span id="post-date" type="text">
|
||||
{{$date}}
|
||||
</span>
|
||||
|
|
@ -67,9 +63,11 @@
|
|||
<input id="form_token" name="token" type="hidden" value="needtoaddtoken">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="text-editor">
|
||||
<div class="page-title">
|
||||
<textarea id="post-title-text" class="input-dark" type="text" name="post-title-text" class="post-edit" placeholder="TITLE">{{$editTitle}}</textarea>
|
||||
</div>
|
||||
@include('includes.editor')
|
||||
<div class="edit-post-wrapper">
|
||||
<textarea id="edit" spellcheck="false" class="language-md">{{$content}}</textarea>
|
||||
|
|
|
|||
|
|
@ -1,60 +1,42 @@
|
|||
<div class="text-editor-control">
|
||||
<button id="edit-bold" class="content-editor-btn-text editor-button" title="bold">
|
||||
<svg id="edit-bold" class="icon">
|
||||
<use id="edit-bold" xlink:href="/assets/images/global/sprite.svg#tabler-bold"/>
|
||||
</svg>
|
||||
<use id="edit-bold" xlink:href="/assets/images/global/sprite.svg#tabler-bold" />
|
||||
</svg>
|
||||
</button>
|
||||
<button id="edit-italic" class="content-editor-btn-text editor-button" title="italic">
|
||||
<svg id="edit-italic" class="icon">
|
||||
<use id="edit-italic" xlink:href="/assets/images/global/sprite.svg#tabler-italic"/>
|
||||
</svg>
|
||||
<use id="edit-italic" xlink:href="/assets/images/global/sprite.svg#tabler-italic" />
|
||||
</svg>
|
||||
</button>
|
||||
<button id="edit-strikethrough" class="content-editor-btn-text editor-button" title="strikethrough">
|
||||
<svg id="edit-strikethrough" class="icon">
|
||||
<use id="edit-strikethrough" xlink:href="/assets/images/global/sprite.svg#tabler-strikethrough"/>
|
||||
</svg>
|
||||
<use id="edit-strikethrough" xlink:href="/assets/images/global/sprite.svg#tabler-strikethrough" />
|
||||
</svg>
|
||||
</button>
|
||||
<button id="edit-link" class="content-editor-btn-icon editor-button" title="insert link">
|
||||
<svg id="edit-link" class="icon">
|
||||
<use id="edit-link" xlink:href="/assets/images/global/sprite.svg#entypo-link"/>
|
||||
</svg>
|
||||
<use id="edit-link" xlink:href="/assets/images/global/sprite.svg#entypo-link" />
|
||||
</svg>
|
||||
</button>
|
||||
<button id="edit-header1" class="content-editor-btn-text editor-button" title="header 1">
|
||||
<svg id="edit-header1" class="icon">
|
||||
<use id="edit-header1" xlink:href="/assets/images/global/sprite.svg#tabler-heading-1"/>
|
||||
</svg>
|
||||
<use id="edit-header1" xlink:href="/assets/images/global/sprite.svg#tabler-heading-1" />
|
||||
</svg>
|
||||
</button>
|
||||
<button id="edit-header2" class="content-editor-btn-text editor-button" title="header 2">
|
||||
<svg id="edit-header2" class="icon">
|
||||
<use id="edit-header2" xlink:href="/assets/images/global/sprite.svg#tabler-heading-2"/>
|
||||
</svg>
|
||||
<use id="edit-header2" xlink:href="/assets/images/global/sprite.svg#tabler-heading-2" />
|
||||
</svg>
|
||||
</button>
|
||||
<button id="edit-header3" class="content-editor-btn-text editor-button" title="header 3">
|
||||
<svg id="edit-header3" class="icon">
|
||||
<use id="edit-header3" xlink:href="/assets/images/global/sprite.svg#tabler-heading-3"/>
|
||||
</svg>
|
||||
<use id="edit-header3" xlink:href="/assets/images/global/sprite.svg#tabler-heading-3" />
|
||||
</svg>
|
||||
</button>
|
||||
<button id="edit-image" class="content-editor-btn-icon editor-button" title="insert image">
|
||||
<svg id="edit-image" class="icon">
|
||||
<use id="edit-image" xlink:href="/assets/images/global/sprite.svg#entypo-image"/>
|
||||
</svg>
|
||||
<use id="edit-image" xlink:href="/assets/images/global/sprite.svg#entypo-image" />
|
||||
</svg>
|
||||
</button>
|
||||
@if($mode == "edit")
|
||||
<button id="edit-update" class="post-sumbit-btn submit-start editor-button" data-action='blog-update' data-id="{{ $page['uuid'] }} type='submit' title=" bold">
|
||||
<svg id="edit-update" class="icon">
|
||||
<use id="edit-update" xlink:href="/assets/images/global/sprite.svg#entypo-save"/>
|
||||
</svg>
|
||||
</button>
|
||||
<button id="edit-delete" class="content-editor-btn-icon editor-button submit-delete" for="post-delete" title='delete post'>
|
||||
<svg id="edit-delete" class="icon">
|
||||
<use id="edit-delete" xlink:href="/assets/images/global/sprite.svg#entypo-cross"/>
|
||||
</svg>
|
||||
</button>
|
||||
@else
|
||||
<button id="edit-save" class="post-sumbit-btn submit-start editor-button" data-action='blog-add' type='submit'>
|
||||
<svg id="edit-save" class="icon">
|
||||
<use id="edit-save" xlink:href="/assets/images/global/sprite.svg#entypo-plus"/>
|
||||
</svg>
|
||||
</button>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1,52 +1,64 @@
|
|||
<div class="menu">
|
||||
@if($title == "Settings" )
|
||||
@include('includes.submenu-settings')
|
||||
@elseif($title == "Start" )
|
||||
@include('includes.submenu-start')
|
||||
@endif
|
||||
@switch($title)
|
||||
@case("Settings")
|
||||
@include('includes.submenu-settings')
|
||||
@break
|
||||
|
||||
@case("Start")
|
||||
@include('includes.submenu-start')
|
||||
@break
|
||||
|
||||
@case("Edit Page")
|
||||
@include('includes.submenu-edit-page')
|
||||
@break
|
||||
@endswitch
|
||||
<a id="settings" class="main-nav-secondary-highlight" href="/dashboard/settings" title="settings">
|
||||
<svg id="nav-settings-icon" class="icon">
|
||||
<use id="nav-settings-icon" xlink:href="/assets/images/global/sprite.svg#entypo-cog"/>
|
||||
<use id="nav-settings-icon" xlink:href="/assets/images/global/sprite.svg#entypo-cog" />
|
||||
</svg>
|
||||
</a>
|
||||
<a id="navigation" class="main-nav-secondary-highlight" href="/dashboard/navigation" title="edit navigation">
|
||||
<svg id="nav-menu-icon" class="icon">
|
||||
<use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-link"/>
|
||||
<use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-link" />
|
||||
</svg>
|
||||
</a>
|
||||
<a id="navigation" class="main-nav-secondary-highlight" href="/dashboard/logout" title="log out">
|
||||
<svg id="nav-logout-icon" class="icon">
|
||||
<use id="nav-logout-icon" xlink:href="/assets/images/global/sprite.svg#entypo-log-out"/>
|
||||
<use id="nav-logout-icon" xlink:href="/assets/images/global/sprite.svg#entypo-log-out" />
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<label id='menu-toggle-label' for="mobile-toggle">
|
||||
<svg id="nav-menu-icon" class="icon">
|
||||
<use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-menu"/>
|
||||
</svg>
|
||||
<svg id="nav-menu-icon" class="icon">
|
||||
<use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-menu" />
|
||||
</svg>
|
||||
</label>
|
||||
<input id="mobile-toggle" type="checkbox" />
|
||||
|
||||
<div class="mobile-menu">
|
||||
@if($title == "Settings" )
|
||||
@include('includes.submenu-settings')
|
||||
@elseif($title == "Start" )
|
||||
@include('includes.submenu-start')
|
||||
@endif
|
||||
@switch($title)
|
||||
@case("Settings")
|
||||
@include('includes.submenu-settings')
|
||||
@break
|
||||
|
||||
@case("Start")
|
||||
@include('includes.submenu-start')
|
||||
@break
|
||||
@endswitch
|
||||
<a id="settings" class="main-nav-secondary-highlight" href="/dashboard/settings" title="settings">
|
||||
<svg id="nav-settings-icon" class="icon">
|
||||
<use id="nav-settings-icon" xlink:href="/assets/images/global/sprite.svg#entypo-cog"/>
|
||||
<use id="nav-settings-icon" xlink:href="/assets/images/global/sprite.svg#entypo-cog" />
|
||||
</svg>
|
||||
</a>
|
||||
<a id="navigation" class="main-nav-secondary-highlight" href="/dashboard/navigation" title="edit navigation">
|
||||
<svg id="nav-menu-icon" class="icon">
|
||||
<use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-link"/>
|
||||
<use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-link" />
|
||||
</svg>
|
||||
</a>
|
||||
<a id="navigation" class="main-nav-secondary-highlight" href="/dashboard/logout" title="log out">
|
||||
<svg id="nav-logout-icon" class="icon">
|
||||
<use id="nav-logout-icon" xlink:href="/assets/images/global/sprite.svg#entypo-log-out"/>
|
||||
<use id="nav-logout-icon" xlink:href="/assets/images/global/sprite.svg#entypo-log-out" />
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
25
resources/views/includes/submenu-edit-page.blade.php
Normal file
25
resources/views/includes/submenu-edit-page.blade.php
Normal file
|
|
@ -0,0 +1,25 @@
|
|||
<div class="submenu">
|
||||
<button id="meta-info-toggle" title="page meta">
|
||||
<svg id="meta-info-toggle" class="icon">
|
||||
<use id="meta-info-toggle" xlink:href="/assets/images/global/sprite.svg#entypo-layers" />
|
||||
</svg>
|
||||
</button>
|
||||
@if($mode == "edit")
|
||||
<button id="edit-update" class="post-sumbit-btn submit-start editor-button" data-action='blog-update' data-id="{{$page['uuid']}}" title="update page">
|
||||
<svg id="edit-update" class="icon">
|
||||
<use id="edit-update" xlink:href="/assets/images/global/sprite.svg#entypo-save" />
|
||||
</svg>
|
||||
</button>
|
||||
<button id="edit-delete" class="content-editor-btn-icon editor-button submit-delete" for="post-delete" title='delete page'>
|
||||
<svg id="edit-delete" class="icon">
|
||||
<use id="edit-delete" xlink:href="/assets/images/global/sprite.svg#entypo-cross" />
|
||||
</svg>
|
||||
</button>
|
||||
@else
|
||||
<button id="edit-save" class="post-sumbit-btn submit-start editor-button" data-action='blog-add' type='submit'>
|
||||
<svg id="edit-save" class="icon">
|
||||
<use id="edit-save" xlink:href="/assets/images/global/sprite.svg#entypo-plus" />
|
||||
</svg>
|
||||
</button>
|
||||
@endif
|
||||
</div>
|
||||
|
|
@ -1,12 +1,12 @@
|
|||
<div class="submenu">
|
||||
<a class="main-nav-primary" href='/dashboard/pages' title="view pages">
|
||||
<svg id="option-menu-pin" class="icon">
|
||||
<use id="option-menu-pin" xlink:href="/assets/images/global/sprite.svg#minicute-book"/>
|
||||
<use id="option-menu-pin" xlink:href="/assets/images/global/sprite.svg#minicute-book" />
|
||||
</svg>
|
||||
</a>
|
||||
<a class="main-nav-primary" href='/dashboard/page/add/new' title="add new page">
|
||||
<svg id="option-menu-pin" class="icon">
|
||||
<use id="option-menu-pin" xlink:href="/assets/images/global/sprite.svg#entypo-squared-plus"/>
|
||||
<use id="option-menu-pin" xlink:href="/assets/images/global/sprite.svg#entypo-squared-plus" />
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -18,7 +18,7 @@ use App\Http\Middleware\VerifyCsrfToken;
|
|||
|
|
||||
*/
|
||||
|
||||
//routing needs a bit more nuance, so requests are sent to a controller to sort traffic
|
||||
//REFACTOR: Reorganize routes here intstead of controllers to reduce confusion
|
||||
Route::get("/{first?}/{second?}/{third?}/{four?}", [RouteGetController::class, 'handleRequest']);
|
||||
Route::post("/{first?}/{second?}/{third?}", [RoutePostController::class, 'handleRequest'])
|
||||
->middleware(VerifyCsrfToken::class);
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue