Skip to content

Commit 08619ea

Browse files
sazedul-haquesazedul-haque
committed
Login forms design fixed for both legacy and new
1 parent f1b670a commit 08619ea

6 files changed

Lines changed: 51 additions & 29 deletions

File tree

‎assets/src/scss/front/__archive.scss‎

Lines changed: 22 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -215,8 +215,9 @@ Instructor
215215
max-width: 520px;
216216
margin: 0 auto;
217217
padding: 40px 0 32px 0;
218-
box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
219-
border-radius: 5px;
218+
border: 1px solid #ececed;
219+
box-shadow: 0px 2px 4px -2px rgba(16, 24, 40, 0.0588235294), 0px 4px 8px -2px rgba(16, 24, 40, 0.1019607843);
220+
border-radius: 8px;
220221
}
221222

222223
.tutor-login-form-wrapper, #tutor-registration-form {
@@ -235,6 +236,25 @@ Instructor
235236
margin: 0;
236237
}
237238

239+
.tutor-login-wrap,
240+
#tutor-login-form {
241+
input.tutor-form-control {
242+
background-color: #ffffff;
243+
border-color: #ececed !important;
244+
font-size: 14px;
245+
line-height: 22px;
246+
247+
&:placeholder-shown:not(:focus) {
248+
background-color: #f5f5f6;
249+
}
250+
251+
&:focus {
252+
box-shadow: 0px 0px 0px 2px #90A0F7;
253+
border-color: #a4bcf4 !important;
254+
}
255+
}
256+
}
257+
238258
.tutor-login-wrap .tutor-login-title {
239259
margin-bottom: 25px;
240260
padding: 0 40px;

‎templates/login-form-legacy.php‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -85,7 +85,7 @@
8585
<button type="submit" class="tutor-btn tutor-btn-primary tutor-btn-block">
8686
<?php esc_html_e( 'Sign In', 'tutor' ); ?>
8787
</button>
88-
88+
8989
<?php if ( get_option( 'users_can_register', false ) ) : ?>
9090
<?php
9191
$url_arg = array(
@@ -95,7 +95,7 @@
9595
$url_arg['enrol_course_id'] = get_the_ID();
9696
}
9797
?>
98-
<div class="tutor-text-center tutor-fs-6 tutor-color-secondary tutor-mt-20">
98+
<div class="tutor-d-flex tutor-align-center tutor-justify-center tutor-fs-6 tutor-color-secondary tutor-mt-20">
9999
<?php esc_html_e( 'Don\'t have an account?', 'tutor' ); ?>&nbsp;
100100
<a href="<?php echo esc_url( add_query_arg( $url_arg, tutor_utils()->student_register_url() ) ); ?>" class="tutor-btn tutor-btn-link">
101101
<?php esc_html_e( 'Register Now', 'tutor' ); ?>

‎templates/login-form.php‎

Lines changed: 15 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,9 @@
1010

1111
use TUTOR\Ajax;
1212
use Tutor\Components\Alert;
13+
use Tutor\Components\Constants\InputType;
14+
use Tutor\Components\Constants\Size;
15+
use Tutor\Components\InputField;
1316
use Tutor\Components\SvgIcon;
1417
use TUTOR\Icon;
1518

@@ -40,7 +43,7 @@
4043
<input type="hidden" name="tutor_action" value="tutor_user_login" />
4144
<input type="hidden" name="redirect_to" value="<?php echo esc_url( apply_filters( 'tutor_after_login_redirect_url', tutor()->current_url ) ); ?>" />
4245

43-
<div class="tutor-input-field tutor-mb-8">
46+
<div class="tutor-input-field tutor-mb-7">
4447
<input type="text" class="tutor-form-control tutor-input" placeholder="<?php esc_html_e( 'Username or Email Address', 'tutor' ); ?>" name="log" value="" size="20" required/>
4548
</div>
4649

@@ -67,20 +70,22 @@ class="tutor-flex tutor-items-center tutor-justify-center"
6770
do_action( 'login_form' );
6871
apply_filters( 'login_form_middle', '', '' );
6972
?>
70-
<div class="tutor-flex tutor-justify-between tutor-align-center tutor-mt-10">
71-
<div class="tutor-input-field tutor-flex tutor-flex-wrap tutor-justify-between tutor-items-center tutor-gap-3" style="width: auto;">
72-
<input id="tutor-login-agmnt-1" type="checkbox" class="tutor-form-check-input tutor-switch tutor-bg-black-40" name="rememberme" value="forever" />
73-
<label for="tutor-login-agmnt-1" class="tutor-medium tutor-color-muted">
74-
<?php esc_html_e( 'Keep me signed in', 'tutor' ); ?>
75-
</label>
73+
<div class="tutor-flex tutor-justify-between tutor-items-center tutor-mt-9">
74+
<div class="tutor-input-field tutor-w-auto">
75+
<div class="tutor-input-wrapper">
76+
<input id="tutor-login-agmnt-1" type="checkbox" class="tutor-checkbox tutor-checkbox-md" name="rememberme" value="forever" />
77+
<label for="tutor-login-agmnt-1" class="tutor-label">
78+
<?php esc_html_e( 'Keep me signed in', 'tutor' ); ?>
79+
</label>
80+
</div>
7681
</div>
77-
<a href="<?php echo esc_url( $lost_pass ); ?>" class="tutor-btn tutor-small">
82+
<a href="<?php echo esc_url( $lost_pass ); ?>" class="tutor-btn tutor-btn-link-gray tutor-btn-small">
7883
<?php esc_html_e( 'Forgot Password?', 'tutor' ); ?>
7984
</a>
8085
</div>
8186

8287
<?php do_action( 'tutor_login_form_end' ); ?>
83-
<button type="submit" class="tutor-btn tutor-btn-primary tutor-btn-block tutor-mt-8">
88+
<button type="submit" class="tutor-btn tutor-btn-primary tutor-btn-block tutor-mt-10">
8489
<?php esc_html_e( 'Sign In', 'tutor' ); ?>
8590
</button>
8691

@@ -93,7 +98,7 @@ class="tutor-flex tutor-items-center tutor-justify-center"
9398
$url_arg['enrol_course_id'] = get_the_ID();
9499
}
95100
?>
96-
<div class="tutor-flex tutor-items-center tutor-justify-center tutor-gap-2 tutor-mt-8">
101+
<div class="tutor-flex tutor-items-center tutor-justify-center tutor-gap-2 tutor-mt-7">
97102
<div class="tutor-small">
98103
<?php esc_html_e( 'Don\'t have an account?', 'tutor' ); ?>
99104
</div>

