fipamo/resources/views/back/settings.blade.php
ro ab158c99b0
settings page tab conversion part 1
the settings page needed to be updated to make space for incoming
features and settins, so a tab system has been plugged in to reorganize
the options availble

of course, everything needs to be restyled to match the new comps
https://www.figma.com/design/JQSy6XtVtSkiIxzXEM46IU/Fipamo-Dash?node-id=1204%3A285&t=kDgzU2ONXr3k5yUe-1
but the base structure is in, so now it's just about getting the css
right
2024-05-21 19:15:47 -06:00

148 lines
7.6 KiB
PHP

@extends('frame')
@section('title', 'The Dash | '. $title)
@section('main-content')
<article class="settings">
<div class="tab-toolbar" role="toolbar">
<button id="profile" class="tab-button">PROFILE</button>
<button id="features" class="tab-button">FEATURES</button>
<button id="themes" class="tab-button">THEMES</button>
</div>
<section class="settings-tabs">
<section id="member-profile" class="section-tab show">
<div class="member-avatar">
<div class="avatar" style="background: url({{ $member['avatar'] }} ) no-repeat center center / cover"></div>
<input id="avatar-upload" type="file" name="avatar-upload"/>
</div>
<div class="site-background">
<div class="background" style="background: url({{ $background }} ) no-repeat center center / cover"></div>
<input id="background-upload" type="file" name="backgrond-upload"/>
</div>
<div>
<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/>
<input type='hidden' name='member-id' id='member-id' value="{{ $member['id'] }}"/>
<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/>
<textarea id="settings-desc" type='text' name='settings_desc' class='settings-dec' placeholder='description stuff' , autofocus>{{ $desc }}</textarea>
</div>
</section>
<section id="member-features" class="section-tab hide">
MEMBER FEATURES
</section>
<section id="member-themes" class="section-tab hide">
MEMBER THEMES
</section>
</section>
<section class="member-settings">
<div>
<button id="create-backup">
<svg id="nav-menu-icon" class="icon">
<use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-back-in-time"/>
</svg>
<span>CREATE BACKUP</span>
</button><br/>
@if($lastBackup != '')
LAST BACK UP<br/>
<a href="/api/v1/backup/download">{{ $lastBackup }}</a><br/>
@else
<span>span No back ups. Frowny face.</span>
@endif
</div>
<div class="features">
@if(isset($apiStatus) && $apiStatus == 'true')
<button id="api-access-toggle" title="allow external api" data-enabled="true">
<svg id="nav-menu-icon" class="icon">
<use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-landline"/>
</svg>
<span id="api-status">API ACCESS ENABLED</span>
</button>
@else
<button id="api-access-toggle" title="allow external api" data-enabled="false">
<svg id="nav-menu-icon" class="icon">
<use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-landline"/>
</svg>
<span id="api-status">API ACCESS NOT ENABLED</span>
</button>
@endif
@if(isset($dynamicRenderStatus) && $dynamicRenderStatus == 'true')
<button id="dynamic-render-toggle" title="allow external api" data-enabled="true">
<svg id="nav-menu-icon" class="icon">
<use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-cycle"/>
</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="nav-menu-icon" class="icon">
<use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-cycle"/>
</svg>
<span id="dynamic-render-status">STATIC PAGE RENDERING</span>
</button>
@endif
</div>
<div class="theme">
<label>Themes</label><br/>
@foreach($themes as $theme)
@if($theme['name'] == $currentTheme)
<button id="{{ $theme['name'] }}" class="theme-select" data-enabled="true">
<svg id="nav-menu-icon" class="icon">
<use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-palette"/>
</svg>
<span>{{ $theme['display-name'] }}</span>
</button><a target="_blank" href='/theme'>Edit</a>
@else
<button href="#" id="{{ $theme['name'] }}" class="theme-select" data-enabled="false">
<svg id="nav-menu-icon" class="icon">
<use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-palette"/>
</svg>
<span>{{ $theme['display-name'] }}</span>
</button>
@endif
@endforeach
</div>
<div class="mail">
<label>Email</label><br/>
@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
@include('forms.mailforms')
<button id="send-mail">
<svg id="nav-menu-icon" class="icon">
<use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-mail-with-circle"/>
</svg>
<span>TEST MAIL</span>
</button>
</div>
<div>
<label>API KEY</label>
<br/>
{{ $member['key'] }}
<br/>
<label>FORM TOKEN</label><br/>
{{ $ftoken }}
</div>
</section>
</article>
@endsection
@section('scripting')
<script type="module" src="/assets/scripts/dash/app/EditSettings.js"></script>
@endsection