GNUsocial/gnu-social
4
0
Fork 1
Code Issues Releases Wiki Activity

[UI][CONTROLLER] Settings page styling almost done.

Browse Source
This commit is contained in:
rainydaysavings 2020-06-27 23:47:18 +01:00 committed by Hugo Sales
parent 79b9e66315
commit 1498c44e74
Signed by: someonewithpc
GPG Key ID: 7D0C7EAFC9D835A0
5 changed files with 293 additions and 77 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

123
public/assets/css/settings/settings.css
View File

@ -10,7 +10,7 @@
margin-right: 20%;
background-color: #00000080;
padding: 1em 1em;
font-size: 0.7em;
font-size: 0.8em;
box-shadow: 0px 0px 60px -20px rgba(41, 50, 60, 1);
}
@ -19,8 +19,8 @@
align-items: stretch;
justify-content: space-evenly;
width: 100%;
margin-left: 10%;
margin-right: 10%;
margin-left: 5%;
margin-right: 5%;
padding: 0;
}
@ -47,23 +47,114 @@
/*-------------------------------------*/
/*-------------------------------------*/
/* CONTENT ----------------------------*/
.content {
order: 3;
.set-nav2 {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
order: 2;
width: 100%;
margin-top: 1em;
margin-bottom: 1em;
margin-left: 20%;
margin-right: 20%;
background-color: rgba(0, 0, 0, 0.40);
padding: 0 1em 1em 1em;
border-radius: 1em;
font-size: 0.65em;
margin-top: 1em;
background-color: #00000080;
border-top-left-radius: 1em;
border-top-right-radius: 1em;
padding: 0.8em 0.8em;
font-size: 0.8em;
box-shadow: 0px 0px 60px -20px rgba(41, 50, 60, 1);
}
.content ul {
margin: 0;
padding-left: 2em;
list-style: disc;
.set-nav2 ul {
display: flex;
align-items: stretch;
justify-content: space-evenly;
width: 100%;
margin-left: 10%;
margin-right: 10%;
padding: 0;
}
.set-nav2 li {
display: block;
flex: 0 1 auto;
list-style-type: none;
}
.set-nav2 a {
color: #91B9D0;
}
.set-nav2 a:hover {
color: #F6F6F6;
transition: all 0.8s ease;
}
/* CONTENT ----------------------------*/
.content {
display: flex;
flex-wrap: wrap;
order: 3;
width: 100%;
margin-bottom: 1em;
margin-left: 20%;
margin-right: 20%;
background-color: rgba(0, 0, 0, 0.30);
padding: 1em 1em 1em 1em;
border-bottom-left-radius: 1em;
border-bottom-right-radius: 1em;
font-size: 0.8em;
box-shadow: 0px 0px 60px -20px rgba(41, 50, 60, 1);
}
/* FORMS ------------------------------*/
.label {
font-family: 'Montserrat', sans-serif;
font-weight: 800;
}
#nickname {
order: 1;
width: 98%;
}
#name {
order: 2;
width: 98%;
margin-top: 1em;
}
#homepage {
order: 3;
width: 98%;
margin-top: 1em;
}
#bio {
order: 4;
width: 98%;
margin-top: 1em;
}
#location {
order: 5;
width: 98%;
margin-top: 1em;
}
#save {
order: 6;
margin-top: 1em;
margin-left: auto;
}
input[type=text] {
margin-top: 0.5em;
width: 100%;
background-color: rgba(0, 0, 0, 0.30);
border-style: none;
padding: 0.5em 0.5em;
color: #F6F6F6;
border-radius: 0.5em;
font-size: 0.9em;
}

58
public/assets/css/settings/settings_mid.css
View File

@ -59,7 +59,7 @@
background-color: #00000080;
border-top-left-radius: 1em;
border-top-right-radius: 1em;
padding: 1em 1em;
padding: 0.8em 0.8em;
font-size: 0.8em;
box-shadow: 0px 0px 60px -20px rgba(41, 50, 60, 1);
}
@ -92,6 +92,8 @@
/* CONTENT ----------------------------*/
.content {
display: flex;
flex-wrap: wrap;
order: 3;
width: 100%;
margin-bottom: 1em;
@ -105,8 +107,54 @@
box-shadow: 0px 0px 60px -20px rgba(41, 50, 60, 1);
}
.content ul {
margin: 0;
padding-left: 2em;
list-style: disc;
/* FORMS ------------------------------*/
.label {
font-family: 'Montserrat', sans-serif;
font-weight: 800;
}
#nickname {
order: 1;
width: 98%;
}
#name {
order: 2;
width: 98%;
margin-top: 1em;
}
#homepage {
order: 3;
width: 98%;
margin-top: 1em;
}
#bio {
order: 4;
width: 98%;
margin-top: 1em;
}
#location {
order: 5;
width: 98%;
margin-top: 1em;
}
#save {
order: 6;
margin-top: 1em;
margin-left: auto;
}
input[type=text] {
margin-top: 0.5em;
width: 100%;
background-color: rgba(0, 0, 0, 0.30);
border-style: none;
padding: 0.5em 0.5em;
color: #F6F6F6;
border-radius: 0.5em;
font-size: 0.9em;
}

123
public/assets/css/settings/settings_small.css
View File

