[UI][CONTROLLER][ROUTES] UserPanel account page form added, account page CSS work

This commit is contained in:
rainydaysavings 2020-07-21 22:02:39 +01:00 committed by Hugo Sales
parent 5a53915f80
commit 6dd966bd3f
Signed by: someonewithpc
GPG Key ID: 7D0C7EAFC9D835A0
10 changed files with 125 additions and 25 deletions

View File

@ -208,7 +208,7 @@ b {
cursor: pointer;
opacity: 0;
}
input[type=checkbox] {
.left-panel input[type=checkbox] {
transform: scale(2);
-ms-transform: scale(2);
-webkit-transform: scale(2);

View File

@ -205,7 +205,7 @@ label {
height: var(--unit-size);
opacity: 0;
}
input[type=checkbox] {
.left-panel input[type=checkbox] {
transform: scale(2);
-ms-transform: scale(2);
-webkit-transform: scale(2);

View File

@ -114,18 +114,32 @@
border-radius: 0 0 var(--unit-size) var(--unit-size);
}
.form-single {
order: 3;
background-color: #00000050;
padding: calc(2*var(--unit-size));
font-size: var(--medium-size);
height: 100%;
width: 100%;
margin-left: var(--side-margin);
margin-right: var(--side-margin);
margin-top: calc(2 * var(--unit-size));
box-shadow: 0px 0px 60px -20px rgba(0, 0, 0, 0.75);
border-radius: var(--unit-size);
}
/* FORMS ------------------------------*/
.form label {
label {
font-family: 'Montserrat', sans-serif;
font-weight: 700;
}
.form label:nth-child() {
label:nth-child() {
margin-top: var(--medium-size);
}
.form input[type=text] {
input[type=text] {
margin-top: calc(var(--unit-size) * 0.5);
width: calc(100% - var(--unit-size));
background-color: rgba(0, 0, 0, 0.30);
@ -136,7 +150,7 @@
font-size: var(--medium-size);
}
.form button[type=submit] {
button[type=submit] {
background: rgba(0, 0, 0, 0.30);
padding: calc(var(--unit-size) * 0.8) calc(var(--unit-size) * 2);
color: #F6F6F6;
@ -168,3 +182,7 @@
color: rgba(246, 246, 246, 0.8);
margin-bottom: var(--unit-size);
}
.form-single input[type=checkbox] {
margin-left: var(--unit-size);
}

View File

@ -112,18 +112,32 @@
border-radius: 0 0 var(--unit-size) var(--unit-size);
}
.form-single {
order: 3;
background-color: #00000050;
padding: calc(2*var(--unit-size));
font-size: var(--medium-size);
height: 100%;
width: 100%;
margin-left: var(--side-margin);
margin-right: var(--side-margin);
margin-top: calc(2 * var(--unit-size));
box-shadow: 0px 0px 60px -20px rgba(0, 0, 0, 0.75);
border-radius: var(--unit-size);
}
/* FORMS ------------------------------*/
.form label {
label {
font-family: 'Montserrat', sans-serif;
font-weight: 700;
}
.form label:nth-child() {
label:nth-child() {
margin-top: var(--medium-size);
}
.form input[type=text] {
input[type=text] {
margin-top: calc(var(--unit-size) * 0.5);
width: calc(100% - var(--unit-size));
background-color: rgba(0, 0, 0, 0.30);
@ -134,7 +148,7 @@
font-size: var(--medium-size);
}
.form button[type=submit] {
button[type=submit] {
background: rgba(0, 0, 0, 0.30);
padding: calc(var(--unit-size) * 0.8) calc(var(--unit-size) * 2);
color: #F6F6F6;
@ -166,3 +180,7 @@
color: rgba(246, 246, 246, 0.8);
margin-bottom: var(--unit-size);
}
.form-single input[type=checkbox] {
margin-left: var(--unit-size);
}

View File

@ -112,6 +112,20 @@
border-radius: 0 0 var(--unit-size) var(--unit-size);
}
.form-single {
order: 3;
background-color: #00000050;
padding: calc(2*var(--unit-size));
font-size: var(--medium-size);
height: 100%;
width: 100%;
margin-left: 1%;
margin-right: 1%;
margin-top: var(--unit-size);
box-shadow: 0px 0px 60px -20px rgba(0, 0, 0, 0.75);
border-radius: var(--unit-size);
}
/* FORMS ------------------------------*/
label {
@ -167,3 +181,8 @@ button[type=submit] {
color: rgba(246, 246, 246, 0.8);
margin-bottom: var(--unit-size);
}
.form-single input[type=checkbox] {
margin-left: var(--unit-size);
float: right;
}

View File

@ -37,6 +37,7 @@ use App\Core\DB\DB;
use App\Core\Form;
use function App\Core\I18n\_m;
use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
use Symfony\Component\Form\Extension\Core\Type\CheckboxType;
use Symfony\Component\Form\Extension\Core\Type\SubmitType;
use Symfony\Component\Form\Extension\Core\Type\TextareaType;
use Symfony\Component\Form\Extension\Core\Type\TextType;
@ -44,7 +45,7 @@ use Symfony\Component\HttpFoundation\Request;
class UserPanel extends AbstractController
{
public function __invoke(Request $request)
public function profile(Request $request)
{
$prof = Form::create([
[_m('Nickname'), TextType::class, ['help' => '1-64 lowercase letters or numbers, no punctuation or spaces.']],
@ -74,4 +75,36 @@ class UserPanel extends AbstractController
'prof' => $prof->createView(),
]);
}
public function account(Request $request)
{
$acc = Form::create([
[_m('outgoing_email'), TextType::class, ['help' => 'Change your current email.', 'label_format' => 'Email']],
[_m('password'), TextType::class, ['help' => 'Change your current password.']],
[_m('emailnotifysub'), CheckboxType::class, ['help' => 'Send me notices of new subscriptions through email.', 'label_format' => 'Notify subscriptions']],
[_m('emailnotifymsg'), CheckboxType::class, ['help' => 'Send me email when someone sends me a private message.', 'label_format' => 'Notify private messages']],
[_m('emailnotifyattn'), CheckboxType::class, ['help' => 'Send me email when someone sends me an "@-reply".', 'label_format' => 'Notify replies']],
[_m('emailnotifynudge'), CheckboxType::class, ['help' => 'Allow friends to nudge me and send me an email.', 'label_format' => 'Allow nudges']],
[_m('emailnotifyfav'), CheckboxType::class, ['help' => 'Send me email when someone adds my notice as a favorite.', 'label_format' => 'Notify favorites']],
['save', SubmitType::class, ['label' => _m('Save')]], ]);
$acc->handleRequest($request);
if ($acc->isSubmitted()) {
$data = $acc->getData();
if ($prof->isValid()) {
$user = DB::find('\App\Entity\User', ['id' => 2]);
foreach (['outgoing_email', 'password', 'emailnotifysub', 'emailnotifymsg', 'emailnotifyattn', 'emailnotifynudge', 'emailnotifyfav'] as $key) {
$method = "set{$key}";
$user->{$method}($data[_m($key)]);
}
DB::flush();
} else {
// Display error
}
}
return $this->render('settings/account.html.twig', [
'acc' => $acc->createView(),
]);
}
}

View File

@ -49,9 +49,11 @@ abstract class Main
// Settings pages
foreach (['profile', 'avatar'] as $s) {
$r->connect('settings_' . $s, 'settings/' . $s, C\UserPanel::class);
$r->connect('settings_' . $s, 'settings/' . $s, [C\UserPanel::class, 'profile']);
}
$r->connect('settings_account', 'settings/account', C\UserPanel::class);
foreach (['account'] as $s) {
$r->connect('settings_' . $s, 'settings/' . $s, [C\UserPanel::class, 'account']);
}
}
}

View File

@ -86,7 +86,7 @@
<a href='#'>Replies</a>
<a href='#'>Favourites</a>
<a href='#'>Reverse Favs</a>
<a href='#'>Settings</a>
<a href="{{ path('settings_profile') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'settings_' %}active{% endif %}'>Settings</a>
<a href='#'>Logout</a>
</div>
</div>

View File

@ -6,24 +6,34 @@
<link rel='stylesheet' type='text/css' href="{{ asset('assets/css/settings/settings_small.css') }}" media="screen and (max-width: 750px)">
{% endblock %}
{% block nav %}
{% block title %}Account Settings{% endblock %}
{% block header %}{{ parent() }}{% endblock %}
{% block body %}
<div class='content'>
<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>
<a href="{{ path('settings_profile') }}" class='hover-effect {% if (app.request.attributes.get('_route') starts with 'settings_profile') or (app.request.attributes.get('_route') starts with 'settings_avatar')%}active{% endif %}'>Settings</a>
</li>
<li>
<a href="{{ path('account_settings') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'account_settings' %}active{% endif %}'>Account</a>
<a href="{{ path('settings_account') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'settings_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>
{% endblock %}
{% block body %}
<div class="content">
{{ form(form) }}
</div>
{% endblock %}
{% block form %}
<div class='form-single'>
{{ form(acc) }}
</div>
{% endblock %}
</div>
{% endblock %}

View File

@ -16,10 +16,10 @@
<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>
<a href="{{ path('settings_profile') }}" class='hover-effect {% if (app.request.attributes.get('_route') starts with 'settings_profile') or (app.request.attributes.get('_route') starts with 'settings_avatar')%}active{% endif %}'>Settings</a>
</li>
<li>
<a href="{{ path('account_settings') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'account_settings' %}active{% endif %}'>Account</a>
<a href="{{ path('settings_account') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'settings_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>