fipamo/brain/views/dash/settings.twig
Ro 07b422a9c3
CSS Overhaul Part 1
This one is a doozy, so let's breakt it down into what areas where
touched.

-   updated package json to remove unneeded dependencies.
-   rebuilt file uploading to simply a very convuluted process
-   began proces to replace icons with https://tabler-icons.io
-   began process of removing the need for css preprocessor and using
    pure css
        - login completed
        - dashboard index completed
        - page edit ui completed
- page edit ui text editor tweaked so syntax highlighting is cleaner and
  more accurate

The settings and navigation UIs still remain and then polishing the
responsive for the new css structure
2023-03-23 13:55:34 -07:00

190 lines
6.8 KiB
Twig

{% extends "dash/_frame.twig" %}
{% block title %}
{{ title }}
{% endblock %}
{% block stylesheets %}
<link rel="stylesheet" type="text/css" href="/assets/css/dash.css?=cvnbm">
{% endblock %}
{% block mainContent %}
<div id="settings-actions">
<div id="buttons">
<button id="save-toggle" title="save settings">
<svg id="submit-update" class="icons">
<use id="submit-update" xlink:href="/assets/images/global/sprite.svg#entypo-save"/>
</svg>
</button>
<button id="publish-pages" title="publish site">
<svg id="submit-update" class="icons">
<use id="submit-update" xlink:href="/assets/images/global/sprite.svg#entypo-publish"/>
</svg>
</button>
<button id="render-toggle" title="render on save toggle" data-render="{{ renderOnSave }}">
<svg id="render-toggle-icon" class="icons">
<use xlink:href="/assets/images/global/sprite.svg#entypo-circular-graph"/>
</svg>
</button>
</div>
</div>
<div id="settings-index">
<div id="settings-index-wrapper">
<div id="member-settings">
<div id="member-images" class="columns">
<div class="column is-one-third">
<div id="member-avatar-drop">
<img id="avatar" src="{{ member['avatar'] }}" for="avatar-upload"/>
<input id="avatar-upload" type="file" name="avatar-upload"/>
</div>
</div>
<div class="column is-two-thirds">
<div id="site-background">
<img id="background" src="{{ background }}" alt="image for site background" for="background-upload"/>
<input id="background-upload" type="file" name="backgrond-upload"/>
</div>
</div>
</div>
<div id="member-meta" class="columns">
<div class="column is-one-third">
<input type='text' name='handle' id='settings-handle' placeholder='handle' value="{{ member['handle'] }}" autofocus/>
<input type='text' name='email' id='settings-email' placeholder='email' value="{{ member['email'] }}" autofocus/>
</div>
<div class="column is-one-third">
<input type='text' name='base-url' id='settings-url' placeholder='url' value="{{ baseUrl }}" autofocus/>
<input type='text' name='base-title' id='settings-title' placeholder='site title' value="{{ siteTitle }}" autofocus/>
</div>
<div class="column is-one-third">
<textarea id="settings-desc" type='text' name='settings_desc' class='settings-dec' placeholder='description stuff' , autofocus>{{ desc }}</textarea>
</div>
</div>
</div>
<div id="feature-settings">
<div id="features" class="columns">
<div class="column">
<div id="feature-api">
{% if apiStatus is defined and apiStatus == "true" %}
<button id="api-access-toggle" title="allow external api" data-enabled="true">
<svg id="api-access-toggle" class="icons">
<use id="api-access-toggle" xlink:href="/assets/images/global/sprite.svg#entypo-landline"/>
</svg>
<span id="api-status">EXTERNAL API ACCESS ENABLED</span>
</button>
{% else %}
<button id="api-access-toggle" title="allow external api" data-enabled="false">
<svg id="api-access-toggle" class="icons">
<use id="api-access-toggle" xlink:href="/assets/images/global/sprite.svg#entypo-landline"/>
</svg>
<span id="api-status">EXTERNAL API ACCESS NOT ENABLED</span>
</button>
{% endif %}
</div>
</div>
<div class="column">
<div id="dynamic-api">
{% if dynamicRenderStatus is defined and dynamicRenderStatus == "true" %}
<button id="dynamic-render-toggle" title="allow external api" data-enabled="true">
<svg id="dynamic-render-toggle" class="icons">
<use id="dynamic-render-toggle" xlink:href="/assets/images/global/sprite.svg#entypo-text-document-inverted"/>
</svg>
<span id="dynamic-render-status">DYNAMIC PAGE RENDERING</span>
</button>
{% else %}
<button id="dynamic-render-toggle" title="allow external api" data-enabled="false">
<svg id="dynamic-render-toggle" class="icons">
<use id="dynamic-render-toggle" xlink:href="/assets/images/global/sprite.svg#entypo-text-document-inverted"/>
</svg>
<span id="dynamic-render-status">STATIC PAGE RENDERING</span>
</button>
{% endif %}
</div>
</div>
<div class="column"></div>
<div class="column"></div>
</div>
</div>
<div id="option-settings" class="columns">
<div id="theme-settings" class="column">
<label>THEMES</label>
{% for theme in themes %}
{% if theme.name == currentTheme %}
<a href="#" id="{{ theme.name }}" class="theme-select" data-enabled="true">{{ theme['display-name'] }}</a>
{% else %}
<a href="#" id="{{ theme.name }}" class="theme-select" data-enabled="false">{{ theme['display-name'] }}</a>
{% endif %}
{% endfor %}
</div>
<div id="mail-settings" class="column">
<label>EMAIL</label>
{% if mailOption == "option-none" or mailOption == "" %}
<a href="#" class="mail-option" id="option-none" data-enabled="true">NONE</a>
{% else %}
<a href="#" class="mail-option" id="option-none" data-enabled="false">NONE</a>
{% endif %}
{% if mailOption == "option-mg" or mailOption == "" %}
<a href="#" class="mail-option" id="option-mg" data-enabled="true">MAILGUN</a>
{% else %}
<a href="#" class="mail-option" id="option-mg" data-enabled="false">MAILGUN</a>
{% endif %}
{% if mailOption == "option-smtp" or mailOption == "" %}
<a href="#" class="mail-option" id="option-smtp" data-enabled="true">SMTP</a>
{% else %}
<a href="#" class="mail-option" id="option-smtp" data-enabled="false">SMTP</a>
{% endif %}
{% apply spaceless %}
{{ include("dash/partials/mailforms.twig") }}
{% endapply %}
<button id="send-mail">TEST MAIL</button>
<br/><br/>
</div>
</div>
<div id="token-settings">
<div id="keys-tokens" class="columns">
<div class="column">
<label>API KEY</label>
<div id="member-api-key">
{{ member['key'] }}
</div>
</div>
<div class="column">
<label>FORM TOKEN</label>
<div id="form-token">
{{ ftoken }}
</div>
</div>
</div>
</div>
<div id="backup-settings">
<div class="columns">
<div class="column">
<button id="create-backup">BACK UP YOUR SITE</button><br/>
</div>
<div class="column">
{% if lastBackup != '' %}
<div class="backup-meta">
LAST BACK UP
<a href="/api/v1/files">{{ lastBackup }}</a><br/>
</div>
{% else %}
<span>span No back ups. Frowny face.</span>
{% endif %}
</div>
</div>
</div>
</div>
</div>
{% endblock %}