[TWIG][UI] Settings: removed unnecessary pages, responsive CSS work

This commit is contained in:
rainydaysavings 2020-06-28 23:50:05 +01:00 committed by Hugo Sales
parent 1498c44e74
commit 82d50cc962
Signed by: someonewithpc
GPG Key ID: 7D0C7EAFC9D835A0
10 changed files with 97 additions and 138 deletions

View File

@ -10,7 +10,7 @@
margin-right: 20%;
background-color: #00000080;
padding: 1em 1em;
font-size: 0.8em;
font-size: 0.7em;
box-shadow: 0px 0px 60px -20px rgba(41, 50, 60, 1);
}
@ -49,7 +49,7 @@
/*-------------------------------------*/
.set-nav2 {
display: flex;
justify-content: space-between;
position: relative;
flex-wrap: wrap;
order: 2;
width: 100%;
@ -60,7 +60,7 @@
border-top-left-radius: 1em;
border-top-right-radius: 1em;
padding: 0.8em 0.8em;
font-size: 0.8em;
font-size: 0.7em;
box-shadow: 0px 0px 60px -20px rgba(41, 50, 60, 1);
}
@ -90,6 +90,16 @@
}
hr {
position: absolute;
margin-bottom: 0;
bottom: 0;
left: 0;
width: 80%;
margin-left: 10%;
color: #91b9d088;
}
/* CONTENT ----------------------------*/
.content {
display: flex;
@ -103,7 +113,7 @@
padding: 1em 1em 1em 1em;
border-bottom-left-radius: 1em;
border-bottom-right-radius: 1em;
font-size: 0.8em;
font-size: 0.7em;
box-shadow: 0px 0px 60px -20px rgba(41, 50, 60, 1);
}

View File

@ -10,7 +10,7 @@
margin-right: 5%;
background-color: #00000080;
padding: 1em 1em;
font-size: 0.8em;
font-size: 0.7em;
box-shadow: 0px 0px 60px -20px rgba(41, 50, 60, 1);
}
@ -49,7 +49,7 @@
/*-------------------------------------*/
.set-nav2 {
display: flex;
justify-content: space-between;
position: relative;
flex-wrap: wrap;
order: 2;
width: 100%;
@ -60,7 +60,7 @@
border-top-left-radius: 1em;
border-top-right-radius: 1em;
padding: 0.8em 0.8em;
font-size: 0.8em;
font-size: 0.7em;
box-shadow: 0px 0px 60px -20px rgba(41, 50, 60, 1);
}
@ -90,6 +90,16 @@
}
hr {
position: absolute;
margin-bottom: 0;
bottom: 0;
left: 0;
width: 80%;
margin-left: 10%;
color: #91b9d088;
}
/* CONTENT ----------------------------*/
.content {
display: flex;
@ -103,7 +113,7 @@
padding: 1em 1em 1em 1em;
border-bottom-left-radius: 1em;
border-bottom-right-radius: 1em;
font-size: 0.8em;
font-size: 0.7em;
box-shadow: 0px 0px 60px -20px rgba(41, 50, 60, 1);
}

View File

