Fix #285: Fix CSS issues in login form, homepage and form-group class (#287)

This commit is contained in:
lmsmartins 2023-02-27 16:19:42 -01:00 committed by GitHub
parent 980c25ed47
commit 6938fc41f2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 37 additions and 27 deletions

View File

@ -6,7 +6,7 @@ $this->title = 'My Yii Application';
?> ?>
<div class="site-index"> <div class="site-index">
<div class="jumbotron text-center bg-transparent"> <div class="jumbotron text-center bg-transparent mt-5 mb-5">
<h1 class="display-4">Congratulations!</h1> <h1 class="display-4">Congratulations!</h1>
<p class="lead">You have successfully created your Yii-powered application.</p> <p class="lead">You have successfully created your Yii-powered application.</p>
@ -17,7 +17,7 @@ $this->title = 'My Yii Application';
<div class="body-content"> <div class="body-content">
<div class="row"> <div class="row">
<div class="col-lg-4"> <div class="col-lg-4 mb-3">
<h2>Heading</h2> <h2>Heading</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et
@ -27,7 +27,7 @@ $this->title = 'My Yii Application';
<p><a class="btn btn-outline-secondary" href="http://www.yiiframework.com/doc/">Yii Documentation &raquo;</a></p> <p><a class="btn btn-outline-secondary" href="http://www.yiiframework.com/doc/">Yii Documentation &raquo;</a></p>
</div> </div>
<div class="col-lg-4"> <div class="col-lg-4 mb-3">
<h2>Heading</h2> <h2>Heading</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et

View File

@ -2,6 +2,7 @@
/** @var yii\web\View $this */ /** @var yii\web\View $this */
/** @var yii\bootstrap5\ActiveForm $form */ /** @var yii\bootstrap5\ActiveForm $form */
/** @var app\models\LoginForm $model */ /** @var app\models\LoginForm $model */
use yii\bootstrap5\ActiveForm; use yii\bootstrap5\ActiveForm;
@ -15,35 +16,40 @@ $this->params['breadcrumbs'][] = $this->title;
<p>Please fill out the following fields to login:</p> <p>Please fill out the following fields to login:</p>
<?php $form = ActiveForm::begin([ <div class="row">
'id' => 'login-form', <div class="col-lg-5">
'layout' => 'horizontal',
'fieldConfig' => [
'template' => "{label}\n{input}\n{error}",
'labelOptions' => ['class' => 'col-lg-1 col-form-label mr-lg-3'],
'inputOptions' => ['class' => 'col-lg-3 form-control'],
'errorOptions' => ['class' => 'col-lg-7 invalid-feedback'],
],
]); ?>
<?= $form->field($model, 'username')->textInput(['autofocus' => true]) ?> <?php $form = ActiveForm::begin([
'id' => 'login-form',
'fieldConfig' => [
'template' => "{label}\n{input}\n{error}",
'labelOptions' => ['class' => 'col-lg-1 col-form-label mr-lg-3'],
'inputOptions' => ['class' => 'col-lg-3 form-control'],
'errorOptions' => ['class' => 'col-lg-7 invalid-feedback'],
],
]); ?>
<?= $form->field($model, 'password')->passwordInput() ?> <?= $form->field($model, 'username')->textInput(['autofocus' => true]) ?>
<?= $form->field($model, 'rememberMe')->checkbox([ <?= $form->field($model, 'password')->passwordInput() ?>
'template' => "<div class=\"offset-lg-1 col-lg-3 custom-control custom-checkbox\">{input} {label}</div>\n<div class=\"col-lg-8\">{error}</div>",
]) ?>
<div class="form-group"> <?= $form->field($model, 'rememberMe')->checkbox([
<div class="offset-lg-1 col-lg-11"> 'template' => "<div class=\"custom-control custom-checkbox\">{input} {label}</div>\n<div class=\"col-lg-8\">{error}</div>",
<?= Html::submitButton('Login', ['class' => 'btn btn-primary', 'name' => 'login-button']) ?> ]) ?>
<div class="form-group">
<div>
<?= Html::submitButton('Login', ['class' => 'btn btn-primary', 'name' => 'login-button']) ?>
</div>
</div> </div>
<?php ActiveForm::end(); ?>
<div style="color:#999;">
You may login with <strong>admin/admin</strong> or <strong>demo/demo</strong>.<br>
To modify the username/password, please check out the code <code>app\models\User::$users</code>.
</div>
</div> </div>
<?php ActiveForm::end(); ?>
<div class="offset-lg-1" style="color:#999;">
You may login with <strong>admin/admin</strong> or <strong>demo/demo</strong>.<br>
To modify the username/password, please check out the code <code>app\models\User::$users</code>.
</div> </div>
</div> </div>

View File

@ -82,3 +82,7 @@ a.desc:after {
.nav > li > form > button.logout:focus { .nav > li > form > button.logout:focus {
outline: none; outline: none;
} }
.form-group {
margin-bottom: 1rem;
}