‎templates/login.php‎

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,16 +24,23 @@
2424
$login_url = tutor_utils()->get_option( 'enable_tutor_native_login', null, true, true ) ? '' : wp_login_url( tutor()->current_url );
2525

2626
$should_load_legacy_scripts = Assets::should_load_legacy_scripts();
27+
28+
$wrapper_classes = 'tutor-template-segment tutor-login-wrap tutor-card tutor-shadow-md tutor-px-none tutor-pt-10 tutor-pb-9';
29+
$title_classes = 'tutor-h3 tutor-font-medium tutor-mb-9';
30+
if ( $should_load_legacy_scripts ) {
31+
$title_classes = 'tutor-fs-4 tutor-fw-medium tutor-color-black tutor-mb-32';
32+
$wrapper_classes = 'tutor-template-segment tutor-login-wrap';
33+
}
2734
?>
2835

2936
<?php
3037
//phpcs:ignore WordPress.NamingConventions.ValidHookName.UseUnderscores
3138
do_action( 'tutor/template/login/before/wrap' );
3239
?>
3340
<div <?php tutor_post_class( 'tutor-page-wrap tutor-w-full' ); ?>>
34-
<div class="tutor-template-segment tutor-login-wrap tutor-card tutor-shadow-md tutor-px-none tutor-py-9" style="max-width: 100%; width : 520px; margin: 40px auto;">
41+
<div class="<?php echo esc_attr( $wrapper_classes ); ?>" style="max-width: 100%; width : 520px; margin: 70px auto;">
3542
<div class="tutor-login-form-wrapper tutor-p-8">
36-
<div class="tutor-small tutor-mb-5">
43+
<div class="<?php echo esc_attr( $title_classes ); ?>">
3744
<?php esc_html_e( 'Hi, Welcome back!', 'tutor' ); ?>
3845
</div>
3946
<?php

‎v2-library/src/scss/components/_modal.scss‎

Lines changed: 0 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -352,18 +352,6 @@
352352
}
353353
} // end of /.tutor-modal-ins-approval
354354

355-
@include breakpoint-max(mobile) {
356-
.tutor-btn:not(.tutor-is-icon-btn) {
357-
padding: 6px 20px !important;
358-
width: max-content;
359-
max-width: max-content;
360-
height: auto !important;
361-
font-size: 14px;
362-
font-weight: 400;
363-
line-height: 2;
364-
}
365-
}
366-
367355
// .tutor-modal.tutor-login-modal {}
368356
&.tutor-login-modal {
369357
.tutor-modal-root {

‎views/modal/login.php‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,9 @@
2121
<div class="tutor-modal-body">
2222
<div class="tutor-py-48">
2323
<?php do_action( 'tutor_before_login_form' ); ?>
24-
<div id="tutor-login-modal-title" class="tutor-fs-4 tutor-fw-medium tutor-color-black tutor-mb-32"><?php esc_html_e( 'Hi, Welcome back!', 'tutor' ); ?></div>
24+
<div id="tutor-login-modal-title" class="tutor-fs-4 tutor-fw-medium tutor-color-black tutor-mb-32">
25+
<?php esc_html_e( 'Hi, Welcome back!', 'tutor' ); ?>
26+
</div>
2527
<?php
2628
// load form template.
2729
$login_form = trailingslashit( tutor()->path ) . 'templates/login-form-legacy.php';

0 commit comments

Comments
 (0)