diff options
Diffstat (limited to 'public/css/icinga/login.less')
-rw-r--r-- | public/css/icinga/login.less | 183 |
1 files changed, 183 insertions, 0 deletions
diff --git a/public/css/icinga/login.less b/public/css/icinga/login.less new file mode 100644 index 0000000..b37dbd8 --- /dev/null +++ b/public/css/icinga/login.less @@ -0,0 +1,183 @@ +/*! Icinga Web 2 | (c) 2013 Icinga Development Team | GPLv2+ */ + +// Login page styles + +#login { + height: 100%; + background-color: @menu-bg-color; + background-image: url(../img/icingaweb2-background-orbs.jpg); + background-repeat: no-repeat; + background-size: cover; + text-align: center; + display: flex; + justify-content: center; + align-items: center; + + .login-form { + width: 36em; + position: relative; + z-index: 10; + padding: 2em 6em; + background-color: @login-box-background; + .box-shadow(0, 0, 1em, 1em, @login-box-background); + } + + #icinga-logo { + width: 100%; + max-width: 18em; + height: auto; + margin: 0 auto 2em auto; + + &:after { + content: ""; + display: block; + width: 100%; + padding-bottom: 35%; + } + } + + .errors, + .form-errors { + list-style-type: none; + padding: 0.5em; + } + + .errors { + background-color: @color-critical; + color: white; + } + + .form-errors { + margin-top: 0; + padding: 0; + } + + .form-errors, + .control-group { + &:not(:last-child) { + margin-bottom: 1em; + } + } + + input[type=password], + input[type=text] { + display: block; + height: 2.5em; + margin: 0; + transition: none; + width: 100%; + + &:focus { + .rounded-corners(3px); + border-radius: 0; + padding-bottom: 3px; + } + } + + input[type="submit"]:focus { + outline: 3px solid; + outline-color: @icinga-blue-light; + } + + input[type=submit] { + border-radius: .25em; + background: @icinga-secondary; + color: white; + border: none; + height: 2.5em; + margin: 0; + width: 100%; + + &:hover { + background-color: @icinga-secondary-dark; + } + } + + .config-note { + background-color: @color-critical; + margin: 0 auto 2em auto; // Center horizontally w/ bottom margin + max-width: 50%; + min-width: 24em; + padding: 1em; + + a { + color: @text-color-inverted; + font-weight: bold; + } + } + + .remember-me-box { + display: flex; + align-items: flex-start; + + .toggle-switch { + margin-right: 1em; + } + + .control-info { + line-height: 1.5; + margin-left: .5em; + } + } +} + +#social { + position: fixed; + right: 1em; bottom: 1em; + letter-spacing: -.417em; + margin: 0; + + > * { + letter-spacing: normal; + } + + > li { + display: inline-block; + + a { + display: block; + text-decoration: none; + -webkit-transform: scale(1, 1); + -moz-transform: scale(1, 1); + -ms-transform: scale(1, 1); + transform: scale(1, 1); + } + + i { + font-size: 3em; + color: white; + text-shadow: 0 0 .5em #01507B; + } + } + + > li a:hover { + -webkit-transform: scale(1.2, 1.2); + -moz-transform: scale(1.2, 1.2); + -ms-transform: scale(1.2, 1.2); + transform: scale(1.2, 1.2); + } + + li:not(:last-child) { + margin-right: 2em; + } +} + +#login-footer { + padding: .5em 0; + + p { + margin-bottom: 0; + } + + a { + text-decoration: underline; + + &:hover { + opacity: .8; + } + } +} + +.orb { + display: none; +} |