@ -48,8 +48,8 @@
/*-------------------------------------*/
/*-------------------------------------*/
.set-nav2 {
position: relative;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
order: 2;
width: 100%;
@ -60,7 +60,7 @@
border-top-left-radius: 1em;
border-top-right-radius: 1em;
padding: 0.8em 0.8em;
font-size: 0.8em;
font-size: 0.7em;
box-shadow: 0px 0px 60px -20px rgba(41, 50, 60, 1);
}
@ -69,8 +69,6 @@
align-items: stretch;
justify-content: space-evenly;
width: 100%;
margin-left: 10%;
margin-right: 10%;
padding: 0;
}
@ -90,6 +88,16 @@
}
hr {
position: absolute;
margin-bottom: 0;
bottom: 0;
left: 0;
width: 80%;
margin-left: 10%;
color: #91b9d088;
}
/* CONTENT ----------------------------*/
.content {
display: flex;

View File

@ -43,7 +43,7 @@ class UserAdminPanel extends AbstractController
{
public function __invoke(Request $request)
{
$form = Form::create([
$prof = Form::create([
[_m('Nickname'), TextType::class],
[_m('FullName'), TextType::class],
[_m('Homepage'), TextType::class],
@ -51,16 +51,31 @@ class UserAdminPanel extends AbstractController
[_m('Location'), TextType::class],
['save', SubmitType::class, ['label' => _m('Save')]], ]);
foreach (['profile', 'avatar'] as $s) {
return $this->render('settings/' . $s . '.html.twig', [
'form' => $form->createView(),
]);
$prof->handleRequest($request);
if ($prof->isSubmitted()) {
$data = $prof->getData();
if ($prof->isValid() && array_key_exists(_m('Setting'), $data)) {
list($section, $setting) = explode(':', $data[_m('Setting')]);
$value = $data[_m('Value')];
$default = $defaults[$section][$setting];
if (gettype($default) === gettype($value)) {
$conf = DB::find('\App\Entity\Config', ['section' => $section, 'setting' => $setting]);
$old_value = $conf->getValue();
$conf->setValue(serialize($value));
DB::flush();
}
return $this->render('config/admin.html.twig', [
'prof' => $prof->createView(),
'old_value' => unserialize($old_value),
'default' => $default,
]);
} else {
// Display error
}
}
foreach (['email', 'pass', 'bak'] as $s) {
return $this->render('settings/account' . $s . '.html.twig', [
'form' => $form->createView(),
]);
}
return $this->render('settings/profile.html.twig', [
'prof' => $prof->createView(),
]);
}
}

View File

@ -46,12 +46,11 @@ abstract class Main
$r->connect('doc_' . $s, 'doc/' . $s, TemplateController::class, [], ['defaults' => ['template' => 'faq/' . $s . '.html.twig']]);
}
// Settings pages
foreach (['profile', 'avatar'] as $s) {
$r->connect('settings_' . $s, 'settings/' . $s, C\UserAdminPanel::class);
}
foreach (['email', 'pass', 'bak'] as $s) {
$r->connect('account_' . $s, 'settings/account/' . $s, C\UserAdminPanel::class);
}
$r->connect('account_settings', 'settings/account', C\UserAdminPanel::class);
}
}

View File

@ -13,27 +13,13 @@
<a href="{{ path('settings_profile') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'settings_' %}active{% endif %}'>Settings</a>
</li>
<li>
<a href="{{ path('account_email') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'account_' %}active{% endif %}'>Account</a>
<a href="{{ path('account_settings') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'account_settings' %}active{% endif %}'>Account</a>
</li>
<li>
<a href="{{ path('doc_tags') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'doc_tags' %}active{% endif %}'>Misc</a>
</li>
</ul>
</nav>
<nav class='set-nav2'>
<ul>
<li>
<a href="{{ path('account_email') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'account_email' %}active{% endif %}'>Email</a>
</li>
<li>
<a href="{{ path('account_pass') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'account_pass' %}active{% endif %}'>Password</a>
</li>
<li>
<a href="{{ path('account_bak') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'account_bak' %}active{% endif %}'>Backup and Restore</a>
</li>
</ul>
</nav>
{% endblock %}
{% block body %}

View File

@ -1,43 +0,0 @@
{% extends 'base.html.twig' %}
{% block stylesheets %}
{{ parent() }}
<link rel='stylesheet' type='text/css' href="{{ asset('assets/css/settings/settings.css') }}" media="screen and (min-width: 1300px)">
<link rel='stylesheet' type='text/css' href="{{ asset('assets/css/settings/settings_mid.css') }}" media="screen and (max-width: 1300px)">
<link rel='stylesheet' type='text/css' href="{{ asset('assets/css/settings/settings_small.css') }}" media="screen and (max-width: 750px)">
{% endblock %}
{% block nav %}
<nav class='set-nav'>
<ul>
<li>
<a href="{{ path('settings_profile') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'settings_' %}active{% endif %}'>Settings</a>
</li>
<li>
<a href="{{ path('account_email') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'account_' %}active{% endif %}'>Account</a>
</li>
<li>
<a href="{{ path('doc_tags') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'doc_tags' %}active{% endif %}'>Misc</a>
</li>
</ul>
</nav>
<nav class='set-nav2'>
<ul>
<li>
<a href="{{ path('account_email') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'account_email' %}active{% endif %}'>Email</a>
</li>
<li>
<a href="{{ path('account_pass') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'account_pass' %}active{% endif %}'>Password</a>
</li>
<li>
<a href="{{ path('account_bak') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'account_bak' %}active{% endif %}'>Backup and Restore</a>
</li>
</ul>
</nav>
{% endblock %}
{% block body %}
<div class="content">
{{ form(form) }}
</div>
{% endblock %}

View File

@ -1,43 +0,0 @@
{% extends 'base.html.twig' %}
{% block stylesheets %}
{{ parent() }}
<link rel='stylesheet' type='text/css' href="{{ asset('assets/css/settings/settings.css') }}" media="screen and (min-width: 1300px)">
<link rel='stylesheet' type='text/css' href="{{ asset('assets/css/settings/settings_mid.css') }}" media="screen and (max-width: 1300px)">
<link rel='stylesheet' type='text/css' href="{{ asset('assets/css/settings/settings_small.css') }}" media="screen and (max-width: 750px)">
{% endblock %}
{% block nav %}
<nav class='set-nav'>
<ul>
<li>
<a href="{{ path('settings_profile') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'settings_' %}active{% endif %}'>Settings</a>
</li>
<li>
<a href="{{ path('account_email') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'account_' %}active{% endif %}'>Account</a>
</li>
<li>
<a href="{{ path('doc_tags') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'doc_tags' %}active{% endif %}'>Misc</a>
</li>
</ul>
</nav>
<nav class='set-nav2'>
<ul>
<li>
<a href="{{ path('account_email') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'account_email' %}active{% endif %}'>Email</a>
</li>
<li>
<a href="{{ path('account_pass') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'account_pass' %}active{% endif %}'>Password</a>
</li>
<li>
<a href="{{ path('account_bak') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'account_bak' %}active{% endif %}'>Backup and Restore</a>
</li>
</ul>
</nav>
{% endblock %}
{% block body %}
<div class="content">
{{ form(form) }}
</div>
{% endblock %}

View File

@ -13,14 +13,13 @@
<a href="{{ path('settings_profile') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'settings_' %}active{% endif %}'>Settings</a>
</li>
<li>
<a href="{{ path('account_email') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'account_' %}active{% endif %}'>Account</a>
<a href="{{ path('account_settings') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'account_settings' %}active{% endif %}'>Account</a>
</li>
<li>
<a href="{{ path('doc_tags') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'doc_tags' %}active{% endif %}'>Misc</a>
</li>
</ul>
</nav>
<nav class='set-nav2'>
<ul>
<li>
@ -30,11 +29,29 @@
<a href="{{ path('settings_avatar') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'settings_avatar' %}active{% endif %}'>Avatar</a>
</li>
</ul>
<hr>
</nav>
{% endblock %}
{% block body %}
<div class="content">
{{ form(form) }}
<div class='content'>
<div id='nickname'>
<div class='label'> {{ form_label(prof.Nickname) }} </div> {{ form_widget(prof.Nickname) }}
</div>
<div id='name'>
<div class='label'> {{ form_label(prof.FullName) }} </div> {{ form_widget(prof.FullName) }}
</div>
<div id='homepage'>
<div class='label'> {{ form_label(prof.Homepage) }} </div> {{ form_widget(prof.Homepage) }}
</div>
<div id='bio'>
<div class='label'> {{ form_label(prof.Bio) }} </div> {{ form_widget(prof.Bio) }}
</div>
<div id='location'>
<div class='label'> {{ form_label(prof.Location) }} </div> {{ form_widget(prof.Location) }}
</div>
<div id='save'>
{{ form_widget(prof.save) }}
</div>
</div>
{% endblock %}

View File

@ -13,14 +13,13 @@
<a href="{{ path('settings_profile') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'settings_' %}active{% endif %}'>Settings</a>
</li>
<li>
<a href="{{ path('account_email') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'account_' %}active{% endif %}'>Account</a>
<a href="{{ path('account_settings') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'account_settings' %}active{% endif %}'>Account</a>
</li>
<li>
<a href="{{ path('doc_tags') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'doc_tags' %}active{% endif %}'>Misc</a>
</li>
</ul>
</nav>
<nav class='set-nav2'>
<ul>
<li>
@ -30,28 +29,29 @@
<a href="{{ path('settings_avatar') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'settings_avatar' %}active{% endif %}'>Avatar</a>
</li>
</ul>
<hr>
</nav>
{% endblock %}
{% block body %}
<div class='content'>
<div id='nickname'>
<div class='label'> {{ form_label(form.Nickname) }} </div> {{ form_widget(form.Nickname) }}
<div class='label'> {{ form_label(prof.Nickname) }} </div> {{ form_widget(prof.Nickname) }}
</div>
<div id='name'>
<div class='label'> {{ form_label(form.FullName) }} </div> {{ form_widget(form.FullName) }}
<div class='label'> {{ form_label(prof.FullName) }} </div> {{ form_widget(prof.FullName) }}
</div>
<div id='homepage'>
<div class='label'> {{ form_label(form.Homepage) }} </div> {{ form_widget(form.Homepage) }}
<div class='label'> {{ form_label(prof.Homepage) }} </div> {{ form_widget(prof.Homepage) }}
</div>
<div id='bio'>
<div class='label'> {{ form_label(form.Bio) }} </div> {{ form_widget(form.Bio) }}
<div class='label'> {{ form_label(prof.Bio) }} </div> {{ form_widget(prof.Bio) }}
</div>
<div id='location'>
<div class='label'> {{ form_label(form.Location) }} </div> {{ form_widget(form.Location) }}
<div class='label'> {{ form_label(prof.Location) }} </div> {{ form_widget(prof.Location) }}
</div>
<div id='save'>
{{ form_widget(form.save) }}
{{ form_widget(prof.save) }}
</div>
</div>
{% endblock %}