/* ------------------------------------------------------------------------------ * * # Login and related forms * * Styles related to user login - logins, registration, password revovery, unlock etc. * * Version: 1.1 * Latest update: Nov 25, 2015 * * ---------------------------------------------------------------------------- */ // Cover image .login-cover { background: url('../images/login_cover.jpg') no-repeat; background-size: cover; } // Login container .login-container { display: table; width: 100%; height: 100%; // default height // Does your page has navbar? @use_navbar: true; // Re-calculate height if page has default navbar .navbar + & when (@use_navbar = true) { height: calc(~"100% - "@navbar-height + 2); } // Re-calculate height if page has large navbar .navbar-lg + & when (@use_navbar = true) { height: calc(~"100% - "@navbar-height-large + 2); } // Re-calculate height if page has small navbar .navbar-sm + & when (@use_navbar = true) { height: calc(~"100% - "@navbar-height-small + 2); } // Re-calculate height if page has mini navbar .navbar-xs + & when (@use_navbar = true) { height: calc(~"100% - "@navbar-height-mini + 2); } // Make content full height .page-content { display: table-row; height: 100%; } // Add fixed width .login-form { width: 320px; } // Add vertical margin .login-form, .registration-form { margin: 0 auto @line-height-computed auto; @media (max-width: @screen-xs) { width: 100%; } } // Centered footer .footer { left: 0; right: 0; text-align: center; } // Align forms vertically .content-wrapper { vertical-align: middle; display: table-cell; // dublicate to keep content always vertically centereed } // Tabs .nav-tabs.nav-justified { margin-bottom: 0; // Nav items > li { // Links > a { border-top: 0!important; padding-left: @content-padding-base; padding-right: @content-padding-base; background-color: #f5f5f5; } // Remove left border in first item &:first-child > a { border-left: 0; border-radius: @border-radius-base 0 0 0; } // Remove right border in last item &:last-child > a { border-right: 0; border-radius: 0 @border-radius-base 0 0; } &.active > a { background-color: transparent; } } // Mobile view @media (max-width: @screen-xs-max) { padding: 0; border-width: 0 0 1px 0; border-radius: 0; // Remove defalt text label &:before { content: none; } // Remove left borders > li > a { border-width: 0!important; } } } } // Responsive login options @media (max-width: @screen-xs-max) { .login-options { &, .text-right { text-align: center; } } }