@ -10,7 +10,7 @@
margin-right: 0;
background-color: #00000080;
padding: 1em 1em;
font-size: 0.7em;
font-size: 0.8em;
box-shadow: 0px 0px 60px -20px rgba(41, 50, 60, 1);
}
@ -19,8 +19,8 @@
align-items: stretch;
justify-content: space-evenly;
width: 100%;
margin-left: 0;
margin-right: 0;
margin-left: 5%;
margin-right: 5%;
padding: 0;
}
@ -47,23 +47,114 @@
/*-------------------------------------*/
/*-------------------------------------*/
/* CONTENT ----------------------------*/
.content {
order: 3;
.set-nav2 {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
order: 2;
width: 100%;
margin-top: 1em;
margin-bottom: 1em;
margin-left: 1%;
margin-right: 1%;
background-color: rgba(0, 0, 0, 0.40);
padding: 0 1em 1em 1em;
border-radius: 1em;
font-size: 0.7em;
margin-top: 1em;
background-color: #00000080;
border-top-left-radius: 1em;
border-top-right-radius: 1em;
padding: 0.8em 0.8em;
font-size: 0.8em;
box-shadow: 0px 0px 60px -20px rgba(41, 50, 60, 1);
}
.content ul {
margin: 0;
padding-left: 2em;
list-style: disc;
.set-nav2 ul {
display: flex;
align-items: stretch;
justify-content: space-evenly;
width: 100%;
margin-left: 10%;
margin-right: 10%;
padding: 0;
}
.set-nav2 li {
display: block;
flex: 0 1 auto;
list-style-type: none;
}
.set-nav2 a {
color: #91B9D0;
}
.set-nav2 a:hover {
color: #F6F6F6;
transition: all 0.8s ease;
}
/* CONTENT ----------------------------*/
.content {
display: flex;
flex-wrap: wrap;
order: 3;
width: 100%;
margin-bottom: 1em;
margin-left: 1%;
margin-right: 1%;
background-color: rgba(0, 0, 0, 0.30);
padding: 1em 1em 1em 1em;
border-bottom-left-radius: 1em;
border-bottom-right-radius: 1em;
font-size: 0.8em;
box-shadow: 0px 0px 60px -20px rgba(41, 50, 60, 1);
}
/* FORMS ------------------------------*/
.label {
font-family: 'Montserrat', sans-serif;
font-weight: 800;
}
#nickname {
order: 1;
width: 98%;
}
#name {
order: 2;
width: 98%;
margin-top: 1em;
}
#homepage {
order: 3;
width: 98%;
margin-top: 1em;
}
#bio {
order: 4;
width: 98%;
margin-top: 1em;
}
#location {
order: 5;
width: 98%;
margin-top: 1em;
}
#save {
order: 6;
margin-top: 1em;
margin-left: auto;
}
input[type=text] {
margin-top: 0.5em;
width: 100%;
background-color: rgba(0, 0, 0, 0.30);
border-style: none;
padding: 0.5em 0.5em;
color: #F6F6F6;
border-radius: 0.5em;
font-size: 0.9em;
}

45
src/Controller/UserAdminPanel.php
View File

@ -32,12 +32,9 @@ namespace App\Controller;
// use App\Core\Event;
// use App\Util\Common;
use App\Core\DB\DB;
use App\Core\DB\DefaultSettings;
use App\Core\Form;
use function App\Core\I18n\_m;
use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
use Symfony\Component\Form\Extension\Core\Type\ChoiceType;
use Symfony\Component\Form\Extension\Core\Type\SubmitType;
use Symfony\Component\Form\Extension\Core\Type\TextType;
use Symfony\Component\HttpFoundation\Request;
@ -46,41 +43,13 @@ class UserAdminPanel extends AbstractController
{
public function __invoke(Request $request)
{
$defaults = DefaultSettings::$defaults;
$options = [];
foreach ($defaults as $key => $inner) {
$options[$key] = [];
foreach (array_keys($inner) as $inner_key) {
$options[_m($key)][_m($inner_key)] = "{$key}:{$inner_key}";
}
}
$form = Form::create([[_m('Setting'), ChoiceType::class, ['choices' => $options]],
[_m('Value'), TextType::class],
['save', SubmitType::class, ['label' => _m('Set site setting')]], ]);
$form->handleRequest($request);
if ($form->isSubmitted()) {
$data = $form->getData();
if ($form->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', [
'form' => $form->createView(),
'old_value' => unserialize($old_value),
'default' => $default,
]);
} else {
// Display error
}
}
$form = Form::create([
[_m('Nickname'), TextType::class],
[_m('FullName'), TextType::class],
[_m('Homepage'), TextType::class],
[_m('Bio'), TextType::class],
[_m('Location'), TextType::class],
['save', SubmitType::class, ['label' => _m('Save')]], ]);
foreach (['profile', 'avatar'] as $s) {
return $this->render('settings/' . $s . '.html.twig', [

21
templates/settings/profile.html.twig
View File

@ -34,7 +34,24 @@
{% endblock %}
{% block body %}
<div class="content">
{{ form(form) }}
<div class='content'>
<div id='nickname'>
<div class='label'> {{ form_label(form.Nickname) }} </div> {{ form_widget(form.Nickname) }}
</div>
<div id='name'>
<div class='label'> {{ form_label(form.FullName) }} </div> {{ form_widget(form.FullName) }}
</div>
<div id='homepage'>
<div class='label'> {{ form_label(form.Homepage) }} </div> {{ form_widget(form.Homepage) }}
</div>
<div id='bio'>
<div class='label'> {{ form_label(form.Bio) }} </div> {{ form_widget(form.Bio) }}
</div>
<div id='location'>
<div class='label'> {{ form_label(form.Location) }} </div> {{ form_widget(form.Location) }}
</div>
<div id='save'>
{{ form_widget(form.save) }}
</div>
</div>
{% endblock %}