[UI][CONTROLLER][ROUTES] UserPanel account page form added, account page CSS work
This commit is contained in:
parent
5a53915f80
commit
6dd966bd3f
@ -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);
|
||||
|
@ -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);
|
||||
|
@ -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);
|
||||
}
|
||||
|
@ -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);
|
||||
}
|
||||
|
@ -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;
|
||||
}
|
||||
|
@ -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(),
|
||||
]);
|
||||
}
|
||||
}
|
||||
|
@ -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']);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -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>
|
||||
|
@ -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 %}
|
||||
|
@ -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>
|
||||
|
Loading…
Reference in New Issue
Block a user