changed role attritubet to class in page editor ui
the role attribute is being used incorrectly through out the site, which is bad for screen reader, so they need to be removed and replaced with the class attribute the page editor was the biggest culprit, so that one has been converted first
This commit is contained in:
parent
3b5c753c9a
commit
a53723f7c8
6 changed files with 105 additions and 170 deletions
|
@ -1,12 +1,12 @@
|
|||
/* FILE MANAGER */
|
||||
main > section[role="file-manager"] {
|
||||
main > section.file-manager {
|
||||
width: 100%;
|
||||
background: var(--primary-highlight);
|
||||
padding: 20px 0;
|
||||
margin-top: 75px;
|
||||
}
|
||||
|
||||
main > section[role="file-manager"] label[role="list-title"] {
|
||||
main > section.file-manager label.list-title {
|
||||
width: 100%;
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
|
@ -14,7 +14,7 @@ main > section[role="file-manager"] label[role="list-title"] {
|
|||
color: var(--primary);
|
||||
}
|
||||
|
||||
main > section[role="file-manager"] > div[role="file-drop"] {
|
||||
main > section.file-manager > div.file-drop {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
@ -28,8 +28,8 @@ main > section[role="file-manager"] > div[role="file-drop"] {
|
|||
margin: 10px auto;
|
||||
}
|
||||
|
||||
main > section[role="file-manager"] > div[role="page-images-list"],
|
||||
main > section[role="file-manager"] > div[role="page-files-list"] {
|
||||
main > section.file-manager > div.page-images-list,
|
||||
main > section.file-manager > div.page-files-list {
|
||||
max-width: 900px;
|
||||
width: 100%;
|
||||
margin: 10px auto;
|
||||
|
@ -38,8 +38,8 @@ main > section[role="file-manager"] > div[role="page-files-list"] {
|
|||
gap: 10px;
|
||||
}
|
||||
|
||||
main > section[role="file-manager"] > div[role="page-images-list"] > div,
|
||||
main > section[role="file-manager"] > div[role="page-files-list"] > div {
|
||||
main > section.file-manager > div.page-images-list > div,
|
||||
main > section.file-manager > div.page-files-list > div {
|
||||
width: 100%;
|
||||
height: 150px;
|
||||
border-radius: 3px;
|
||||
|
@ -48,117 +48,79 @@ main > section[role="file-manager"] > div[role="page-files-list"] > div {
|
|||
cursor: pointer;
|
||||
}
|
||||
|
||||
main
|
||||
> section[role="file-manager"]
|
||||
> div[role="page-images-list"]
|
||||
> div
|
||||
> div.item-progress {
|
||||
main > section.file-manager > div.page-images-list > div > div.item-progress {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: var(--primary);
|
||||
}
|
||||
|
||||
main > section[role="text-editor"] > div[role="text-editor-control"] button {
|
||||
main > section.text-editor > div.text-editor-control button {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
main > section[role="text-editor"] > div[role="text-editor-control"] button > i {
|
||||
main > section.text-editor > div.text-editor-control button > i {
|
||||
font-size: 1.6em;
|
||||
}
|
||||
|
||||
main
|
||||
> section[role="text-editor"]
|
||||
> div[role="text-editor-control"]
|
||||
> button:nth-child(1) {
|
||||
main > section.text-editor > div.text-editor-control > button:nth-child(1) {
|
||||
border-radius: 3px 0 0 3px;
|
||||
}
|
||||
|
||||
main
|
||||
> section[role="text-editor"]
|
||||
> div[role="text-editor-control"]
|
||||
> button:nth-child(10) {
|
||||
main > section.text-editor > div.text-editor-control > button:nth-child(10) {
|
||||
border-radius: 0 3px 3px 0;
|
||||
}
|
||||
|
||||
main
|
||||
> section[role="file-manager"]
|
||||
> div[role="page-images-list"]
|
||||
> div
|
||||
> button.media-remove,
|
||||
main
|
||||
> section[role="file-manager"]
|
||||
> div[role="page-files-list"]
|
||||
> div
|
||||
> button.media-remove {
|
||||
main > section.file-manager > div.page-images-list > div > button.media-remove,
|
||||
main > section.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[role="file-manager"]
|
||||
> div[role="page-images-list"]
|
||||
> div.video-item
|
||||
> video {
|
||||
main > section.file-manager > div.page-images-list > div.video-item > video {
|
||||
object-fit: cover;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
main
|
||||
> section[role="file-manager"]
|
||||
> div[role="page-images-list"]
|
||||
> div.video-item
|
||||
> button,
|
||||
main
|
||||
> section[role="file-manager"]
|
||||
> div[role="page-files-list"]
|
||||
> div.audio-item
|
||||
> button,
|
||||
main
|
||||
> section[role="file-manager"]
|
||||
> div[role="page-files-list"]
|
||||
> div.file-item
|
||||
> button {
|
||||
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 {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
main > section[role="file-manager"] > div[role="page-files-list"] > div.audio-item {
|
||||
main > section.file-manager > div.page-files-list > div.audio-item {
|
||||
background: url("/assets/images/global/upload-audio.png") no-repeat center center /
|
||||
cover;
|
||||
}
|
||||
|
||||
main > section[role="file-manager"] > div[role="page-files-list"] > div.file-item {
|
||||
main > section.file-manager > div.page-files-list > div.file-item {
|
||||
background: url("/assets/images/global/upload-doc.png") no-repeat center center / cover;
|
||||
}
|
||||
|
||||
main > section[role="file-manager"] > div[role="page-files-list"] > div.file-item > a {
|
||||
main > section.file-manager > div.page-files-list > div.file-item > a {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
background: var(--secondary);
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
main
|
||||
> section[role="file-manager"]
|
||||
> div[role="page-files-list"]
|
||||
> div.audio-item
|
||||
> audio {
|
||||
main > section.file-manager > div.page-files-list > div.audio-item > audio {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* PAGE META */
|
||||
|
||||
main > section[role="page-meta"] {
|
||||
main > section.page-meta {
|
||||
width: 100%;
|
||||
background: var(--secondary-highlight);
|
||||
}
|
||||
|
||||
main > section[role="page-meta"] > div[role="page-meta-wrapper"] {
|
||||
main > section.page-meta > div.page-meta-wrapper {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 20px;
|
||||
|
@ -168,7 +130,7 @@ main > section[role="page-meta"] > div[role="page-meta-wrapper"] {
|
|||
color: var(--secondary);
|
||||
}
|
||||
|
||||
main section[role="page-meta"] textarea#post-title-text {
|
||||
main section.page-meta textarea#post-title-text {
|
||||
font-family: var(--base-type);
|
||||
width: 100%;
|
||||
height: 80px;
|
||||
|
@ -176,14 +138,14 @@ main section[role="page-meta"] textarea#post-title-text {
|
|||
color: var(--primary);
|
||||
}
|
||||
|
||||
main section[role="page-meta"] textarea#post-tags {
|
||||
main section.page-meta textarea#post-tags {
|
||||
font-family: var(--base-type);
|
||||
width: 100%;
|
||||
height: 80px;
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
main section[role="page-meta"] select {
|
||||
main section.page-meta select {
|
||||
background: var(--primary);
|
||||
color: var(--secondary);
|
||||
border-radius: 3px;
|
||||
|
@ -194,15 +156,11 @@ main section[role="page-meta"] select {
|
|||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
main section[role="page-meta"] div[role="page-options"] {
|
||||
main section.page-meta div.page-options {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
main
|
||||
section[role="page-meta"]
|
||||
div[role="page-meta-wrapper"]
|
||||
div[role="page-options"]
|
||||
button {
|
||||
main section.page-meta div.page-meta-wrapper div.page-options button {
|
||||
width: 25%;
|
||||
height: 45px;
|
||||
transition: all 0.3s linear;
|
||||
|
@ -214,45 +172,36 @@ main
|
|||
}
|
||||
|
||||
main
|
||||
> section[role="page-meta"]
|
||||
> div[role="page-meta-wrapper"]
|
||||
> div[role="page-options"]
|
||||
> section.page-meta
|
||||
> div.page-meta-wrapper
|
||||
> div.page-options
|
||||
> button.post-option-btn:nth-child(3) {
|
||||
border-radius: 3px 0 0 3px;
|
||||
}
|
||||
|
||||
main
|
||||
> section[role="page-meta"]
|
||||
> div[role="page-meta-wrapper"]
|
||||
> div[role="page-options"]
|
||||
> a
|
||||
> button {
|
||||
main > section.page-meta > div.page-meta-wrapper > div.page-options > a > button {
|
||||
border-radius: 0 3px 3px 0;
|
||||
}
|
||||
|
||||
main
|
||||
section[role="page-meta"]
|
||||
div[role="page-meta-wrapper"]
|
||||
div[role="page-created"]
|
||||
input {
|
||||
main section.page-meta div.page-meta-wrapper div.page-created input {
|
||||
display: none;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
/* TEXT EDITOR */
|
||||
|
||||
main > section[role="text-editor"] {
|
||||
main > section.text-editor {
|
||||
width: 100%;
|
||||
max-width: 900px;
|
||||
margin: 10px auto;
|
||||
}
|
||||
|
||||
main section[role="text-editor"] .icon-hide {
|
||||
main section.text-editor .icon-hide {
|
||||
display: none;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
main > section[role="text-editor"] > div[role="text-editor-control"] {
|
||||
main > section.text-editor > div.text-editor-control {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(10, 1fr);
|
||||
}
|
||||
|
@ -264,7 +213,7 @@ main > section[role="text-editor"] > div[role="text-editor-control"] {
|
|||
top: 65px;
|
||||
}
|
||||
|
||||
main > section[role="text-editor"] > div[role="edit-post-wrapper"] {
|
||||
main > section.text-editor > div.edit-post-wrapper {
|
||||
width: 100%;
|
||||
max-width: 900px;
|
||||
border-radius: 5px;
|
||||
|
@ -272,13 +221,13 @@ main > section[role="text-editor"] > div[role="edit-post-wrapper"] {
|
|||
margin: 10px 0;
|
||||
}
|
||||
|
||||
main > section[role="text-editor"] > div[role="edit-post-wrapper"] textarea:focus {
|
||||
main > section.text-editor > div.edit-post-wrapper textarea:focus {
|
||||
outline: none;
|
||||
border-color: var(--secondary-highlight);
|
||||
}
|
||||
|
||||
main section[role="text-editor"] div[role="edit-post-wrapper"] #edit,
|
||||
main section[role="text-editor"] div[role="edit-post-wrapper"] #highlight {
|
||||
main section.text-editor div.edit-post-wrapper #edit,
|
||||
main section.text-editor div.edit-post-wrapper #highlight {
|
||||
font-family: var(--mono-type);
|
||||
border: 0;
|
||||
width: 100%;
|
||||
|
@ -297,25 +246,25 @@ main section[role="text-editor"] div[role="edit-post-wrapper"] #highlight {
|
|||
margin: 0;
|
||||
}
|
||||
|
||||
main section[role="text-editor"] div[role="edit-post-wrapper"] #highlight-content {
|
||||
main section.text-editor div.edit-post-wrapper #highlight-content {
|
||||
word-wrap: normal;
|
||||
white-space: pre-wrap;
|
||||
line-break: normal;
|
||||
}
|
||||
|
||||
main > section[role="text-editor"] > div[role="edit-post-wrapper"] > #edit {
|
||||
main > section.text-editor > div.edit-post-wrapper > #edit {
|
||||
z-index: 1;
|
||||
background: transparent;
|
||||
color: transparent;
|
||||
caret-color: var(--secondary-highlight);
|
||||
}
|
||||
|
||||
main > section[role="text-editor"] > div[role="edit-post-wrapper"] > #highlight {
|
||||
main > section.text-editor > div.edit-post-wrapper > #highlight {
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
main section[role="text-editor"] div[role="edit-post-wrapper"] pre,
|
||||
main section[role="text-editor"] div[role="edit-post-wrapper"] pre code {
|
||||
main section.text-editor div.edit-post-wrapper pre,
|
||||
main section.text-editor div.edit-post-wrapper pre code {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
@ -323,68 +272,56 @@ main section[role="text-editor"] div[role="edit-post-wrapper"] pre code {
|
|||
/* RESPONSIVE */
|
||||
|
||||
@media only screen and (max-width: 900px) {
|
||||
main > section[role="file-manager"] > div[role="file-drop"],
|
||||
main > section[role="file-manager"] > div[role="page-images-list"],
|
||||
main > section[role="file-manager"] > div[role="page-files-list"],
|
||||
main > section[role="page-meta"] > div[role="page-meta-wrapper"],
|
||||
main > section[role="text-editor"] {
|
||||
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 > section.text-editor {
|
||||
width: 97%;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 480px) {
|
||||
main > section[role="file-manager"] > div[role="page-images-list"],
|
||||
main > section[role="file-manager"] > div[role="page-files-list"] {
|
||||
main > section.file-manager > div.page-images-list,
|
||||
main > section.file-manager > div.page-files-list {
|
||||
grid-template-columns: 1fr 1fr 1fr;
|
||||
}
|
||||
|
||||
main > section[role="file-manager"] > div[role="file-drop"],
|
||||
main > section[role="file-manager"] > div[role="page-images-list"],
|
||||
main > section[role="file-manager"] > div[role="page-files-list"],
|
||||
main > section[role="page-meta"] > div[role="page-meta-wrapper"],
|
||||
main > section[role="text-editor"] {
|
||||
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 > section.text-editor {
|
||||
width: 95%;
|
||||
}
|
||||
|
||||
main > section[role="page-meta"] > div[role="page-meta-wrapper"] {
|
||||
main > section.page-meta > div.page-meta-wrapper {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
main > section[role="text-editor"] > div[role="text-editor-control"] {
|
||||
main > section.text-editor > div.text-editor-control {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(5, 1fr);
|
||||
}
|
||||
|
||||
main
|
||||
> section[role="text-editor"]
|
||||
> div[role="text-editor-control"]
|
||||
> button:nth-child(1) {
|
||||
main > section.text-editor > div.text-editor-control > button:nth-child(1) {
|
||||
border-radius: 3px 0;
|
||||
}
|
||||
|
||||
main
|
||||
> section[role="text-editor"]
|
||||
> div[role="text-editor-control"]
|
||||
> button:nth-child(5) {
|
||||
main > section.text-editor > div.text-editor-control > button:nth-child(5) {
|
||||
border-radius: 0 3px;
|
||||
}
|
||||
|
||||
main
|
||||
> section[role="text-editor"]
|
||||
> div[role="text-editor-control"]
|
||||
> button:nth-child(6) {
|
||||
main > section.text-editor > div.text-editor-control > button:nth-child(6) {
|
||||
border-radius: 0 0 0 3px;
|
||||
}
|
||||
|
||||
main
|
||||
> section[role="text-editor"]
|
||||
> div[role="text-editor-control"]
|
||||
> button:nth-child(10) {
|
||||
main > section.text-editor > div.text-editor-control > button:nth-child(10) {
|
||||
border-radius: 0 0 3px;
|
||||
}
|
||||
|
||||
main section[role="text-editor"] div[role="edit-post-wrapper"] #edit,
|
||||
main section[role="text-editor"] div[role="edit-post-wrapper"] #highlight {
|
||||
main section.text-editor div.edit-post-wrapper #edit,
|
||||
main section.text-editor div.edit-post-wrapper #highlight {
|
||||
font-size: 0.8em;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -10,7 +10,7 @@ export default class PostActions {
|
|||
collectInfo(files) {
|
||||
return new Promise((resolve, reject) => {
|
||||
let pageInfo = [];
|
||||
let pageRef = document.querySelector('[role="file-manager"]');
|
||||
let pageRef = document.querySelector('.file-manager');
|
||||
//process html content for storage
|
||||
let txt = document.createElement('textarea');
|
||||
txt.innerHTML = document.getElementById('highlight-content').innerHTML;
|
||||
|
|
|
@ -28,23 +28,23 @@ export default class PostEditor {
|
|||
this.postUUID = null;
|
||||
this.postLayout = null;
|
||||
this.fm = null;
|
||||
if (document.querySelector('[role="file-manager"]').getAttribute('data-index')) {
|
||||
if (document.querySelector('.file-manager').getAttribute('data-index')) {
|
||||
this.postID = document
|
||||
.querySelector('[role="file-manager"]')
|
||||
.querySelector('.file-manager')
|
||||
.getAttribute('data-index');
|
||||
this.postUUID = document
|
||||
.querySelector('[role="file-manager"]')
|
||||
.querySelector('.file-manager')
|
||||
.getAttribute('data-uuid');
|
||||
this.postLayout = document
|
||||
.querySelector('[role="file-manager"]')
|
||||
.querySelector('.file-manager')
|
||||
.getAttribute('data-layout');
|
||||
}
|
||||
if (document.getElementById('edit')) {
|
||||
this.editor = new TextEditor(
|
||||
document.getElementById('edit'),
|
||||
document.querySelector('[role="file-manager"]').offsetHeight +
|
||||
document.querySelector('[role="page-meta"]').offsetHeight +
|
||||
document.querySelector('[role="text-editor"]').offsetHeight
|
||||
document.querySelector('.page-meta').offsetHeight +
|
||||
document.querySelector('.file-manager').offsetHeight +
|
||||
document.querySelector('.text-editor').offsetHeight
|
||||
);
|
||||
this.editor.addListener(
|
||||
EditorEvent.EDITOR_DELETE,
|
||||
|
@ -89,13 +89,13 @@ export default class PostEditor {
|
|||
// methods
|
||||
//--------------------------
|
||||
start() {
|
||||
if (document.querySelector('[role="file-drop"]')) {
|
||||
if (document.querySelector('.file-drop')) {
|
||||
//insert fileManager here
|
||||
this.fm = new FileManager(
|
||||
document.querySelector('[role="file-drop"]'),
|
||||
document.querySelector('.file-drop'),
|
||||
document.getElementById('page-files-upload'),
|
||||
document.getElementById('page-images-list'),
|
||||
document.querySelector('[role="page-files-list"]')
|
||||
document.querySelector('.page-files-list')
|
||||
);
|
||||
var optionButtons = document.querySelectorAll('.post-option-btn');
|
||||
for (var i = 0, length = optionButtons.length; i < length; i++) {
|
||||
|
|
|
@ -18,22 +18,20 @@ class TextEditor extends EventEmitter {
|
|||
constructor(textEditor, scrollLimit) {
|
||||
super();
|
||||
|
||||
document
|
||||
.querySelector('[role="text-editor-control"]')
|
||||
.addEventListener('scroll', e => {
|
||||
console.log('HERE');
|
||||
});
|
||||
document.querySelector('.text-editor-control').addEventListener('scroll', e => {
|
||||
console.log('HERE');
|
||||
});
|
||||
|
||||
document.body.addEventListener('scroll', e => {
|
||||
var fixLimit = scrollLimit;
|
||||
//console.log('POSITION', document.body.scrollTop + ' : ' + fixLimit);
|
||||
if (document.body.scrollTop + 5 >= fixLimit) {
|
||||
document
|
||||
.querySelector('[role="text-editor-control"]')
|
||||
.querySelector('.text-editor-control')
|
||||
.classList.add('control-freeze');
|
||||
} else {
|
||||
document
|
||||
.querySelector('[role="text-editor-control"]')
|
||||
.querySelector('.text-editor-control')
|
||||
.classList.remove('control-freeze');
|
||||
}
|
||||
});
|
||||
|
@ -47,7 +45,7 @@ class TextEditor extends EventEmitter {
|
|||
.replace(new RegExp('&', 'g'), '&')
|
||||
.replace(new RegExp('<', 'g'), '<');
|
||||
let editorHeight = document.getElementById('highlight').offsetHeight;
|
||||
document.querySelector('[role="edit-post-wrapper"]').style.height =
|
||||
document.querySelector('.edit-post-wrapper').style.height =
|
||||
editorHeight + 'px';
|
||||
e.target.style.height = editorHeight + 30 + 'px'; //TODO: yeah, it's ugly but it works for now, fix soon
|
||||
// Syntax Highlight
|
||||
|
|
|
@ -32,21 +32,21 @@
|
|||
@endphp
|
||||
|
||||
@section('main-content')
|
||||
<section data-index="{{ $id }}" data-uuid="{{ $uuid }}" data-slug="{{ $slug }}" data-layout="{{ $layout }}" role="file-manager">
|
||||
<section data-index="{{ $id }}" data-uuid="{{ $uuid }}" data-slug="{{ $slug }}" data-layout="{{ $layout }}" class="file-manager">
|
||||
@if($feature == '')
|
||||
<div role="file-drop">
|
||||
<div class="file-drop">
|
||||
<label for="page-files-upload">DRAG AND DROP FILES OR CLICK TO SELECT</label>
|
||||
</div>
|
||||
<label role="list-title">IMAGES AND VIDEO</label>
|
||||
<div id="page-images-list" role="page-images-list"></div>
|
||||
<label role="list-title">FILES</label>
|
||||
<div role="page-files-list"></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 role="file-drop">
|
||||
<div class="file-drop">
|
||||
<label for="page-files-upload">DRAG AND DROP FILES OR CLICK TO SELECT</label>
|
||||
</div>
|
||||
<label role="list-title">IMAGES AND VIDEO</label>
|
||||
<div id="page-images-list" role="page-images-list">
|
||||
<label class="list-title">IMAGES AND VIDEO</label>
|
||||
<div id="page-images-list" class="page-images-list">
|
||||
@if(count($media)>1)
|
||||
@foreach($media as $item)
|
||||
@if($item['type'] == "mp4")
|
||||
|
@ -80,8 +80,8 @@
|
|||
@endif
|
||||
@endif
|
||||
</div>
|
||||
<label role="list-title">FILES</label>
|
||||
<div role="page-files-list">
|
||||
<label class="list-title">FILES</label>
|
||||
<div class="page-files-list">
|
||||
@if(count($files) > 1)
|
||||
@foreach($files as $item)
|
||||
@php
|
||||
|
@ -135,17 +135,17 @@
|
|||
|
||||
</div>
|
||||
@endif
|
||||
</section><section role="page-meta">
|
||||
<div role="page-meta-wrapper">
|
||||
<div role="page-title">
|
||||
</section><section class="page-meta">
|
||||
<div class="page-meta-wrapper">
|
||||
<div class="page-title">
|
||||
<strong>TITLE</strong>
|
||||
<textarea id="post-title-text" type="text" name="post-title-text" class="post-edit" placeholder="TITLE">{{ $title }}</textarea>
|
||||
</div>
|
||||
<div role="page-tags">
|
||||
<div class="page-tags">
|
||||
<strong>TAGS</strong>
|
||||
<textarea id="post-tags" type="text" name="post-tags" class="form-control" placeholder="tags [comma seperated]">{{ $tags }}</textarea>
|
||||
</div>
|
||||
<div role="page-layouts">
|
||||
<div class="page-layouts">
|
||||
<strong>LAYOUTS</strong>
|
||||
<select id="page-templates">
|
||||
@foreach($views as $view)
|
||||
|
@ -157,19 +157,19 @@
|
|||
@endforeach
|
||||
</select>
|
||||
</div>
|
||||
<div role="page-options">
|
||||
<div class="page-options">
|
||||
<strong>OPTIONS</strong>
|
||||
@spaceless
|
||||
@include('includes.options')
|
||||
@endspaceless
|
||||
</div>
|
||||
<div role="page-updated">
|
||||
<div class="page-updated">
|
||||
<strong>UPDATED</strong>
|
||||
<span id="post-date" type="text">
|
||||
{{ $updated }}
|
||||
</span>
|
||||
</div>
|
||||
<div role="page-created">
|
||||
<div class="page-created">
|
||||
<strong>CREATED</strong>
|
||||
<span id="post-date" type="text">
|
||||
{{ $date }}
|
||||
|
@ -180,11 +180,11 @@
|
|||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section role="text-editor">
|
||||
<section class="text-editor">
|
||||
@spaceless
|
||||
@include('includes.editor')
|
||||
@endspaceless
|
||||
<div role="edit-post-wrapper">
|
||||
<div class="edit-post-wrapper">
|
||||
<textarea id="edit" spellcheck="false" class="language-md">{{ $content }}</textarea>
|
||||
<pre id="highlight"><code id="highlight-content" class="language-md"></code></pre>
|
||||
</div>
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
<div role="text-editor-control">
|
||||
<div class="text-editor-control">
|
||||
<button id="edit-bold" class="content-editor-btn-text editor-button" title="bold">
|
||||
<svg id="edit-bold" role="icon">
|
||||
<use id="edit-bold" xlink:href="/assets/images/global/sprite.svg#tabler-bold"/>
|
||||
|
|
Loading…
Reference in a new issue