fix: fix login page on edge browser #204

coreui · Apr 15, 2020 · d919129 · d919129
1 parent a281552
commit d919129
Showing 1 changed file with 56 additions and 51 deletions.
diff --git a/src/views/pages/Login.vue b/src/views/pages/Login.vue
@@ -1,57 +1,62 @@
 <template>
-  <CContainer class="d-flex content-center min-vh-100">
-    <CRow>
-      <CCol>
-        <CCardGroup>
-          <CCard class="p-4">
-            <CCardBody>
-              <CForm>
-                <h1>Login</h1>
-                <p class="text-muted">Sign In to your account</p>
-                <CInput
-                  placeholder="Username"
-                  autocomplete="username email"
-                >
-                  <template #prepend-content><CIcon name="cil-user"/></template>
-                </CInput>
-                <CInput
-                  placeholder="Password"
-                  type="password"
-                  autocomplete="curent-password"
-                >
-                  <template #prepend-content><CIcon name="cil-lock-locked"/></template>
-                </CInput>
-                <CRow>
-                  <CCol col="6" class="text-left">
-                    <CButton color="primary" class="px-4">Login</CButton>
-                  </CCol>
-                  <CCol col="6" class="text-right">
-                    <CButton color="link" class="px-0">Forgot password?</CButton>
-                    <CButton color="link" class="d-md-none">Register now!</CButton>
-                  </CCol>
-                </CRow>
-              </CForm>
-            </CCardBody>
-          </CCard>
-          <CCard
-            color="primary"
-            text-color="white"
-            class="text-center py-5 d-sm-down-none"
-            body-wrapper
-          >
-            <h2>Sign up</h2>
-            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
-            <CButton
+  <div class="c-app flex-row align-items-center">
+    <CContainer>
+      <CRow class="justify-content-center">
+        <CCol md="8">
+          <CCardGroup>
+            <CCard class="p-4">
+              <CCardBody>
+                <CForm>
+                  <h1>Login</h1>
+                  <p class="text-muted">Sign In to your account</p>
+                  <CInput
+                    placeholder="Username"
+                    autocomplete="username email"
+                  >
+                    <template #prepend-content><CIcon name="cil-user"/></template>
+                  </CInput>
+                  <CInput
+                    placeholder="Password"
+                    type="password"
+                    autocomplete="curent-password"
+                  >
+                    <template #prepend-content><CIcon name="cil-lock-locked"/></template>
+                  </CInput>
+                  <CRow>
+                    <CCol col="6" class="text-left">
+                      <CButton color="primary" class="px-4">Login</CButton>
+                    </CCol>
+                    <CCol col="6" class="text-right">
+                      <CButton color="link" class="px-0">Forgot password?</CButton>
+                      <CButton color="link" class="d-lg-none">Register now!</CButton>
+                    </CCol>
+                  </CRow>
+                </CForm>
+              </CCardBody>
+            </CCard>
+            <CCard
               color="primary"
-              class="active mt-3"
+              text-color="white"
+              class="text-center py-5 d-md-down-none"
+              body-wrapper
             >
-              Register Now!
-            </CButton>
-          </CCard>
-        </CCardGroup>
-      </CCol>
-    </CRow>
-  </CContainer>
+              <CCardBody>
+                <h2>Sign up</h2>
+                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
+                <CButton
+                  color="light"
+                  variant="outline"
+                  size="lg"
+                >
+                  Register Now!
+                </CButton>
+              </CCardBody>
+            </CCard>
+          </CCardGroup>
+        </CCol>
+      </CRow>
+    </CContainer>
+  </div>
 </template>
 
 <script>