Merge 'develop' 2.6.0 upadte into beta
Massive update covering issues #71, #80, #81, #83 as well as updated responsive styles and an overhauled File Managerbeta
commit
302362a478
GPG Key ID:
29B551CDBD4D3B50
@ -1,6 +1,3 @@
|
||||
{
|
||||
"extends": [
|
||||
"stylelint-config-standard-scss",
|
||||
"stylelint-config-prettier-scss"
|
||||
]
|
||||
"extends": ["stylelint-config-standard"]
|
||||
}
|
||||
|
||||
@ -1,13 +1,9 @@
|
||||
|
||||
|
||||
# Fipamo means to save
|
||||
|
||||
The Fipamo project was born from a need for a simple, easy to use no data blog platform that doesn't require much effort to set up and maintain. Fipamo uses Markdown to handle posts and renders them to flat html so you can serve them from anywhere. No complicated set ups. No long list of dependencies. Just set up and go.
|
||||
|
||||
Because nobody has time for all that.
|
||||
|
||||
## Check the (WIP) Docs to get you started. <br>
|
||||
## Check the (WIP) Docs to get you started. <br>
|
||||
|
||||
[Getting Started](https://code.playvicio.us/Are0h/Fipamo/wiki/00---Start) <br>
|
||||
[Install](https://code.playvicio.us/Are0h/Fipamo/wiki/01---Install) <br>
|
||||
[Using Fipamo](https://code.playvicio.us/Are0h/Fipamo/wiki/02-Usage) <br>
|
||||
[Getting Started](https://koodu.ubiqueros.com/are0h/Fipamo/wiki/00---Start) <br>
|
||||
|
||||
@ -0,0 +1,73 @@
|
||||
<?php
|
||||
|
||||
namespace brain\api\v1;
|
||||
|
||||
use brain\utility\FileUploader;
|
||||
use brain\data\Settings;
|
||||
use brain\data\Member;
|
||||
|
||||
class FilesAPI
|
||||
{
|
||||
public function __construct()
|
||||
{
|
||||
}
|
||||
|
||||
public static function uploadFiles($request, $type = null)
|
||||
{
|
||||
$upload = $request->getUploadedFiles(); //grab uploaded files
|
||||
$options = $request->getParsedBody();
|
||||
$file = $upload['upload_files'][0]; //front end sends one by one for progress tracking, so grab first
|
||||
$type = $file->getClientMediaType();
|
||||
$filesPath = '';
|
||||
$path = date('Y') . '/' . date('m');
|
||||
$response = [];
|
||||
|
||||
switch ($type) {
|
||||
case 'image/jpeg':
|
||||
case 'image/png':
|
||||
case 'image/gif':
|
||||
case 'image/svg':
|
||||
if (isset($options["source"])) {
|
||||
if ($options["source"] == "avatar-upload") {
|
||||
$filesPath = '/assets/images/user/' . $path . '/';
|
||||
Member::updateData(
|
||||
'avi',
|
||||
$filesPath . $file->getClientFileName()
|
||||
);
|
||||
} else {
|
||||
$filesPath = '/assets/images/user/' . $path . '/';
|
||||
Settings::updateGlobalData(
|
||||
'background',
|
||||
$filesPath . '/' . $file->getClientFileName()
|
||||
);
|
||||
}
|
||||
} else {
|
||||
$filesPath = '/assets/images/blog/' . $path . '/';
|
||||
}
|
||||
|
||||
break;
|
||||
case 'video/mp4':
|
||||
$filesPath = '/assets/video/blog/' . $path . '/';
|
||||
break;
|
||||
case 'audio/mpeg':
|
||||
$filesPath = '/assets/sound/blog/' . $path . '/';
|
||||
break;
|
||||
case 'application/pdf':
|
||||
case 'text/plain':
|
||||
case 'text/rtf':
|
||||
$filesPath = '/assets/docs/blog/' . $path . '/';
|
||||
break;
|
||||
}
|
||||
|
||||
FileUploader::uploadFile('../public' . $filesPath, $file);
|
||||
|
||||
$response = [
|
||||
'message' => "File Uploaded. Great!",
|
||||
"filePath" => $filesPath . urlencode($file->getClientFileName()),
|
||||
"fileName" => urlencode($file->getClientFileName()),
|
||||
'type' => $type,
|
||||
];
|
||||
|
||||
return $response;
|
||||
}
|
||||
}
|
||||
@ -1,102 +1,80 @@
|
||||
{% extends "dash/_frame.twig" %}
|
||||
|
||||
{% block title %}
|
||||
{{ title }}
|
||||
{{ title }}
|
||||
{% endblock %}
|
||||
|
||||
{% block stylesheets %}
|
||||
<link rel="stylesheet" type="text/css" href="/assets/css/dash.css?=dfvgy">
|
||||
{% endblock %}
|
||||
<link rel="stylesheet" type="text/css" href="/assets/css/dash/start.css?=vdthg">
|
||||
{% endblock %}
|
||||
|
||||
{% block mainContent %}
|
||||
<div id="post-index">
|
||||
<div id="post-index-wrapper">
|
||||
<div id="post-index-header">
|
||||
<div id="post-index-header-left">
|
||||
{{ filter }} Pages
|
||||
</div>
|
||||
<div id="post-index-header-right">
|
||||
<a href="/dashboard/pages/all" title="view all pages">
|
||||
<button>
|
||||
<svg >
|
||||
<use xlink:href="/assets/images/global/sprite.svg#entypo-archive"/>
|
||||
</svg>
|
||||
{{ stats['all'] }}
|
||||
</button>
|
||||
</a>
|
||||
<a href="/dashboard/pages/published" title="view publised pages">
|
||||
<button>
|
||||
<svg >
|
||||
<use xlink:href="/assets/images/global/sprite.svg#entypo-globe"/>
|
||||
</svg>
|
||||
{{ stats['published'] }}
|
||||
</button>
|
||||
</a>
|
||||
<a href="/dashboard/pages/deleted" title="view deleted pages">
|
||||
<button>
|
||||
<svg >
|
||||
<use xlink:href="/assets/images/global/sprite.svg#entypo-circle-with-cross"/>
|
||||
</svg>
|
||||
{{ stats['deleted'] }}
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
{% block mainContent %}
|
||||
<section role="book-index-header">
|
||||
<div role="book-index-header-left">
|
||||
{{ filter }}
|
||||
Pages
|
||||
</div>
|
||||
<div role="book-index-header-right">
|
||||
<a href="/dashboard/pages/all" title="view all pages">
|
||||
<button>
|
||||
<i class="ti ti-clipboard-list"></i>
|
||||
{{ stats['all'] }}
|
||||
</button>
|
||||
</a>
|
||||
<a href="/dashboard/pages/published" title="view publised pages">
|
||||
<button>
|
||||
<i class="ti ti-clipboard-check"></i>
|
||||
{{ stats['published'] }}
|
||||
</button>
|
||||
</a>
|
||||
<a href="/dashboard/pages/deleted" title="view deleted pages">
|
||||
<button>
|
||||
<i class="ti ti-clipboard-off"></i>
|
||||
{{ stats['deleted'] }}
|
||||
</button>
|
||||
</a>
|
||||
</section>
|
||||
<section role="book-index-pages">
|
||||
{% for page in pages %}
|
||||
{% if page.media[0].type == 'mp4' %}
|
||||
<a href="/dashboard/page/edit/{{ page.uuid }}" id="{{ page.uuid }}" class="page-link">
|
||||
<div class="page-video">
|
||||
<video class="post-video" loop muted autoplay>
|
||||
<source src="{{ page.media[0].file }}" type="video/mp4">
|
||||
|
||||
</div>
|
||||
<div id="posts-list">
|
||||
{% for page in pages %}
|
||||
{% if page.media[0].type == 'mp4' %}
|
||||
<a href="/dashboard/page/edit/{{ page.uuid }}" id="{{ page.uuid }}" class="page-link">
|
||||
<div class="page-video">
|
||||
<video class="post-video" loop muted autoplay>
|
||||
<source src="{{ page.media[0].file }}" type="video/mp4">
|
||||
Sorry, your browser doesn't support embedded videos.
|
||||
</video>
|
||||
<div id="meta">
|
||||
{{ include("dash/partials/recent-meta.twig") }}
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
{% else %}
|
||||
<a class="page-link" href="/dashboard/page/edit/{{ page.uuid }}">
|
||||
<div class="page-bg" style="background: url({{ page.media[0].file }}) no-repeat center center / cover">
|
||||
<div id="meta">
|
||||
{{ include("dash/partials/recent-meta.twig") }}
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
{% endif %}
|
||||
|
||||
Sorry, your browser doesn't support embedded videos.
|
||||
</video>
|
||||
<label>
|
||||
{{ page.title }}
|
||||
</label>
|
||||
<div id="meta">
|
||||
{{ include("dash/partials/recent-options.twig") }}
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% if numOfPages > 1 %}
|
||||
<div role="paginate">
|
||||
<a class="page-btns" href="/dashboard/pages/{{ paginate['sort'] }}/{{ paginate['prevPage'] }}">
|
||||
<i class="ti ti-square-arrow-left"></i>
|
||||
</a>
|
||||
<span class="count">
|
||||
{{ currentPage }}
|
||||
of
|
||||
{{ numOfPages }}
|
||||
</span>
|
||||
<a class="page-btns" href="/dashboard/pages/{{ paginate['sort'] }}/{{ paginate['nextPage'] }}">
|
||||
<i class="ti ti-square-arrow-right"></i>
|
||||
</a>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
</a>
|
||||
{% else %}
|
||||
<a class="page-link" href="/dashboard/page/edit/{{ page.uuid }}">
|
||||
<div class="page-bg" style="background: url({{ page.media[0].file }}) no-repeat center center / cover">
|
||||
<label>
|
||||
{{ page.title }}
|
||||
</label>
|
||||
<div id="meta">
|
||||
{{ include("dash/partials/recent-options.twig") }}
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
{% endif %}
|
||||
|
||||
{% endfor %}
|
||||
{% if numOfPages > 1 %}
|
||||
<div class="paginate">
|
||||
<a class="page-btns" href="/dashboard/pages/{{ paginate['sort'] }}/{{ paginate['prevPage'] }}">
|
||||
<svg viewbox="0 0 20 20" class="icons"><use xlink:href="/assets/images/global/sprite.svg#entypo-chevron-left"/></svg>
|
||||
</a>
|
||||
<span class="count">
|
||||
{{ currentPage }}
|
||||
of
|
||||
{{ numOfPages }}
|
||||
</span>
|
||||
<a class="page-btns" href="/dashboard/pages/{{ paginate['sort'] }}/{{ paginate['nextPage'] }}">
|
||||
<svg viewbox="0 0 20 20" class="icons"><use xlink:href="/assets/images/global/sprite.svg#entypo-chevron-right"/></svg>
|
||||
</a>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
{% block javascripts %}
|
||||
<script src="/assets/scripts/Start.js" type="text/javascript"></script>
|
||||
{% endblock %}
|
||||
</section>
|
||||
{% endblock %}
|
||||
|
||||
@ -0,0 +1,16 @@
|
||||
<div>
|
||||
<a href="/dashboard">
|
||||
<img id="the-logo" src="/assets/images/global/fipamo-logo.svg"/>
|
||||
</a>
|
||||
</div>
|
||||
<form id="init-restore" method="POST">
|
||||
<input type="text" name="restore_member_handle" id="restore_member_handle" placeholder="handle"/><input type="password" name="restore_member_pass" id="restore_member_pass" placeholder="password"/>
|
||||
<div>
|
||||
<label>Grab your backup zip</label>
|
||||
<input id="backup-upload" type="file" name="backup-upload" placeholder="Backup Zip"/>
|
||||
</div>
|
||||
<br/><br/>
|
||||
<button id="blog-restore" data-action='blog-restore' type='submit'>RESTORE</button>
|
||||
<br/><br/>
|
||||
<button class="init-option" id="init-switch-fresh">OR INSTALL FROM SCRATCH</button>
|
||||
</form>
|
||||
@ -0,0 +1,15 @@
|
||||
<div>
|
||||
<a href="/dashboard">
|
||||
<img id="the-logo" src="/assets/images/global/fipamo-logo.svg"/>
|
||||
</a>
|
||||
</div>
|
||||
<form id="init-form" method="POST">
|
||||
<input type="text" name="new_member_handle" id="new_member_handle" placeholder="handle"/>
|
||||
<input type="text" name="new_member_email" id="new_member_email" placeholder="email"/>
|
||||
<input type="text" name="new_member_pass" id="new_member_pass" placeholder="password"/>
|
||||
<input type="text" name="new_member_pass2" id="new_member_pass2" placeholder="password confirm"/>
|
||||
<input type="text" name="new_member_title" id="new_member_title" placeholder="title"/>
|
||||
<button id="init-blog" data-action='blog-init' type='submit'>SET UP YOUR SITE</button>
|
||||
<br/><br/>
|
||||
<button class="init-option" id="init-switch-restore">RESTORE FROM BACKUP</button>
|
||||
</form>
|
||||
@ -1,13 +1,13 @@
|
||||
<div id="dash-login">
|
||||
<div id="dash-form" class="dash-form">
|
||||
<img id="the-logo" src="/assets/images/global/fipamo-logo.svg"/>
|
||||
<form id="login" class='login' name="login" method="POST">
|
||||
<input type="text" name="handle" class="form-control" placeholder="Handle" required ">
|
||||
<input type="password" name="password" class="form-control" placeholder="Password" required">
|
||||
<button id="login-btn" class='login-btn' type='submit'>
|
||||
ID, PLEASE
|
||||
</button><br /><br />
|
||||
<a href="/dashboard/reset-password"> Forgot Password?</a>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<section role="login">
|
||||
<div>
|
||||
<img id="the-logo" src="/assets/images/global/fipamo-logo.svg"/>
|
||||
</div>
|
||||
<form id="login" class='login' name="login" method="POST" onsubmit="return false;">
|
||||
<input type="text" name="handle" class="form-control" placeholder="Handle" required/>
|
||||
<input type="password" name="password" class="form-control" placeholder="Password" required/>
|
||||
<button id="login-btn" class='login-btn'>
|
||||
ID, PLEASE
|
||||
</button>
|
||||
<a href="/dashboard/reset-password">?</a>
|
||||
</form>
|
||||
</section>
|
||||
|
||||
@ -0,0 +1,21 @@
|
||||
<div>
|
||||
<a href="/dashboard">
|
||||
<img id="the-logo" src="/assets/images/global/fipamo-logo.svg"/>
|
||||
</a>
|
||||
</div>
|
||||
<form id="reset" class='login' name="reset" action="/dashboard/login" method="POST">
|
||||
|
||||
<input type="password" id="new_password" name="new_password" class="form-control" placeholder="New Password" required/>
|
||||
<input type="password" id="new_password2" name="new_password2" class="form-control" placeholder="New Password Confirm" required">
|
||||
<input type="password" id="secret" name="secret" class="form-control" placeholder="Account Secret" required/>
|
||||
<button id="reset-btn" class='login-btn' type='submit'>
|
||||
RESET PASSWORD
|
||||
</button><br/>
|
||||
<p>
|
||||
Use this to get your secret to verify it's you. If your email is set up, the secret will be sent there. If not, the form will be updated automatically(but please set up your email, once you reset your password).
|
||||
</p>
|
||||
<input type="text" id="email" name="email" class="form-control" placeholder="email to verify" required/>
|
||||
<button id="get-secret-btn" class='login-btn' type='submit'>
|
||||
VERIFY EMAIL
|
||||
</button><br/><br/>
|
||||
</form>
|
||||
@ -1,45 +1,38 @@
|
||||
<div id="edit-control">
|
||||
<button id="edit-bold" class="content-editor-btn-text editor-button" title="bold">B</button>
|
||||
<button id="edit-italic" class="content-editor-btn-text editor-button" title="italic">I</button>
|
||||
<button id="edit-strikethrough" class="content-editor-btn-text editor-button" title="strikethrough">D</button>
|
||||
<div role="text-editor-control">
|
||||
<button id="edit-bold" class="content-editor-btn-text editor-button" title="bold">
|
||||
<i class="ti ti-bold"></i>
|
||||
</button>
|
||||
<button id="edit-italic" class="content-editor-btn-text editor-button" title="italic">
|
||||
<i class="ti ti-italic"></i>
|
||||
</button>
|
||||
<button id="edit-strikethrough" class="content-editor-btn-text editor-button" title="strikethrough">
|
||||
<i class="ti ti-strikethrough"></i>
|
||||
</button>
|
||||
<button id="edit-link" class="content-editor-btn-icon editor-button" title="insert link">
|
||||
<svg id="edit-link" viewbox="0 0 20 20" class="icons">
|
||||
<use id="edit-link" xlink:href="/assets/images/global/sprite.svg#entypo-link"/>
|
||||
</svg>
|
||||
<i class="ti ti-link"></i>
|
||||
</button>
|
||||
<button id="edit-header1" class="content-editor-btn-text editor-button" title="header 1">
|
||||
<i class="ti ti-h-1"></i>
|
||||
</button>
|
||||
<button id="edit-header2" class="content-editor-btn-text editor-button" title="header 2">
|
||||
<i class="ti ti-h-2"></i>
|
||||
</button>
|
||||
<button id="edit-header3" class="content-editor-btn-text editor-button" title="header 3">
|
||||
<i class="ti ti-h-3"></i>
|
||||
</button>
|
||||
<button id="edit-header1" class="content-editor-btn-text editor-button" title="header 1">H1</button>
|
||||
<button id="edit-header2" class="content-editor-btn-text editor-button" title="header 2">H2</button>
|
||||
<button id="edit-header3" class="content-editor-btn-text editor-button" title="header 3">H3</button>
|
||||
<button id="edit-image" class="content-editor-btn-icon editor-button" title="insert image">
|
||||
<svg id="edit-image" viewbox="0 0 20 20" class="icons">
|
||||
<use id="edit-image" xlink:href="/assets/images/global/sprite.svg#entypo-image"/>
|
||||
</svg>
|
||||
<i class="ti ti-photo"></i>
|
||||
</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="submit-update" viewbox="0 0 20 20" class="icons">
|
||||
<use id="submit-update" xlink:href="/assets/images/global/sprite.svg#entypo-save" data-action='blog-update' data-id="{{ page['uuid'] }}"/>
|
||||
</svg>
|
||||
<svg id="submit-good" class="icon-hide" viewbox="0 0 20 20" class="icons">
|
||||
<use xlink:href="/assets/images/global/sprite.svg#entypo-thumbs-up"/>
|
||||
</svg>
|
||||
<svg id="submit-error" class="icon-hide" viewbox="0 0 20 20" class="icons">
|
||||
<use xlink:href="/assets/images/global/sprite.svg#entypo-thumbs-down"/>
|
||||
</svg>
|
||||
<i class="ti ti-device-floppy"></i>
|
||||
</button>
|
||||
<button id="edit-delete" class="content-editor-btn-icon editor-button submit-delete" for="post-delete" title='delete post'>
|
||||
<svg id="edit-delete" viewbox="0 0 20 20" class="icons">
|
||||
<use id="edit-delete" xlink:href="/assets/images/global/sprite.svg#entypo-cross"/>
|
||||
</svg>
|
||||
<i class="ti ti-x"></i>
|
||||
</button>
|
||||
{% else %}
|
||||
<button id="edit-save" class="post-sumbit-btn submit-start editor-button" data-action='blog-add' type='submit'>
|
||||
<svg id="submit-save" viewbox="0 0 20 20" class="icons">
|
||||
<use id="submit-save" xlink:href="/assets/images/global/sprite.svg#entypo-plus"/>
|
||||
</svg>
|
||||
<i class="ti ti-file-plus"></i>
|
||||
</button>
|
||||
{% endif %}
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
@ -1,58 +1,30 @@
|
||||
<div id="dash-recent">
|
||||
<div id="recent-list">
|
||||
<div class="recent-header">
|
||||
<div class="index-header-left">
|
||||
Recent
|
||||
</div>
|
||||
<div class="index-header-right">
|
||||
<a href='/dashboard/pages' title="view pages">
|
||||
<button>
|
||||
<svg class="page-link">
|
||||
<use xlink:href="/assets/images/global/sprite.svg#entypo-archive"/>
|
||||
</svg>
|
||||
</button>
|
||||
</a>
|
||||
|
||||
<a href='/dashboard/page/add/new' title="add new page">
|
||||
<button>
|
||||
<svg class="page-link">
|
||||
<use xlink:href="/assets/images/global/sprite.svg#entypo-plus"/>
|
||||
</svg>
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<br/>
|
||||
{% if data["entryCount"] != 0 %}
|
||||
{% for page in data['pages'] %}
|
||||
{% if page.media[0].type == 'mp4' %}
|
||||
|
||||
<a href="/dashboard/page/edit/{{ page.uuid }}" id="{{ page.uuid }}" class="post-video-link recent-link">
|
||||
<video class="post-video" loop muted autoplay>
|
||||
<source src="{{ page.media[0].file }}" type="video/mp4">
|
||||
|
||||
Sorry, your browser doesn't support embedded videos.
|
||||
</video>
|
||||
<label>
|
||||
{{ page.title }}
|
||||
</label>
|
||||
{{ include("dash/partials/recent-options.twig") }}
|
||||
</a>
|
||||
|
||||
{% else %}
|
||||
<a href="/dashboard/page/edit/{{ page.uuid }}" id="{{ page.uuid }}" class="post-link recent-link" style="background: url({{ page.media[0].file }}) no-repeat center center / cover">
|
||||
<label>
|
||||
{{ page.title }}
|
||||
</label>
|
||||
<section role="index-header">
|
||||
<div role="index-header-left">
|
||||
<h1>Recent</h1>
|
||||
</div>
|
||||
<div role="index-header-right"></div>
|
||||
</section>
|
||||
<section role="index-recent-pages">
|
||||
{% if data["entryCount"] != 0 %}
|
||||
{% for page in data['pages'] %}
|
||||
{% if page.media[0].type == 'mp4' %}
|
||||
|
||||
{{ include("dash/partials/recent-options.twig") }}
|
||||
</a>
|
||||
{% endif %}
|
||||
<a href="/dashboard/page/edit/{{ page.uuid }}" id="{{ page.uuid }}" class="post-video-link recent-link">
|
||||
{{ include("dash/partials/recent-meta.twig") }}
|
||||
<video class="post-video" loop muted autoplay>
|
||||
<source src="{{ page.media[0].file }}" type="video/mp4">
|
||||
Sorry, your browser doesn't support embedded videos.
|
||||
</video>
|
||||
</a>
|
||||
|
||||
{% endfor %}
|
||||
{% else %}
|
||||
There are no pages
|
||||
{% endif %}
|
||||
{% else %}
|
||||
<a href="/dashboard/page/edit/{{ page.uuid }}" id="{{ page.uuid }}" class="post-link recent-link" style="background: url({{ page.media[0].file }}) no-repeat center center / cover">
|
||||
{{ include("dash/partials/recent-meta.twig") }}
|
||||
</a>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% else %}
|
||||
There are no pages
|
||||
{% endif %}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
@ -1,23 +1,57 @@
|
||||
<div id="dash-menu">
|
||||
<div role="menu">
|
||||
{% if title == "Settings" %}
|
||||
{% apply spaceless %}
|
||||
{{ include("dash/partials/submenu_settings.twig") }}
|
||||
{% endapply %}
|
||||
{% elseif title=="Start" %}
|
||||
{% apply spaceless %}
|
||||
{{ include("dash/partials/submenu_start.twig") }}
|
||||
{% endapply %}
|
||||
{% endif %}
|
||||
<a id="settings" href="/dashboard/settings" title="settings">
|
||||
<button>
|
||||
<svg class="menu">
|
||||
<use xlink:href="/assets/images/global/sprite.svg#entypo-sound-mix"/>
|
||||
</svg>
|
||||
<i class="ti ti-home-cog"></i>
|
||||
</button>
|
||||
</a> .
|
||||
</a>
|
||||
<a id="navigation" href="/dashboard/navigation" title="edit navigation">
|
||||
<button>
|
||||
<svg class="menu">
|
||||
<use xlink:href="/assets/images/global/sprite.svg#entypo-list"/>
|
||||
</svg>
|
||||
<i class="ti ti-arrow-autofit-height"></i>
|
||||
</button>
|
||||
</a>
|
||||
<a id="navigation" href="/dashboard/logout" title="log out">
|
||||
<button>
|
||||
<i class="ti ti-logout"></i>
|
||||
</button>
|
||||
</a> .
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<button role="menu-toggle">
|
||||
<i class="ti ti-menu-2"></i>
|
||||
</button>
|
||||
|
||||
<div role="mobile-menu">
|
||||
{% if title == "Settings" %}
|
||||
{% apply spaceless %}
|
||||
{{ include("dash/partials/submenu_settings.twig") }}
|
||||
{% endapply %}
|
||||
{% elseif title=="Start" %}
|
||||
{% apply spaceless %}
|
||||
{{ include("dash/partials/submenu_start.twig") }}
|
||||
{% endapply %}
|
||||
{% endif %}
|
||||
<a id="settings" href="/dashboard/settings" title="settings">
|
||||
<button>
|
||||
<i class="ti ti-home-cog"></i>
|
||||
</button>
|
||||
</a>
|
||||
<a id="navigation" href="/dashboard/navigation" title="edit navigation">
|
||||
<button>
|
||||
<i class="ti ti-arrow-autofit-height"></i>
|
||||
</button>
|
||||
</a>
|
||||
<a id="navigation" href="/dashboard/logout" title="log out">
|
||||
<button>
|
||||
<svg class="menu">
|
||||
<use xlink:href="/assets/images/global/sprite.svg#entypo-log-out"/>
|
||||
</svg>
|
||||
<i class="ti ti-logout"></i>
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
@ -0,0 +1,10 @@
|
||||
<div role="notify-message">
|
||||
<div role="notify-icons">
|
||||
<i class="ti ti-mood-smile" role="notify-good"></i>
|
||||
<i class="ti ti-mood-sad" role="notify-notgood"></i>
|
||||
<i class="ti ti-settings" role="notify-working"></i>
|
||||
</div>
|
||||
<div role="notify-text">
|
||||
<span role="response-text">Hey Hey</span>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,42 +1,40 @@
|
||||
{% if page['menu'] %}
|
||||
{% if page['menu'] %}
|
||||
{% set menu = 'true' %}
|
||||
{% else %}
|
||||
{% set menu = 'false' %}
|
||||
{% endif %}
|
||||
|
||||
{% if page['featured'] %}
|
||||
{% if page['featured'] %}
|
||||
{% set featured = 'true' %}
|
||||
{% else %}
|
||||
{% set featured = 'false' %}
|
||||
{% endif %}
|
||||
|
||||
{% if page['published'] %}
|
||||
{% if page['published'] %}
|
||||
{% set published = 'true' %}
|
||||
{% else %}
|
||||
{% set published = 'false' %}
|
||||
{% endif %}
|
||||
|
||||
<div id="post-options">
|
||||
<br>
|
||||
<button id="option-menu-pin" class="option-inactive post-option-btn" data-active="{{ menu }}" title='Pin to Menu'>
|
||||
<svg id="option-page-icon" viewbox="0 0 20 20" class="icons">
|
||||
<svg id="option-page-icon" role="icon">
|
||||
<use id="option-page-icon" xlink:href="/assets/images/global/sprite.svg#entypo-add-to-list"/>
|
||||
</svg>
|
||||
</button>
|
||||
<button id="option-feature" class="option-inactive post-option-btn" data-active="{{ featured }}" title='Feature'>
|
||||
<svg id="option-feature-icon" viewbox="0 0 20 20" class="icons">
|
||||
<use id="option-feature-icon" xlink:href="/assets/images/global/sprite.svg#entypo-star"/>
|
||||
</svg>
|
||||
</button>
|
||||
<button id="option-published" class="option-inactive post-option-btn" data-active="{{ published }}" title='Published'>
|
||||
<svg id="option-published-icon" viewbox="0 0 20 20" class="icons">
|
||||
<use id="option-published-icon" xlink:href="/assets/images/global/sprite.svg#entypo-globe"/>
|
||||
</svg>
|
||||
</button>
|
||||
<a href="/dashboard/page/preview/{{ uuid }}" target="_blank">
|
||||
<button id="option-preview" class="option-inactive post-option-btn" data-active="false" title='preview page'>
|
||||
<svg id="option-preview-icon" viewbox="0 0 20 20" class="icons">
|
||||
</button>
|
||||
<button id="option-feature" class="option-inactive post-option-btn" data-active="{{ featured }}" title='Feature'>
|
||||
<svg id="option-feature-icon" role="icon">
|
||||
<use id="option-feature-icon" xlink:href="/assets/images/global/sprite.svg#entypo-star"/>
|
||||
</svg>
|
||||
</button>
|
||||
<button id="option-published" class="option-inactive post-option-btn" data-active="{{ published }}" title='Published'>
|
||||
<svg id="option-published-icon" role="icon">
|
||||
<use id="option-published-icon" xlink:href="/assets/images/global/sprite.svg#entypo-globe"/>
|
||||
</svg>
|
||||
</button>
|
||||
<a href="/dashboard/page/preview/{{ uuid }}" target="_blank">
|
||||
<button id="option-preview" class="option-inactive post-option-btn" data-active="false" title='preview page'>
|
||||
<svg id="option-preview-icon" role="icon">
|
||||
<use id="option-preview-icon" xlink:href="/assets/images/global/sprite.svg#entypo-eye"/>
|
||||
</svg>
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
@ -0,0 +1,37 @@
|
||||
{% if page.menu == 'true' %}
|
||||
{% set menu = "true" %}
|
||||
{% else %}
|
||||
{% set menu = "false" %}
|
||||
{% endif %}
|
||||
{% if page.published == 'true' %}
|
||||
{% set published = "true" %}
|
||||
{% else %}
|
||||
{% set published = "false" %}
|
||||
{% endif %}
|
||||
{% if page.featured == 'true' %}
|
||||
{% set featured = "true" %}
|
||||
{% else %}
|
||||
{% set featured = "false" %}
|
||||
{% endif %}
|
||||
|
||||
<aside>
|
||||
<strong>
|
||||
{{ page.updated }}
|
||||
</strong>
|
||||
<hr/>
|
||||
<strong>
|
||||
{{ page.title }}
|
||||
</strong>
|
||||
<hr/>
|
||||
<button data-active="{{ menu }}">
|
||||
<i class="ti ti-navigation"></i>
|
||||
</button>
|
||||
<button data-active="{{ published }}">
|
||||
<i class="ti ti-world"></i>
|
||||
</button>
|
||||
|
||||
<button data-active="{{ featured }}">
|
||||
<i class="ti ti-star"></i>
|
||||
</button>
|
||||
|
||||
</aside>
|
||||
@ -1,42 +0,0 @@
|
||||
<div id="options">
|
||||
{% if page.menu == 'true' %}
|
||||
{% set menu = "true" %}
|
||||
{% else %}
|
||||
{% set menu = "false" %}
|
||||
{% endif %}
|
||||
{% if page.published == 'true' %}
|
||||
{% set published = "true" %}
|
||||
{% else %}
|
||||
{% set published = "false" %}
|
||||
{% endif %}
|
||||
{% if page.featured == 'true' %}
|
||||
{% set featured = "true" %}
|
||||
{% else %}
|
||||
{% set featured = "false" %}
|
||||
{% endif %}
|
||||
<div id="option-left">
|
||||
|
||||
<button data-active="{{ menu }}">
|
||||
<svg>
|
||||
<use xlink:href="/assets/images/global/sprite.svg#entypo-add-to-list"/>
|
||||
</svg>
|
||||
</button>
|
||||
<button data-active="{{ published }}">
|
||||
<svg>
|
||||
<use xlink:href="/assets/images/global/sprite.svg#entypo-globe"/>
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
<button data-active="{{ featured }}">
|
||||
<svg>
|
||||
<use xlink:href="/assets/images/global/sprite.svg#entypo-star"/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
<div id="option-right">
|
||||
<span>
|
||||
{{ page.updated }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@ -0,0 +1,11 @@
|
||||
<div role="submenu">
|
||||
<button id="save-toggle" title="save settings">
|
||||
<i class="ti ti-device-floppy"></i>
|
||||
</button>
|
||||
<button id="publish-pages" title="publish site">
|
||||
<i class="ti ti-world-upload"></i>
|
||||
</button>
|
||||
<button id="render-toggle" title="render on save toggle" data-render="{{ renderOnSave }}">
|
||||
<i class="ti ti-circle-dashed"></i>
|
||||
</button>
|
||||
</div>
|
||||
@ -0,0 +1,12 @@
|
||||
<div role="submenu">
|
||||
<a href='/dashboard/pages' title="view pages">
|
||||
<button>
|
||||
<i class="ti ti-book-2"></i>
|
||||
</button>
|
||||
</a>
|
||||
<a href='/dashboard/page/add/new' title="add new page">
|
||||
<button>
|
||||
<i class="ti ti-square-plus"></i>
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
File diff suppressed because it is too large
Load Diff
@ -1,43 +1,35 @@
|
||||
{
|
||||
"name": "fipamo-dash",
|
||||
"version": "2.5.1-beta",
|
||||
"private": true,
|
||||
"apidoc": {
|
||||
"name": "Fipamo API",
|
||||
"version": "1.0.0",
|
||||
"description": "The most chill API for the most chill blog framework"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/preset-env": "^7.16.5",
|
||||
"babel-cli": "^6.26.0",
|
||||
"eslint": "^8.11.0",
|
||||
"eslint-plugin-babel": "^5.3.1",
|
||||
"parcel": "^2.0.1",
|
||||
"prettier": "^2.6.0",
|
||||
"stylelint": "^14.8.2",
|
||||
"stylelint-config-prettier-scss": "^0.0.1",
|
||||
"stylelint-config-standard-scss": "^3.0.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"@babel/core": "^7.16.5",
|
||||
"@babel/eslint-parser": "^7.16.5",
|
||||
"animejs": "^3.2.1",
|
||||
"babel-plugin-prismjs": "^2.1.0",
|
||||
"babel-preset-env": "^1.7.0",
|
||||
"bulma": "^0.9.3",
|
||||
"caret-pos": "^2.0.0",
|
||||
"jsdoc": "^3.6.7",
|
||||
"minami": "^1.2.3",
|
||||
"prismjs": "^1.25.0",
|
||||
"sass": "^1.45.1",
|
||||
"sortablejs": "^1.14.0"
|
||||
},
|
||||
"license": "UNLICENSED",
|
||||
"author": "Are0h",
|
||||
"scripts": {
|
||||
"watch": "sass --watch src/styles:public/assets/css & npx parcel watch src/com/Start.js --dist-dir public/assets/scripts --public-url /assets/scripts",
|
||||
"build": "sass src/styles:public/assets/css & npx parcel build src/com/Start.js --dist-dir public/assets/scripts --public-url /assets/scripts"
|
||||
},
|
||||
"description": "Front end script for the most chill blog framework ever.",
|
||||
"repository": "https://code.playvicio.us/Are0h/Fipamo"
|
||||
"name": "fipamo-dash",
|
||||
"version": "2.6.0-beta",
|
||||
"private": true,
|
||||
"apidoc": {
|
||||
"name": "Fipamo API",
|
||||
"version": "1.0.0",
|
||||
"description": "The most chill API for the most chill blog framework"
|
||||
},
|
||||
"source": "src/com/Start.js",
|
||||
"main": "public/assets/scripts/start.js",
|
||||
"targets": {
|
||||
"main": {
|
||||
"includeNodeModules": true
|
||||
}
|
||||
},
|
||||
"scripts": {
|
||||
"watch": "parcel watch",
|
||||
"build": "parcel build"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "^7.21.3",
|
||||
"babel-plugin-prismjs": "^2.1.0",
|
||||
"parcel": "^2.8.3",
|
||||
"prettier": "^2.8.4",
|
||||
"stylelint": "^15.3.0",
|
||||
"stylelint-config-standard": "^31.0.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"animejs": "^3.2.1",
|
||||
"caret-pos": "^2.0.0",
|
||||
"prismjs": "^1.29.0",
|
||||
"sortablejs": "^1.15.0"
|
||||
}
|
||||
}
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,116 @@
|
||||
section[role="book-index-header"] {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
margin: 100px auto 20px;
|
||||
width: 100%;
|
||||
max-width: 900px;
|
||||
}
|
||||
|
||||
section[role="book-index-header"] > div[role="book-index-header-left"] {
|
||||
text-transform: capitalize;
|
||||
display: inline-block;
|
||||
color: var(--white);
|
||||
font-size: 3em;
|
||||
}
|
||||
|
||||
section[role="book-index-header"] > div[role="book-index-header-right"] {
|
||||
text-align: right;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
section[role="book-index-pages"] {
|
||||
margin: 0 auto;
|
||||
width: 100%;
|
||||
max-width: 900px;
|
||||
}
|
||||
|
||||
section[role="book-index-pages"] > a.page-link {
|
||||
vertical-align: top;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
text-decoration: none;
|
||||
margin: 0 0 20px;
|
||||
border-radius: 3px;
|
||||
height: 350px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
section[role="book-index-pages"] > a.page-link div.page-video {
|
||||
width: 100%;
|
||||
height: 350px;
|
||||
display: flex;
|
||||
justify-content: left;
|
||||
align-items: center;
|
||||
border-radius: 5px;
|
||||
border-bottom: none;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
section[role="book-index-pages"] > a.page-link video {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
section[role="book-index-pages"] > a.page-link > div.page-bg {
|
||||
width: 100%;
|
||||
height: 350px;
|
||||
display: flex;
|
||||
justify-content: left;
|
||||
align-items: center;
|
||||
border-radius: 5px;
|
||||
border-bottom: none;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
section[role="book-index-pages"] aside {
|
||||
font-size: 1.1em;
|
||||
color: var(--white);
|
||||
text-shadow: 2px 2px 2px var(--black);
|
||||
padding: 10px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
section[role="book-index-pages"] hr {
|
||||
color: var(--white);
|
||||
border: 0.1px solid;
|
||||
margin: 7px 0;
|
||||
}
|
||||
|
||||
section[role="book-index-pages"] button[data-active="true"] {
|
||||
background: var(--primary);
|
||||
}
|
||||
|
||||
section[role="book-index-pages"] button[data-active="true"] svg {
|
||||
fill: var(--tertiary);
|
||||
}
|
||||
|
||||
section[role="book-index-pages"] button[data-active="false"] {
|
||||
background: var(--secondary);
|
||||
}
|
||||
|
||||
section[role="book-index-pages"] button[data-active="false"] svg {
|
||||
fill: var(--primary);
|
||||
}
|
||||
|
||||
section[role="book-index-pages"] > div[role="paginate"] {
|
||||
width: fit-content;
|
||||
margin: 0 auto;
|
||||
font-size: 1.5em;
|
||||
color: var(--highlight);
|
||||
}
|
||||
|
||||
section[role="book-index-pages"] > div[role="paginate"] i {
|
||||
color: var(--secondary);
|
||||
}
|
||||
|
||||
section[role="book-index-pages"] > div[role="paginate"] a,
|
||||
section[role="book-index-pages"] > div[role="paginate"] span {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
section[role="book-index-pages"] > div[role="paginate"] span {
|
||||
position: relative;
|
||||
top: -15px;
|
||||
}
|
||||
@ -0,0 +1,22 @@
|
||||
:root {
|
||||
/* BASE COLORS */
|
||||
--primary: #1d3040;
|
||||
--secondary: #b2cce5;
|
||||
--tertiary: #f5ab35;
|
||||
--highlight: #fc6399;
|
||||
--white: #efebe3;
|
||||
--grey: #abb7b7;
|
||||
--black: #32302f;
|
||||
|
||||
/* EDITOR COLORS */
|
||||
--event-cool: #32cd32;
|
||||
--event-lame: #f64747;
|
||||
--editor-primary: #fde3a7;
|
||||
--editor-secondary: #e7903c;
|
||||
--editor-tertiary: #6bb9f0;
|
||||
--editor-string: #dcc6e0;
|
||||
--editor-tag: #e73c4e;
|
||||
|
||||
/* RGB Versions */
|
||||
--primary-rgb: 29 28 24;
|
||||
}
|
||||
@ -0,0 +1,54 @@
|
||||
a {
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
p {
|
||||
background: var(--tertiary);
|
||||
color: var(--primary);
|
||||
padding: 5px;
|
||||
display: block;
|
||||
border-radius: 5px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
input[type="email"],
|
||||
input[type="password"],
|
||||
input[type="text"] {
|
||||
border: 0;
|
||||
border-radius: 5px;
|
||||
font: 18px var(--base-type);
|
||||
display: inline-block;
|
||||
background: var(--white);
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
textarea {
|
||||
border: 0;
|
||||
border-radius: 3px;
|
||||
color: var(--primary);
|
||||
background: var(--white);
|
||||
}
|
||||
|
||||
button,
|
||||
input[type="submit"] {
|
||||
background: var(--highlight);
|
||||
color: var(--primary);
|
||||
font: 20px var(--base-type);
|
||||
border-radius: 5px;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
border: 0;
|
||||
transition: all 0.3s linear;
|
||||
}
|
||||
|
||||
select {
|
||||
font: 14px var(--base-type);
|
||||
border: 1px solid var(--secondary);
|
||||
appearance: none;
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
::placeholder {
|
||||
font: 25px var(--base-type);
|
||||
color: var(--black);
|
||||
}
|
||||
@ -0,0 +1,145 @@
|
||||
html {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
font: 400 1.2em/1.4em var(--base-type);
|
||||
}
|
||||
|
||||
html body {
|
||||
background: var(--primary);
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
overflow-y: scroll;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
/* GLOBALS */
|
||||
|
||||
a {
|
||||
color: var(--primary);
|
||||
text-decoration: none;
|
||||
border-bottom: 0;
|
||||
transition: all 0.2s linear;
|
||||
}
|
||||
|
||||
sup {
|
||||
background: var(--black);
|
||||
color: var(--white);
|
||||
padding: 3px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
#notifications {
|
||||
display: none;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
pre,
|
||||
code {
|
||||
background: var(--black);
|
||||
color: var(--highlight);
|
||||
border-radius: 3px;
|
||||
padding: 3px;
|
||||
}
|
||||
|
||||
svg[role="icon"] {
|
||||
fill: var(--white);
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
padding-top: 5px;
|
||||
}
|
||||
|
||||
/* HEADER
|
||||
Navigation
|
||||
Notificiations
|
||||
*/
|
||||
|
||||
header {
|
||||
width: 100%;
|
||||
max-width: 900px;
|
||||
margin: 10px auto;
|
||||
height: 50px;
|
||||
border-radius: 5px;
|
||||
left: 50%;
|
||||
transform: translate(-50%, 0);
|
||||
position: fixed;
|
||||
z-index: 500;
|
||||
}
|
||||
|
||||
header > nav > div[role="nav-left"] img {
|
||||
width: 40px;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
header > nav > div[role="title"] {
|
||||
text-align: left;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
header > nav > div[role="title"] h1 {
|
||||
color: var(--primary);
|
||||
margin: 15px;
|
||||
}
|
||||
|
||||
header > nav > div[role="nav-right"] {
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
header > nav > div > div[role="mobile-menu"] {
|
||||
display: none;
|
||||
position: fixed;
|
||||
z-index: 1000;
|
||||
left: 0;
|
||||
transition: all 0.2s linear;
|
||||
}
|
||||
|
||||
header > nav > div[role="nav-right"] button {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
margin-left: 5px;
|
||||
font-size: 0.8em;
|
||||
color: var(--white);
|
||||
}
|
||||
|
||||
header > nav > div[role="nav-right"] > button[role="menu-toggle"] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
header > nav > div[role="nav-right"] div[role="submenu"] {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
header > nav > div[role="nav-right"] div[role="submenu"] button {
|
||||
background: var(--primary);
|
||||
color: var(--white);
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
header
|
||||
> nav
|
||||
> div[role="nav-right"]
|
||||
div[role="submenu"]
|
||||
button[data-render="true"] {
|
||||
background: var(--tertiary);
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
/* RESPONSIVE */
|
||||
|
||||
@media only screen and (max-width: 900px) {
|
||||
header {
|
||||
width: 97%;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 530px) {
|
||||
header > nav > div[role="nav-right"] > button[role="menu-toggle"] {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
header > nav > div > div[role="menu"] {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,149 @@
|
||||
section[role="index-header"] {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
width: 100%;
|
||||
max-width: 900px;
|
||||
margin: 60px auto 0;
|
||||
}
|
||||
|
||||
section[role="index-recent-pages"] a {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: left;
|
||||
align-items: center;
|
||||
border-radius: 5px;
|
||||
border-bottom: none;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
section[role="index-recent-pages"] a video {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
object-fit: cover;
|
||||
height: 100%;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
section[role="index-recent-pages"] a:nth-child(1) {
|
||||
grid-column: 1/4;
|
||||
grid-row: 1/3;
|
||||
}
|
||||
|
||||
section[role="index-recent-pages"] a:nth-child(2) {
|
||||
grid-row: 3/6;
|
||||
}
|
||||
|
||||
section[role="index-recent-pages"] a:nth-child(3) {
|
||||
grid-column: 2/4;
|
||||
grid-row: 3/5;
|
||||
}
|
||||
|
||||
section[role="index-header"] div[role="index-header-right"] {
|
||||
display: flex;
|
||||
justify-content: right;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
section[role="index-header"] div[role="index-header-right"] a {
|
||||
border-bottom: none;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
section[role="index-recent-pages"] {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr 1fr;
|
||||
grid-auto-rows: minmax(200px, auto);
|
||||
gap: 10px;
|
||||
width: 100%;
|
||||
max-width: 900px;
|
||||
margin: 10px auto;
|
||||
}
|
||||
|
||||
section[role="index-recent-pages"] a button {
|
||||
padding: 1px 5px;
|
||||
}
|
||||
|
||||
section[role="index-recent-pages"] button i {
|
||||
font-size: 1.8em;
|
||||
}
|
||||
|
||||
section[role="index-recent-pages"] button[data-active="true"] {
|
||||
background: var(--primary);
|
||||
}
|
||||
|
||||
section[role="index-recent-pages"] button[data-active="true"] i {
|
||||
color: var(--tertiary);
|
||||
}
|
||||
|
||||
section[role="index-recent-pages"] button[data-active="false"] {
|
||||
background: var(--secondary);
|
||||
}
|
||||
|
||||
section[role="index-recent-pages"] button[data-active="false"] i {
|
||||
fill: var(--primary);
|
||||
}
|
||||
|
||||
section[role="index-recent-pages"] aside {
|
||||
font-size: 1.1em;
|
||||
color: var(--white);
|
||||
text-shadow: 2px 2px 2px var(--black);
|
||||
padding: 10px;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
section[role="index-recent-pages"] hr {
|
||||
color: var(--white);
|
||||
border: 0.1px solid;
|
||||
margin: 7px 0;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 900px) {
|
||||
section[role="index-header"],
|
||||
section[role="index-recent-pages"] {
|
||||
width: 97%;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 520px) {
|
||||
section[role="index-recent-pages"] {
|
||||
grid-template-columns: 1fr 1fr;
|
||||
}
|
||||
|
||||
section[role="index-recent-pages"] a:nth-child(1) {
|
||||
grid-column: 1/3;
|
||||
grid-row: 1/2;
|
||||
}
|
||||
|
||||
section[role="index-recent-pages"] a:nth-child(2) {
|
||||
grid-row: 2/3;
|
||||
grid-column: 1/2;
|
||||
}
|
||||
|
||||
section[role="index-recent-pages"] a:nth-child(3) {
|
||||
grid-column: 2/3;
|
||||
grid-row: 2/3;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 350px) {
|
||||
section[role="index-recent-pages"] a:nth-child(2) {
|
||||
grid-column: 1/3;
|
||||
grid-row: 2/3;
|
||||
}
|
||||
|
||||
section[role="index-recent-pages"] a:nth-child(3) {
|
||||
grid-column: 1/3;
|
||||
grid-row: 3/4;
|
||||
}
|
||||
|
||||
section[role="index-recent-pages"] a:nth-child(4) {
|
||||
grid-column: 1/3;
|
||||
grid-row: 4/5;
|
||||
}
|
||||
|
||||
section[role="index-recent-pages"] a:nth-child(5) {
|
||||
grid-column: 1/3;
|
||||
grid-row: 5/6;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,113 @@
|
||||
/* LOGIN */
|
||||
|
||||
section[role="login"],
|
||||
section[role="password-reset"],
|
||||
section[role="restore-fresh"],
|
||||
section[role="restore-backup"] {
|
||||
margin: 15% auto;
|
||||
padding: 10px;
|
||||
width: 500px;
|
||||
border-radius: 5px;
|
||||
display: grid;
|
||||
grid-template-columns: 28.5% 1fr;
|
||||
gap: 10px;
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
section[role="restore-backup"] {
|
||||
display: none;
|
||||
visibility: hidden;
|
||||
color: var(--white);
|
||||
}
|
||||
|
||||
section[role="login"] form input {
|
||||
width: 95%;
|
||||
height: 30px;
|
||||
padding: 5px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
section[role="login"] form button {
|
||||
padding: 10px 5px;
|
||||
width: 82%;
|
||||
}
|
||||
|
||||
section[role="login"] form a {
|
||||
padding: 10px 5px;
|
||||
border-radius: 5px;
|
||||
width: 10%;
|
||||
height: 20px;
|
||||
display: inline-block;
|
||||
background: var(--tertiary);
|
||||
vertical-align: top;
|
||||
text-align: center;
|
||||
margin: 0 0 0 10px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* PASSWORD-RESET */
|
||||
|
||||
section[role="password-reset"] form button {
|
||||
padding: 10px 5px;
|
||||
width: 82%;
|
||||
}
|
||||
|
||||
section[role="password-reset"] form input {
|
||||
width: 95%;
|
||||
height: 30px;
|
||||
padding: 5px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
/* SITE RESTORE */
|
||||
|
||||
section[role="restore-fresh"] form button {
|
||||
padding: 10px 5px;
|
||||
width: 82%;
|
||||
}
|
||||
|
||||
section[role="restore-fresh"] form input {
|
||||
width: 95%;
|
||||
height: 30px;
|
||||
padding: 5px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
section[role="restore-backup"] form button {
|
||||
padding: 10px 5px;
|
||||
width: 82%;
|
||||
}
|
||||
|
||||
section[role="restore-backup"] form input {
|
||||
width: 95%;
|
||||
height: 30px;
|
||||
padding: 5px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
/* RESPONSIVE */
|
||||
|
||||
@media only screen and (max-width: 500px) {
|
||||
section[role="login"],
|
||||
section[role="password-reset"],
|
||||
section[role="restore-fresh"],
|
||||
section[role="restore-backup"] {
|
||||
width: 97%;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 375px) {
|
||||
section[role="login"],
|
||||
section[role="password-reset"],
|
||||
section[role="restore-fresh"],
|
||||
section[role="restore-backup"] {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
section[role="login"] img,
|
||||
section[role="password-reset"] img,
|
||||
section[role="restore-fresh"] img,
|
||||
section[role="restore-backup"] img {
|
||||
width: 50px;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,46 @@
|
||||
article[role="navigation"] {
|
||||
width: 100%;
|
||||
max-width: 900px;
|
||||
margin: 100px auto;
|
||||
}
|
||||
|
||||
article[role="navigation"] > section > div.nav-item {
|
||||
display: block;
|
||||
width: 98%;
|
||||
background: var(--white);
|
||||
border-radius: 3px;
|
||||
color: var(--highlight);
|
||||
margin: 0 0 10px;
|
||||
font-size: 1.5em;
|
||||
cursor: move;
|
||||
}
|
||||
|
||||
article[role="navigation"] > section > div.nav-item > label {
|
||||
display: inline-block;
|
||||
padding: 5px;
|
||||
margin: 12px 0 0 10px;
|
||||
vertical-align: top;
|
||||
cursor: move;
|
||||
}
|
||||
|
||||
article[role="navigation"] > section > div.nav-item > div#nav-btns {
|
||||
float: right;
|
||||
padding: 5px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
article[role="navigation"] > section > div.nav-item > div#nav-btns button {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 500px) {
|
||||
article[role="navigation"] > section > div.nav-item > label {
|
||||
width: 55%;
|
||||
margin: 0;
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
article[role="navigation"] > section i {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,91 @@
|
||||
header > nav[role="top-nav"] {
|
||||
display: grid;
|
||||
text-align: right;
|
||||
grid-template-columns: 50px auto auto;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
background: var(--white);
|
||||
border-radius: 3px;
|
||||
transform-style: preserve-3d;
|
||||
transform-origin: 100% 50%;
|
||||
transform: rotateX(0deg);
|
||||
transition: all 0.1s ease-out;
|
||||
perspective: 500px;
|
||||
backface-visibility: hidden;
|
||||
box-shadow: 2px 2px 0 rgba(var(--primary-rgb) / 30%);
|
||||
}
|
||||
|
||||
header > div[role="notify"] {
|
||||
display: grid;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
background: var(--black);
|
||||
border-radius: 3px;
|
||||
transform-style: preserve-3d;
|
||||
transform-origin: 100% 50%;
|
||||
transform: rotateX(180deg);
|
||||
transition: all 0.3s ease-out;
|
||||
perspective: 500px;
|
||||
backface-visibility: hidden;
|
||||
margin-top: -50px;
|
||||
box-shadow: 2px 2px 0 rgba(var(--primary-rgb) / 30%);
|
||||
}
|
||||
|
||||
header > div[role="notify"] > div[role="notify-message"] {
|
||||
display: flex;
|
||||
height: 86%;
|
||||
}
|
||||
|
||||
header > div[role="notify"] > div[role="notify-message"] div {
|
||||
display: inline-block;
|
||||
transition: all 0.2s linear;
|
||||
}
|
||||
|
||||
header
|
||||
> div[role="notify"]
|
||||
> div[role="notify-message"]
|
||||
> div[role="notify-text"] {
|
||||
color: var(--white);
|
||||
border-radius: 5px;
|
||||
height: 79%;
|
||||
margin-top: 8px;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
header
|
||||
> div[role="notify"]
|
||||
> div[role="notify-message"]
|
||||
> div[role="notify-icons"] {
|
||||
margin: 5px;
|
||||
width: 40px;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
header
|
||||
> div[role="notify"]
|
||||
> div[role="notify-message"]
|
||||
> div[role="notify-text"]
|
||||
span {
|
||||
display: block;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
header > div[role="notify"] > div[role="notify-message"] i {
|
||||
display: none;
|
||||
color: var(--white);
|
||||
}
|
||||
|
||||
i[role="notify-working"] {
|
||||
animation: 2s infinite linear spin;
|
||||
height: 40px;
|
||||
width: 40px;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
from {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,111 @@
|
||||
code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
color: var(--editor-primary);
|
||||
background: none;
|
||||
font-family: var(--mono-type);
|
||||
text-align: left;
|
||||
white-space: pre;
|
||||
word-spacing: normal;
|
||||
word-break: normal;
|
||||
word-wrap: normal;
|
||||
tab-size: 4;
|
||||
hyphens: none;
|
||||
}
|
||||
|
||||
pre[class*="language-"] {
|
||||
margin: 0.1em 0;
|
||||
overflow: auto;
|
||||
border-radius: 0.3em;
|
||||
}
|
||||
|
||||
:not(pre) > code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
background: var(--primary);
|
||||
}
|
||||
|
||||
:not(pre) {
|
||||
& > code[class*="language-"] {
|
||||
padding: 0.1em;
|
||||
border-radius: 0.3em;
|
||||
white-space: normal;
|
||||
}
|
||||
}
|
||||
|
||||
.token.comment,
|
||||
.token.prolog,
|
||||
.token.doctype,
|
||||
.token.cdata {
|
||||
color: #8292a2;
|
||||
}
|
||||
|
||||
.token.punctuation {
|
||||
color: var(--editor-secondary);
|
||||
}
|
||||
|
||||
.token.namespace {
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.token.keyword {
|
||||
color: #66d9ef;
|
||||
}
|
||||
|
||||
.token.italic {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.token.entity {
|
||||
cursor: help;
|
||||
}
|
||||
|
||||
.token.content {
|
||||
color: var(--editor-tertiary);
|
||||
}
|
||||
|
||||
.token.property,
|
||||
.token.tag,
|
||||
.token.constant,
|
||||
.token.symbol,
|
||||
.token.deleted {
|
||||
color: var(--editor-tag);
|
||||
}
|
||||
|
||||
.token.boolean,
|
||||
.token.number {
|
||||
color: #ae81ff;
|
||||
}
|
||||
|
||||
.token.selector,
|
||||
.token.attr-name,
|
||||
.token.string,
|
||||
.token.char,
|
||||
.token.builtin,
|
||||
.token.inserted {
|
||||
color: #a6e22e;
|
||||
}
|
||||
|
||||
.token.operator,
|
||||
.token.entity,
|
||||
.token.url,
|
||||
.language-css .token.string,
|
||||
.style .token.string,
|
||||
.token.variable {
|
||||
color: var(--editor-string);
|
||||
}
|
||||
|
||||
.token.atrule,
|
||||
.token.attr-value,
|
||||
.token.function,
|
||||
.token.class-name {
|
||||
color: #e6db74;
|
||||
}
|
||||
|
||||
.token.regex,
|
||||
.token.important {
|
||||
color: var(--editor-secondary);
|
||||
}
|
||||
|
||||
.token.important,
|
||||
.token.bold {
|
||||
font-weight: normal;
|
||||
}
|
||||
@ -0,0 +1,439 @@
|
||||
/* FILE MANAGER */
|
||||
main > section[role="file-manager"] {
|
||||
width: 100%;
|
||||
background: var(--tertiary);
|
||||
padding: 20px 0;
|
||||
margin-top: 75px;
|
||||
}
|
||||
|
||||
main > section[role="file-manager"] label[role="list-title"] {
|
||||
width: 100%;
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
display: block;
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
main > section[role="file-manager"] > div[role="file-drop"] {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
min-height: 100px;
|
||||
background: var(--white);
|
||||
color: var(--primary);
|
||||
vertical-align: middle;
|
||||
border-radius: 5px;
|
||||
max-width: 900px;
|
||||
margin: 10px auto;
|
||||
}
|
||||
|
||||
main > section[role="file-manager"] > div[role="page-images-list"],
|
||||
main > section[role="file-manager"] > div[role="page-files-list"] {
|
||||
max-width: 900px;
|
||||
width: 100%;
|
||||
margin: 10px auto;
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr 1fr 1fr;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
main > section[role="file-manager"] > div[role="page-images-list"] > div,
|
||||
main > section[role="file-manager"] > div[role="page-files-list"] > div {
|
||||
width: 100%;
|
||||
height: 150px;
|
||||
border-radius: 3px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
main
|
||||
> section[role="file-manager"]
|
||||
> div[role="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 {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
main
|
||||
> section[role="text-editor"]
|
||||
> div[role="text-editor-control"]
|
||||
button
|
||||
> i {
|
||||
font-size: 1.6em;
|
||||
}
|
||||
|
||||
main
|
||||
> section[role="text-editor"]
|
||||
> div[role="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) {
|
||||
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 {
|
||||
color: var(--white);
|
||||
margin: 5px;
|
||||
}
|
||||
|
||||
main
|
||||
> section[role="file-manager"]
|
||||
> div[role="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 {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
main
|
||||
> section[role="file-manager"]
|
||||
> div[role="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 {
|
||||
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 {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
background: var(--secondary);
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
main
|
||||
> section[role="file-manager"]
|
||||
> div[role="page-files-list"]
|
||||
> div.audio-item
|
||||
> audio {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* PAGE META */
|
||||
|
||||
main > section[role="page-meta"] {
|
||||
width: 100%;
|
||||
background: var(--highlight);
|
||||
}
|
||||
|
||||
main > section[role="page-meta"] > div[role="page-meta-wrapper"] {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 20px;
|
||||
width: 100%;
|
||||
max-width: 900px;
|
||||
margin: 10px auto;
|
||||
color: var(--white);
|
||||
}
|
||||
|
||||
main section[role="page-meta"] textarea#post-title-text {
|
||||
background: var(--white);
|
||||
font-family: var(--base-type);
|
||||
width: 100%;
|
||||
height: 80px;
|
||||
font-size: 2em;
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
main section[role="page-meta"] textarea#post-tags {
|
||||
background: var(--white);
|
||||
font-family: var(--base-type);
|
||||
width: 100%;
|
||||
height: 80px;
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
main section[role="page-meta"] select {
|
||||
background: var(--primary);
|
||||
color: var(--secondary);
|
||||
border-radius: 3px;
|
||||
border-color: var(--primary);
|
||||
width: 100%;
|
||||
height: 45px;
|
||||
padding: 5px;
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
main section[role="page-meta"] div[role="page-options"] {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
main
|
||||
section[role="page-meta"]
|
||||
div[role="page-meta-wrapper"]
|
||||
div[role="page-options"]
|
||||
button {
|
||||
width: 25%;
|
||||
height: 45px;
|
||||
transition: all 0.3s linear;
|
||||
margin: 0;
|
||||
border-radius: 0;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
main
|
||||
> section[role="page-meta"]
|
||||
> div[role="page-meta-wrapper"]
|
||||
> div[role="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 {
|
||||
border-radius: 0 3px 3px 0;
|
||||
}
|
||||
|
||||
main
|
||||
section[role="page-meta"]
|
||||
div[role="page-meta-wrapper"]
|
||||
button[data-active="false"] {
|
||||
background: var(--primary);
|
||||
}
|
||||
|
||||
main
|
||||
section[role="page-meta"]
|
||||
div[role="page-meta-wrapper"]
|
||||
button[data-active="false"]
|
||||
svg {
|
||||
fill: var(--secondary);
|
||||
}
|
||||
|
||||
main
|
||||
section[role="page-meta"]
|
||||
div[role="page-meta-wrapper"]
|
||||
div[role="page-options"]
|
||||
button[data-active="true"] {
|
||||
background: var(--tertiary);
|
||||
}
|
||||
|
||||
main
|
||||
section[role="page-meta"]
|
||||
div[role="page-meta-wrapper"]
|
||||
div[role="page-options"]
|
||||
button[data-active="true"]
|
||||
svg {
|
||||
fill: var(--primary);
|
||||
}
|
||||
|
||||
main
|
||||
section[role="page-meta"]
|
||||
div[role="page-meta-wrapper"]
|
||||
div[role="page-created"]
|
||||
input {
|
||||
display: none;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
/* TEXT EDITOR */
|
||||
|
||||
main > section[role="text-editor"] {
|
||||
width: 100%;
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
main section[role="text-editor"] .icon-hide {
|
||||
display: none;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
main > section[role="text-editor"] > div[role="text-editor-control"] {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(10, 1fr);
|
||||
}
|
||||
|
||||
main > section[role="text-editor"] > div[role="edit-post-wrapper"] {
|
||||
width: 100%;
|
||||
max-width: 900px;
|
||||
border-radius: 5px;
|
||||
position: relative;
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
main
|
||||
> section[role="text-editor"]
|
||||
> div[role="edit-post-wrapper"]
|
||||
textarea:focus {
|
||||
outline: none;
|
||||
border-color: var(--highlight);
|
||||
}
|
||||
|
||||
main section[role="text-editor"] div[role="edit-post-wrapper"] #edit,
|
||||
main section[role="text-editor"] div[role="edit-post-wrapper"] #highlight {
|
||||
font-family: var(--mono-type);
|
||||
border: 0;
|
||||
width: 100%;
|
||||
min-height: 300px;
|
||||
height: auto;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
overflow: auto;
|
||||
word-wrap: normal;
|
||||
white-space: pre-wrap;
|
||||
line-break: normal;
|
||||
font-size: 1.1em;
|
||||
line-height: 1.2;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
main
|
||||
section[role="text-editor"]
|
||||
div[role="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 {
|
||||
z-index: 1;
|
||||
background: transparent;
|
||||
color: transparent;
|
||||
caret-color: var(--highlight);
|
||||
}
|
||||
|
||||
main
|
||||
> section[role="text-editor"]
|
||||
> div[role="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 {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* 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"] {
|
||||
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"] {
|
||||
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"] {
|
||||
width: 95%;
|
||||
}
|
||||
|
||||
main > section[role="page-meta"] > div[role="page-meta-wrapper"] {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
main > section[role="text-editor"] > div[role="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) {
|
||||
border-radius: 3px 0;
|
||||
}
|
||||
|
||||
main
|
||||
> section[role="text-editor"]
|
||||
> div[role="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) {
|
||||
border-radius: 0 0 0 3px;
|
||||
}
|
||||
|
||||
main
|
||||
> section[role="text-editor"]
|
||||
> div[role="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 {
|
||||
font-size: 0.8em;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,263 @@
|
||||
article[role="settings"] {
|
||||
margin: 100px auto;
|
||||
width: 100%;
|
||||
max-width: 900px;
|
||||
transition: all 0.8s linear;
|
||||
}
|
||||
|
||||
article[role="settings"] h1 {
|
||||
color: var(--white);
|
||||
}
|
||||
|
||||
article[role="settings"] label {
|
||||
color: var(--secondary);
|
||||
margin-bottom: 10px;
|
||||
display: inline-block;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
section[role="member-settings"] {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr 1fr 1fr;
|
||||
grid-auto-columns: auto;
|
||||
gap: 15px;
|
||||
width: 100%;
|
||||
max-width: 900px;
|
||||
margin: 10px auto;
|
||||
}
|
||||
|
||||
section[role="member-settings"] {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
section[role="member-settings"] > div:nth-child(1) {
|
||||
grid-column: 1/2;
|
||||
grid-row: 1/3;
|
||||
}
|
||||
|
||||
section[role="member-settings"] > div:nth-child(2) {
|
||||
grid-column: 2/4;
|
||||
grid-row: 1/3;
|
||||
}
|
||||
|
||||
section[role="member-settings"] > div:nth-child(3) {
|
||||
grid-row: 1/3;
|
||||
}
|
||||
|
||||
section[role="member-settings"] > div:nth-child(4) {
|
||||
color: var(--white);
|
||||
}
|
||||
|
||||
section[role="member-settings"] > div:nth-child(4) a {
|
||||
font-weight: bold;
|
||||
text-decoration: underline;
|
||||
color: var(--tertiary);
|
||||
}
|
||||
|
||||
section[role="member-settings"] > div:nth-child(5) {
|
||||
grid-column: 2/4;
|
||||
}
|
||||
|
||||
section[role="member-settings"] > div:nth-child(6) {
|
||||
grid-column: 1/3;
|
||||
}
|
||||
|
||||
section[role="member-settings"] > div:nth-child(7) {
|
||||
grid-column: 3/5;
|
||||
min-height: 325px;
|
||||
}
|
||||
|
||||
section[role="member-settings"] > div:nth-child(8) {
|
||||
grid-column: 1/4;
|
||||
color: var(--white);
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
section[role="member-settings"] > div[role="member-avatar"] div,
|
||||
section[role="member-settings"] > div[role="site-background"] div {
|
||||
height: 100%;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
section[role="member-settings"] div input[type="file"] {
|
||||
display: none;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
section[role="member-settings"] div input[type="text"] {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
section[role="member-settings"] div textarea {
|
||||
width: 99%;
|
||||
height: 63%;
|
||||
}
|
||||
|
||||
article[role="settings"] button {
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
height: 50px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
article[role="settings"] button > span {
|
||||
font-size: 0.8em;
|
||||
display: inline;
|
||||
top: -10px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
section[role="member-settings"]
|
||||
> div[role="features"]
|
||||
button[data-enabled="true"] {
|
||||
color: var(--white);
|
||||
}
|
||||
|
||||
section[role="member-settings"]
|
||||
> div[role="features"]
|
||||
button[data-enabled="false"] {
|
||||
color: var(--primary);
|
||||
background: var(--secondary);
|
||||
}
|
||||
|
||||
section[role="member-settings"]
|
||||
> div[role="theme"]
|
||||
button[data-enabled="true"] {
|
||||
color: var(--white);
|
||||
background: var(--highlight);
|
||||
display: block;
|
||||
border-radius: 3px;
|
||||
padding: 3px;
|
||||
}
|
||||
|
||||
section[role="member-settings"]
|
||||
> div[role="theme"]
|
||||
button[data-enabled="false"] {
|
||||
color: var(--primary);
|
||||
background: var(--secondary);
|
||||
display: block;
|
||||
border-radius: 3px;
|
||||
padding: 3px;
|
||||
}
|
||||
|
||||
section[role="member-settings"] > div[role="mail"] a {
|
||||
margin-right: 3px;
|
||||
color: var(--secondary);
|
||||
display: inline-block;
|
||||
height: 40px;
|
||||
padding: 15px 0 0;
|
||||
border-top: var(--primary) 1px solid;
|
||||
}
|
||||
|
||||
section[role="member-settings"] > div[role="mail"] a[data-enabled="true"] {
|
||||
color: var(--tertiary);
|
||||
font-weight: bold;
|
||||
border-top: var(--highlight) 1px solid;
|
||||
}
|
||||
|
||||
section[role="member-settings"] > div[role="mail"] div[data-enabled="false"] {
|
||||
visibility: hidden;
|
||||
display: none;
|
||||
}
|
||||
|
||||
section[role="member-settings"] > div[role="mail"] input {
|
||||
width: 96%;
|
||||
height: 30px;
|
||||
padding: 5px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
section[role="data-settings"] {
|
||||
color: var(--white);
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 900px) {
|
||||
main > article[role="settings"] {
|
||||
width: 97%;
|
||||
}
|
||||
|
||||
main > article[role="settings"] > section[role="member-settings"] {
|
||||
width: 97.5%;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 650px) {
|
||||
section[role="member-settings"] {
|
||||
grid-template-columns: 1fr 1fr;
|
||||
}
|
||||
|
||||
section[role="member-settings"] div textarea {
|
||||
height: 80px;
|
||||
}
|
||||
|
||||
section[role="member-settings"] > div:nth-child(1) {
|
||||
grid-column: 1/2;
|
||||
grid-row: 1/3;
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
section[role="member-settings"] > div:nth-child(2) {
|
||||
grid-column: 2/3;
|
||||
grid-row: 1/3;
|
||||
}
|
||||
|
||||
section[role="member-settings"] > div:nth-child(3) {
|
||||
grid-column: 1/3;
|
||||
grid-row: 3/5;
|
||||
}
|
||||
|
||||
section[role="member-settings"] > div:nth-child(4) {
|
||||
grid-column: 1/2;
|
||||
}
|
||||
|
||||
section[role="member-settings"] > div:nth-child(5) {
|
||||
grid-column: 2/3;
|
||||
}
|
||||
|
||||
section[role="member-settings"] > div:nth-child(6) {
|
||||
grid-column: 1/2;
|
||||
}
|
||||
|
||||
section[role="member-settings"] > div:nth-child(7) {
|
||||
grid-column: 2/3;
|
||||
min-height: 325px;
|
||||
}
|
||||
|
||||
section[role="member-settings"] > div:nth-child(8) {
|
||||
grid-column: 1/3;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 530px) {
|
||||
section[role="member-settings"] {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
section[role="member-settings"] div textarea {
|
||||
height: 80px;
|
||||
}
|
||||
|
||||
section[role="member-settings"] > div:nth-child(1) {
|
||||
grid-row: 1/3;
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
section[role="member-settings"] > div:nth-child(2) {
|
||||
grid-row: 3/5;
|
||||
}
|
||||
|
||||
section[role="member-settings"] > div:nth-child(3) {
|
||||
grid-column: 1;
|
||||
grid-row: 5/7;
|
||||
}
|
||||
|
||||
section[role="member-settings"] > div:nth-child(4),
|
||||
section[role="member-settings"] > div:nth-child(5),
|
||||
section[role="member-settings"] > div:nth-child(6),
|
||||
section[role="member-settings"] > div:nth-child(7),
|
||||
section[role="member-settings"] > div:nth-child(8) {
|
||||
grid-column: 1/3;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,13 @@
|
||||
@import url("colors.css");
|
||||
@import url("forms.css");
|
||||
@import url("typography.css");
|
||||
@import url("frame.css");
|
||||
@import url("icons.css");
|
||||
@import url("notifications.css");
|
||||
@import url("init.css");
|
||||
@import url("index.css");
|
||||
@import url("book.css");
|
||||
@import url("page-editor.css");
|
||||
@import url("page-editor-highlights.css");
|
||||
@import url("settings.css");
|
||||
@import url("navigation.css");
|
||||
Binary file not shown.
Binary file not shown.
@ -0,0 +1,29 @@
|
||||
:root {
|
||||
--base-type: helvetica, arial, sans-serif;
|
||||
--mono-type: "Lucida Console", monaco, monospace;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3 {
|
||||
color: var(--white);
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 1.6em;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.3em;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
main > article > h1 {
|
||||
color: var(--primary);
|
||||
}
|
||||
@ -1,33 +1,33 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg width="100%" height="100%" viewBox="0 0 486 678" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
|
||||
<g id="Logo" transform="matrix(1.36867,0,0,1.36867,-351.696,-71.9183)">
|
||||
<g transform="matrix(2.31599,0,0,2.31599,218.53,-99.4797)">
|
||||
<path d="M93.67,140.92L93.67,140.921C105.569,140.921 115.216,150.567 115.216,162.467L115.216,172.724L115.216,172.724L115.216,182.262C115.216,194.161 105.569,203.808 93.669,203.808C81.976,203.217 74.12,195.969 72.237,184.474L72.282,182.737L72.282,162.467L72.205,160.847C72.775,149.587 82.728,141.121 93.67,140.92Z" style="fill:rgb(252,99,153);fill-rule:nonzero;"/>
|
||||
</g>
|
||||
<g transform="matrix(2.31599,0,0,2.31599,218.53,-437.697)">
|
||||
<path d="M93.67,211.678L93.67,211.678C105.569,211.678 115.216,221.324 115.216,233.224L115.216,243.481L115.216,243.481L115.216,253.019C115.216,264.919 105.569,274.565 93.669,274.565C81.976,273.975 74.12,266.726 72.237,255.232L72.282,253.495L72.282,233.224L72.205,231.604C72.775,220.344 82.728,211.878 93.67,211.678Z" style="fill:rgb(252,99,153);fill-rule:nonzero;"/>
|
||||
</g>
|
||||
<g transform="matrix(2.31599,0,0,2.31599,218.53,241.338)">
|
||||
<path d="M93.67,69.288L93.67,69.288C105.569,69.288 115.216,78.934 115.216,90.834L115.216,101.091L115.216,101.091L115.216,110.629C115.216,122.528 105.569,132.175 93.669,132.175C81.976,131.584 74.12,124.336 72.237,112.842L72.282,111.105L72.282,90.834L72.205,89.214C72.775,77.954 82.728,69.488 93.67,69.288Z" style="fill:rgb(171,183,183);fill-rule:nonzero;"/>
|
||||
</g>
|
||||
<g transform="matrix(2.31599,0,0,2.31599,218.53,-104.112)">
|
||||
<path d="M38.059,142.92L38.059,142.921C49.958,142.921 59.605,152.567 59.605,164.467L59.605,174.724L59.605,174.724L59.605,184.262C59.605,196.161 49.958,205.808 38.058,205.808C26.365,205.217 18.509,197.969 16.626,186.474L16.671,184.737L16.671,164.467L16.594,162.847C17.164,151.587 27.117,143.121 38.059,142.92Z" style="fill:rgb(252,99,153);fill-rule:nonzero;"/>
|
||||
</g>
|
||||
<g transform="matrix(2.31599,0,0,2.31599,218.53,-104.112)">
|
||||
<path d="M148.331,142.92L148.331,142.921C160.23,142.921 169.877,152.567 169.877,164.467L169.877,174.724L169.877,174.724L169.877,184.262C169.877,196.161 160.23,205.808 148.331,205.808C136.637,205.217 128.782,197.969 126.898,186.474L126.943,184.737L126.943,164.467L126.867,162.847C127.436,151.587 137.389,143.121 148.331,142.92Z" style="fill:rgb(171,183,183);fill-rule:nonzero;"/>
|
||||
</g>
|
||||
<g transform="matrix(2.31599,0,0,2.31599,218.53,-437.697)">
|
||||
<path d="M38.059,211.678L38.059,211.678C49.958,211.678 59.605,221.324 59.605,233.224L59.605,243.481L59.605,243.481L59.605,253.019C59.605,264.919 49.958,274.565 38.058,274.565C26.365,273.975 18.509,266.726 16.626,255.232L16.671,253.495L16.671,233.224L16.594,231.604C17.164,220.344 27.117,211.878 38.059,211.678Z" style="fill:rgb(252,99,153);fill-rule:nonzero;"/>
|
||||
</g>
|
||||
<g transform="matrix(2.31599,0,0,2.31599,218.53,-437.697)">
|
||||
<path d="M148.331,211.678L148.331,211.678C160.23,211.678 169.877,221.324 169.877,233.224L169.877,243.481L169.877,243.481L169.877,253.019C169.877,264.919 160.23,274.565 148.331,274.565C136.637,273.975 128.782,266.726 126.898,255.232L126.943,253.495L126.943,233.224L126.867,231.604C127.436,220.344 137.389,211.878 148.331,211.678Z" style="fill:rgb(252,99,153);fill-rule:nonzero;"/>
|
||||
</g>
|
||||
<g transform="matrix(2.31599,0,0,2.31599,218.53,241.338)">
|
||||
<path d="M38.059,69.288L38.059,69.288C49.958,69.288 59.605,78.934 59.605,90.834L59.605,101.091L59.605,101.091L59.605,110.629C59.605,122.528 49.958,132.175 38.058,132.175C26.365,131.584 18.509,124.336 16.626,112.842L16.671,111.105L16.671,90.834L16.594,89.214C17.164,77.954 27.117,69.488 38.059,69.288Z" style="fill:rgb(252,99,153);fill-rule:nonzero;"/>
|
||||
</g>
|
||||
<g transform="matrix(2.31599,0,0,2.31599,218.53,241.338)">
|
||||
<path d="M148.331,69.288L148.331,69.288C160.23,69.288 169.877,78.934 169.877,90.834L169.877,101.091L169.877,101.091L169.877,110.629C169.877,122.528 160.23,132.175 148.331,132.175C136.637,131.584 128.782,124.336 126.898,112.842L126.943,111.105L126.943,90.834L126.867,89.214C127.436,77.954 137.389,69.488 148.331,69.288Z" style="fill:rgb(171,183,183);fill-rule:nonzero;"/>
|
||||
</g>
|
||||
</g>
|
||||
<svg width="100%" height="100%" viewBox="0 0 462 462" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
|
||||
<g transform="matrix(1.58717,0,0,1.58717,-403.964,-376.506)">
|
||||
<g transform="matrix(1,0,0,1,200.753,94.1743)">
|
||||
<circle cx="92.268" cy="181.547" r="38.502" style="fill:rgb(252,99,153);"/>
|
||||
</g>
|
||||
<g transform="matrix(1,0,0,1,200.753,201.192)">
|
||||
<circle cx="92.268" cy="181.547" r="38.502" style="fill:rgb(252,99,153);"/>
|
||||
</g>
|
||||
<g transform="matrix(1,0,0,1,307.732,201.192)">
|
||||
<circle cx="92.268" cy="181.547" r="38.502" style="fill:rgb(252,99,153);"/>
|
||||
</g>
|
||||
<g transform="matrix(1,0,0,1,414.761,201.192)">
|
||||
<circle cx="92.268" cy="181.547" r="38.502" style="fill:rgb(171,183,183);"/>
|
||||
</g>
|
||||
<g transform="matrix(1,0,0,1,200.753,308.228)">
|
||||
<circle cx="92.268" cy="181.547" r="38.502" style="fill:rgb(252,99,153);"/>
|
||||
</g>
|
||||
<g transform="matrix(1,0,0,1,307.732,308.228)">
|
||||
<circle cx="92.268" cy="181.547" r="38.502" style="fill:rgb(171,183,183);"/>
|
||||
</g>
|
||||
<g transform="matrix(1,0,0,1,414.761,308.228)">
|
||||
<circle cx="92.268" cy="181.547" r="38.502" style="fill:rgb(171,183,183);"/>
|
||||
</g>
|
||||
<g transform="matrix(1,0,0,1,414.761,94.1743)">
|
||||
<circle cx="92.268" cy="181.547" r="38.502" style="fill:rgb(252,99,153);"/>
|
||||
</g>
|
||||
<g transform="matrix(6.12323e-17,1,-1,6.12323e-17,581.547,183.453)">
|
||||
<circle cx="92.268" cy="181.547" r="38.502" style="fill:rgb(252,99,153);"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 4.6 KiB After Width: | Height: | Size: 1.7 KiB |
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue