Przeglądaj źródła

登陆页面重构

jqh 5 lat temu
rodzic
commit
7f5af80c54

+ 3 - 0
resources/assets/adminlte/scss/_main-sidebar.scss

@@ -255,6 +255,9 @@
         margin-right: .8rem;
         font-size: 1.2rem;
       }
+      p i {
+        margin-right: 0;
+      }
     }
 
     // Hover and active states

+ 21 - 0
resources/assets/dcat/sass/components/_form.scss

@@ -208,4 +208,25 @@ select.form-control:not([multiple=multiple]) {
 }
 .bootstrap-duallistbox-container .info {
   color: $font-color!important;
+}
+
+//
+.has-icon-left .form-control-position {
+  right: auto;
+  left: inherit;
+}
+.form-control-position {
+  position: absolute;
+  top: 2px;
+  right: 0;
+  z-index: 2;
+  display: block;
+  width: 2.5rem;
+  height: 2.5rem;
+  line-height: 2.5rem;
+  text-align: center;
+}
+.has-icon-left .form-control {
+  padding-right: 2rem;
+  padding-left: 3rem;
 }

+ 6 - 5
resources/assets/dcat/sass/dcat-app.scss

@@ -52,6 +52,7 @@ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
 .full-page {
   .content .content-wrapper {
     padding: 0;
+    margin-left: 0!important;
   }
 }
 
@@ -118,19 +119,19 @@ ol, ul, dl {
 
 // Font weights
 
-.bold-300 {
+.font-w-300 {
   font-weight: 300;
 }
-.bold-400 {
+.font-w-400 {
   font-weight: 400;
 }
-.bold-500 {
+.font-w-500 {
   font-weight: 500;
 }
-.bold-600 {
+.font-w-600 {
   font-weight: 600;
 }
-.bold-700 {
+.font-w-700 {
   font-weight: 700;
 }
 

BIN
resources/assets/images/pages/card-image-4.jpg


BIN
resources/assets/images/pages/card-image-5.jpg


BIN
resources/assets/images/pages/card-image-6.jpg


BIN
resources/assets/images/pages/card-img-overlay.jpg


BIN
resources/assets/images/pages/forgot-password.png


BIN
resources/assets/images/pages/graphic-1.png


BIN
resources/assets/images/pages/graphic-2.png


BIN
resources/assets/images/pages/graphic-3.png


BIN
resources/assets/images/pages/graphic-4.png


BIN
resources/assets/images/pages/graphic-5.png


BIN
resources/assets/images/pages/graphic-6.png


BIN
resources/assets/images/pages/lock-screen.png


BIN
resources/assets/images/pages/login.png


BIN
resources/assets/images/pages/maintenance-2.png


BIN
resources/assets/images/pages/not-authorized.png


BIN
resources/assets/images/pages/reset-password.png


+ 10 - 4
resources/views/layouts/full-page.blade.php

@@ -25,8 +25,7 @@
     @yield('head')
 </head>
 
-<body
-      class="dcat-admin-body full-page {{ $configData['body_class'] }}">
+<body class="dcat-admin-body full-page {{ $configData['body_class'] }}">
 
 <script>
     var Dcat = CreateDcat({!! Dcat\Admin\Admin::jsVariables() !!});
@@ -36,7 +35,7 @@
 {!! admin_section(\AdminSection::BODY_INNER_BEFORE) !!}
 
 <div class="app-content content">
-    <div class="content-wrapper" id="{{ $pjaxContainerId }}">
+    <div class="wrapper" id="{{ $pjaxContainerId }}">
         @yield('app')
     </div>
 </div>
@@ -45,7 +44,14 @@
 
 {!! Dcat\Admin\Admin::asset()->jsToHtml() !!}
 
-<script>Dcat.boot();</script>
+<script>
+    if ($('.full-page .wrapper').length) {
+        // 滚动条优化
+        new PerfectScrollbar('.full-page .wrapper');
+    }
+
+    Dcat.boot();
+</script>
 
 </body>
 </html>

+ 81 - 94
resources/views/pages/login.blade.php

@@ -1,114 +1,101 @@
 <style>
-    html body {background: #fff;}
+    .login-page {background: #f7f7f9;}
+
+    .login-box {
+        margin-top: -5rem;
+    }
 </style>
 
-<link rel="stylesheet" href="{{ admin_asset('@admin/css/pages/authentication.css') }}">
-
-<section class="row flexbox-container">
-    <div class="col-xl-8 col-11 d-flex justify-content-center" style="top: -35px;">
-        <div class="card bg-authentication rounded-0 mb-0">
-            <div class="row m-0 shadow-100">
-                <div class="col-lg-6 d-lg-block d-none text-center align-self-center px-1 py-0" style="min-width: 240px">
-                    <img src="{{ admin_asset('@admin/images/pages/login.png') }}" alt="branding logo">
-                </div>
-                <div class="col-lg-6 col-12 p-0">
-                    <div class="card rounded-0 mb-0 px-2" style="min-width: 400px">
-                        <div class="card-header pb-1 justify-content-center">
-                            <div class="card-title">
-                                <h4 class="m-auto">{{ config('admin.name') }}</h4>
-                            </div>
+<div class="login-page">
+    <div class="login-box">
+        <div class="login-logo mb-2">
+            {{ config('admin.name') }}
+        </div>
+        <div class="card">
+            <div class="card-body login-card-body p-2 shadow-100">
+                <p class="login-box-msg mt-1 mb-1">{{ __('admin.welcome_back') }}</p>
+
+                <form id="login-form" method="POST" action="{{ admin_url('auth/login') }}">
+
+                    @csrf
+
+                    <fieldset class="form-label-group form-group position-relative has-icon-left">
+                        <input
+                                type="text"
+                                class="form-control {{ $errors->has('username') ? 'is-invalid' : '' }}"
+                                name="username"
+                                placeholder="{{ trans('admin.username') }}"
+                                value="{{ old('username') }}"
+                                required
+                                autofocus
+                        >
+
+                        <div class="form-control-position">
+                            <i class="feather icon-user"></i>
                         </div>
-                        <p class="px-2 text-center">{{ __('admin.welcome_back') }}</p>
-                        <div class="card-content">
-                            <div class="card-body pt-1">
-                                <form id="login-form" method="POST" action="{{ admin_url('auth/login') }}">
-
-                                    @csrf
-
-                                    <fieldset class="form-label-group form-group position-relative has-icon-left">
-                                        <input
-                                                type="text"
-                                                class="form-control {{ $errors->has('username') ? 'is-invalid' : '' }}"
-                                                name="username"
-                                                placeholder="{{ trans('admin.username') }}"
-                                                value="{{ old('username') }}"
-                                                required
-                                                autofocus
-                                        >
-
-                                        <div class="form-control-position">
-                                            <i class="feather icon-user"></i>
-                                        </div>
-
-                                        <label for="email">{{ trans('admin.username') }}</label>
-
-                                        <div class="help-block with-errors"></div>
-                                        @if($errors->has('username'))
-                                        <span class="invalid-feedback text-danger" role="alert">
+
+                        <label for="email">{{ trans('admin.username') }}</label>
+
+                        <div class="help-block with-errors"></div>
+                        @if($errors->has('username'))
+                            <span class="invalid-feedback text-danger" role="alert">
                                             @foreach($errors->get('username') as $message)
-                                                <span class="control-label" for="inputError"><i class="feather icon-x-circle"></i> {{$message}}</span><br>
-                                            @endforeach
+                                    <span class="control-label" for="inputError"><i class="feather icon-x-circle"></i> {{$message}}</span><br>
+                                @endforeach
                                         </span>
-                                        @endif
-                                    </fieldset>
-
-                                    <fieldset class="form-label-group form-group position-relative has-icon-left">
-                                        <input
-                                                minlength="5"
-                                                maxlength="20"
-                                                id="password"
-                                                type="password"
-                                                class="form-control {{ $errors->has('password') ? 'is-invalid' : '' }}"
-                                                name="password"
-                                                placeholder="{{ trans('admin.password') }}"
-                                                required
-                                                autocomplete="current-password"
-                                        >
-
-                                        <div class="form-control-position">
-                                            <i class="feather icon-lock"></i>
-                                        </div>
-                                        <label for="password">{{ trans('admin.password') }}</label>
-
-                                        <div class="help-block with-errors"></div>
-                                        @if($errors->has('password'))
-                                            <span class="invalid-feedback text-danger" role="alert">
+                        @endif
+                    </fieldset>
+
+                    <fieldset class="form-label-group form-group position-relative has-icon-left">
+                        <input
+                                minlength="5"
+                                maxlength="20"
+                                id="password"
+                                type="password"
+                                class="form-control {{ $errors->has('password') ? 'is-invalid' : '' }}"
+                                name="password"
+                                placeholder="{{ trans('admin.password') }}"
+                                required
+                                autocomplete="current-password"
+                        >
+
+                        <div class="form-control-position">
+                            <i class="feather icon-lock"></i>
+                        </div>
+                        <label for="password">{{ trans('admin.password') }}</label>
+
+                        <div class="help-block with-errors"></div>
+                        @if($errors->has('password'))
+                            <span class="invalid-feedback text-danger" role="alert">
                                             @foreach($errors->get('password') as $message)
-                                                    <span class="control-label" for="inputError"><i class="feather icon-x-circle"></i> {{$message}}</span><br>
-                                            @endforeach
+                                    <span class="control-label" for="inputError"><i class="feather icon-x-circle"></i> {{$message}}</span><br>
+                                @endforeach
                                             </span>
-                                        @endif
-
-                                    </fieldset>
-                                    <div class="form-group d-flex justify-content-between align-items-center">
-                                        <div class="text-left">
-                                            <fieldset class="checkbox">
-                                                <div class="vs-checkbox-con vs-checkbox-primary">
-                                                    <input id="remember" name="remember"  value="1" type="checkbox" {{ old('remember') ? 'checked' : '' }}>
-                                                    <span class="vs-checkbox">
+                        @endif
+
+                    </fieldset>
+                    <div class="form-group d-flex justify-content-between align-items-center">
+                        <div class="text-left">
+                            <fieldset class="checkbox">
+                                <div class="vs-checkbox-con vs-checkbox-primary">
+                                    <input id="remember" name="remember"  value="1" type="checkbox" {{ old('remember') ? 'checked' : '' }}>
+                                    <span class="vs-checkbox">
                                                         <span class="vs-checkbox--check">
                                                           <i class="vs-icon feather icon-check"></i>
                                                         </span>
                                                     </span>
-                                                    <span> {{ trans('admin.remember_me') }}</span>
-                                                </div>
-                                            </fieldset>
-                                        </div>
-                                    </div>
-                                    <button type="submit" class="btn btn-primary float-right btn-inline">{{ __('admin.login') }}</button>
-                                </form>
-                            </div>
-                        </div>
-                        <div class="login-footer">
-                            <div class="divider"></div>
-                            <div class="footer-btn d-inline"></div>
+                                    <span> {{ trans('admin.remember_me') }}</span>
+                                </div>
+                            </fieldset>
                         </div>
                     </div>
-                </div>
+                    <button type="submit" class="btn btn-primary float-right btn-inline">{{ __('admin.login') }}</button>
+                </form>
+
             </div>
         </div>
     </div>
-</section>
+</div>
 
 <script>
 Dcat.ready(function () {