[Summary view] [Print] [Text view]

   1  // Bootstrap functions
   2  @import "../../../../vendor/bootstrap/scss/functions";
   3  
   4  // Variables, Functions and Mixins
   5  @import "tools/tools";
   6  
   7  .outer {
   8    position: relative;
   9    display: flex;
  10    flex-direction: column;
  11    align-items: center;
  12    justify-content: center;
  13    width: 100%;
  14    min-height: 100vh;
  15    padding: 20px;
  16    overflow: hidden;
  17  }
  18  
  19  .offline-card {
  20    width: 100%;
  21    max-width: 30em;
  22    margin: 60px auto;
  23    background-color: $white;
  24    border: 1px solid hsla(0, 0%, 0%, .1);
  25    border-radius: 5px;
  26    box-shadow: 0 0 10px hsla(0, 0%, 0%, .05);
  27  }
  28  
  29  .header {
  30    position: relative;
  31    padding: $cassiopeia-grid-gutter ($cassiopeia-grid-gutter*2);
  32    margin: 0;
  33    color: $white;
  34    text-align: center;
  35    background-color: var(--cassiopeia-color-primary);
  36    background-image: $cassiopeia-header-grad;
  37    border-radius: 5px 5px 0 0;
  38  
  39    [dir=rtl] & {
  40      background-image: $cassiopeia-header-grad-rtl;
  41    }
  42  }
  43  
  44  .login {
  45    padding: 40px 20px 20px;
  46  }
  47  
  48  .form-control {
  49    max-width: none;
  50  }
  51  
  52  img {
  53    max-width: 100%;
  54    height: auto;
  55    margin: 15px 0;
  56    border: 0;
  57  }
  58  
  59  form,
  60  fieldset {
  61    padding: 0;
  62    margin: 0;
  63  }
  64  
  65  label {
  66    display: block;
  67    margin: 0;
  68  }
  69  
  70  input[type="text"],
  71  input[type="password"] {
  72    box-sizing: border-box;
  73    width: 100%;
  74    height: auto;
  75  }
  76  
  77  input {
  78    margin: .5em 0 1em;
  79  }
  80  
  81  .logo-icon {
  82    position: absolute;
  83    top: 100%;
  84    left: 50%;
  85    z-index: 1;
  86    padding: 12px;
  87    margin-top: 2px;
  88    background-color: $white;
  89    border: 1px solid hsla(0, 0%, 0%, .05);
  90    border-radius: 50%;
  91    box-shadow: 0 0 5px hsla(0, 0%, 0%, .075);
  92    transform: translate(-50%, -50%);
  93  }
  94  
  95  .logo-icon svg {
  96    display: block;
  97    width: 38px;
  98  }