opacity: .4;
}
+/* LOG IN & INSTALLATION ------------------------------------------------------------ */
+
+/* Some whitespace to the top */
+
+#body-login {
+ #header {
+ padding-top: 100px;
+ }
+ background-attachment: fixed;
+ /* fix background gradient */
+ height: 100%;
+ /* fix sticky footer */
+ p.info, form fieldset legend, #datadirContent label {
+ text-align: center;
+ color: #fff;
+ }
+ form {
+ fieldset .warning-info, input[type='checkbox'] + label {
+ text-align: center;
+ color: #fff;
+ }
+ .warning input[type='checkbox'] {
+ &:hover + label, &:focus + label, + label {
+ color: #fff !important;
+ }
+ }
+ }
+ .update {
+ h2 {
+ margin: 0 0 20px;
+ }
+ a {
+ color: #fff;
+ border-bottom: 1px solid #aaa;
+ }
+ }
+ .infogroup {
+ margin-bottom: 15px;
+ }
+ p#message img {
+ vertical-align: middle;
+ padding: 5px;
+ }
+ div.buttons {
+ text-align: center;
+ }
+ p.info {
+ margin: 0 auto;
+ padding-top: 20px;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ a {
+ font-weight: 600;
+ padding: 13px;
+ margin: -13px;
+ }
+ }
+ form {
+ position: relative;
+ width: 280px;
+ margin: 16px auto;
+ padding: 0;
+ fieldset {
+ margin-bottom: 20px;
+ text-align: left;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ }
+ #sqliteInformation {
+ margin-top: -20px;
+ margin-bottom: 20px;
+ }
+ #adminaccount {
+ margin-bottom: 15px;
+ }
+ fieldset legend {
+ width: 100%;
+ }
+ }
+}
+
+/* Dark subtle label text */
+
+/* overrides another !important statement that sets this to unreadable black */
+
+#datadirContent label {
+ width: 100%;
+}
+
+#body-login {
+ #datadirContent label {
+ display: block;
+ margin: 0;
+ }
+ form #datadirField legend {
+ margin-bottom: 15px;
+ }
+ #showAdvanced {
+ padding: 13px;
+ /* increase clickable area of Advanced dropdown */
+ img {
+ vertical-align: bottom;
+ /* adjust position of Advanced dropdown arrow */
+ margin-left: -4px;
+ }
+ }
+ .icon-info-white {
+ padding: 10px;
+ }
+ .strengthify-wrapper {
+ display: inline-block;
+ position: relative;
+ left: 15px;
+ top: -23px;
+ width: 250px;
+ }
+ .tipsy-inner {
+ font-weight: bold;
+ color: #ccc;
+ }
+ input {
+ &[type='text'], &[type='password'], &[type='email'] {
+ border: none;
+ font-weight: 300;
+ }
+ }
+}
+
+/* strengthify wrapper */
+
+/* tipsy for the strengthify wrapper looks better with following font settings */
+
+/* General new input field look */
+
+/* Nicely grouping input field sets */
+
+.grouptop, .groupmiddle, .groupbottom {
+ position: relative;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+}
+
+#body-login .grouptop input, .grouptop input {
+ margin-bottom: 0 !important;
+ border-bottom: 0 !important;
+ border-bottom-left-radius: 0 !important;
+ border-bottom-right-radius: 0 !important;
+}
+
+#body-login .groupmiddle input, .groupmiddle input {
+ margin-top: 0 !important;
+ margin-bottom: 0 !important;
+ border-top: 0 !important;
+ border-bottom: 0 !important;
+ border-radius: 0 !important;
+ box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1) inset !important;
+}
+
+#body-login .groupbottom input, .groupbottom input {
+ margin-top: 0 !important;
+ border-top: 0 !important;
+ border-top-right-radius: 0 !important;
+ border-top-left-radius: 0 !important;
+ box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1) inset !important;
+}
+
+#body-login .groupbottom input[type=submit] {
+ box-shadow: none !important;
+}
+
+/* keep the labels for screen readers but hide them since we use placeholders */
+
+label.infield {
+ display: none;
+}
+
+#body-login {
+ form {
+ input[type='checkbox'] + label {
+ position: relative;
+ margin: 0;
+ padding: 14px;
+ vertical-align: middle;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ }
+ .errors {
+ background: #fed7d7;
+ border: 1px solid #f00;
+ list-style-indent: inside;
+ margin: 0 0 2em;
+ padding: 1em;
+ }
+ }
+ .success {
+ background: #d7fed7;
+ border: 1px solid #0f0;
+ width: 35%;
+ margin: 30px auto;
+ padding: 1em;
+ text-align: center;
+ }
+ #showAdvanced > img {
+ padding: 4px;
+ box-sizing: border-box;
+ }
+ p.info a, #showAdvanced {
+ color: #fff;
+ }
+ #remember_login {
+ &:hover + label, &:focus + label {
+ opacity: .6;
+ }
+ }
+ #forgot-password {
+ &:hover, &:focus {
+ opacity: .6;
+ }
+ }
+ p.info a {
+ &:hover, &:focus {
+ opacity: .6;
+ }
+ }
+}
+
+/* Show password toggle */
+
+#show, #dbpassword {
+ position: absolute;
+ right: 1em;
+ top: .8em;
+ float: right;
+}
+
+#show, #dbpassword, #personal-show {
+ display: none;
+}
+
+#show + label, #dbpassword + label {
+ right: 21px;
+ top: 15px !important;
+ margin: -14px !important;
+ padding: 14px !important;
+}
+
+#show:checked + label, #dbpassword:checked + label, #personal-show:checked + label {
+ -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=80)';
+ opacity: .8;
+}
+
+#show + label, #dbpassword + label, #personal-show + label {
+ position: absolute !important;
+ height: 20px;
+ width: 24px;
+ background-image: url('../img/actions/toggle.svg?v=1');
+ background-repeat: no-repeat;
+ background-position: center;
+ -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=30)';
+ opacity: .3;
+}
+
+#show + label:before, #dbpassword + label:before, #personal-show + label:before {
+ display: none;
+}
+
+#pass2, input[name='personal-password-clone'] {
+ padding: .6em 2.5em .4em .4em;
+ width: 8em;
+}
+
+#personal-show + label {
+ height: 14px;
+ margin-top: -25px;
+ left: 295px;
+ display: block;
+}
+
+#passwordbutton {
+ margin-left: .5em;
+}
+
+/* Database selector */
+
+#body-login {
+ form #selectDbType {
+ text-align: center;
+ white-space: nowrap;
+ margin: 0;
+ .info {
+ white-space: normal;
+ }
+ label {
+ position: static;
+ margin: 0 -3px 5px;
+ font-size: 12px;
+ background: #f8f8f8;
+ color: #888;
+ cursor: pointer;
+ border: 1px solid #ddd;
+ span {
+ cursor: pointer;
+ padding: 10px 20px;
+ }
+ &.ui-state-hover, &.ui-state-active {
+ color: #000;
+ background-color: #e8e8e8;
+ }
+ }
+ }
+ .warning, .update, .error {
+ display: block;
+ padding: 10px;
+ background-color: rgba(0, 0, 0, 0.3);
+ color: #fff;
+ text-align: left;
+ border-radius: 3px;
+ cursor: default;
+ }
+ .update {
+ width: inherit;
+ text-align: center;
+ .appList {
+ list-style: disc;
+ text-align: left;
+ margin-left: 25px;
+ margin-right: 25px;
+ }
+ }
+ .v-align {
+ width: inherit;
+ }
+ .update img.float-spinner {
+ float: left;
+ }
+}
+
+/* Warnings and errors are the same */
+
+#body-user .warning, #body-settings .warning {
+ margin-top: 8px;
+ padding: 5px;
+ background: #fdd;
+ border-radius: 3px;
+}
+
+.warning {
+ legend, a {
+ color: #fff !important;
+ font-weight: 600 !important;
+ }
+}
+
+.error {
+ a {
+ color: #fff !important;
+ font-weight: 600 !important;
+ &.button {
+ color: #555 !important;
+ display: inline-block;
+ text-align: center;
+ }
+ }
+ pre {
+ white-space: pre-wrap;
+ text-align: left;
+ }
+}
+
+.error-wide {
+ width: 700px;
+ margin-left: -200px !important;
+ .button {
+ color: black !important;
+ }
+}
+
+.warning-input {
+ border-color: #ce3702 !important;
+}
+
+/* Fixes for log in page, TODO should be removed some time */
+
+#body-login {
+ ul.error-wide {
+ margin-top: 35px;
+ }
+ .warning {
+ margin: 0 7px 5px 4px;
+ legend {
+ -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=100)';
+ opacity: 1;
+ }
+ }
+ a.warning {
+ cursor: pointer;
+ }
+ .updateProgress .error {
+ margin-top: 10px;
+ margin-bottom: 10px;
+ }
+}
+
+/* fixes for update page TODO should be fixed some time in a proper way */
+/* this is just for an error while updating the ownCloud instance */
+
+/* Alternative Logins */
+
+#alternative-logins {
+ legend {
+ margin-bottom: 10px;
+ }
+ li {
+ height: 40px;
+ display: inline-block;
+ white-space: nowrap;
+ }
+}
+
+/* Log in and install button */
+
+#body-login input {
+ font-size: 20px;
+ margin: 5px;
+ padding: 11px 10px 9px;
+ &[type='text'], &[type='password'] {
+ width: 249px;
+ }
+ &.login {
+ width: 269px;
+ background-position: right 16px center;
+ }
+ &[type='submit'] {
+ padding: 10px 20px;
+ /* larger log in and installation buttons */
+ }
+}
+
+#remember_login {
+ margin: 18px 5px 0 16px !important;
+}
+
+#body-login {
+ .remember-login-container {
+ display: inline-block;
+ margin: 10px 0;
+ text-align: center;
+ width: 100%;
+ }
+ #forgot-password {
+ padding: 11px;
+ float: right;
+ color: #fff;
+ }
+ .wrapper {
+ min-height: 100%;
+ margin: 0 auto -70px;
+ width: 300px;
+ }
+ footer, .push {
+ height: 70px;
+ }
+}
+
/* Sticky footer */
/* round profile photos */