mirror of
https://github.com/opencloud-eu/opencloud.git
synced 2026-01-24 21:49:12 -06:00
This revision introduces a new environment variable `IDP_LOGIN_BACKGROUND_URL` that overrides the default background image of the IDP login page when present.
161 lines
2.8 KiB
CSS
161 lines
2.8 KiB
CSS
/* additional css on top of kpop */
|
|
@font-face {
|
|
font-family: Inter;
|
|
src: url(./fonts/inter.ttf) format('truetype');
|
|
font-weight: 100 900;
|
|
font-style: oblique 0deg 12deg;
|
|
}
|
|
|
|
html {
|
|
font-feature-settings: "cv11";
|
|
}
|
|
|
|
body {
|
|
font-family: Inter, sans-serif;
|
|
}
|
|
|
|
strong {
|
|
font-weight: 600;
|
|
}
|
|
|
|
.oc-login-bg {
|
|
background-image: url(./images/background.jpg);
|
|
background-size: cover;
|
|
background-repeat: no-repeat;
|
|
background-position: center;
|
|
z-index: 0;
|
|
display: flex;
|
|
width: 100%;
|
|
}
|
|
|
|
#loader {
|
|
/* NOTE(longsleep): White here needed because of the background image */
|
|
color: white;
|
|
text-shadow: #000 0 0 1px;
|
|
}
|
|
|
|
.oc-logo {
|
|
position: absolute;
|
|
top: -130px;
|
|
left: 50%;
|
|
height: 80px;
|
|
transform: translateX(-50%);
|
|
}
|
|
|
|
.oc-progress {
|
|
/* Needs to be important to overwrite material-ui */
|
|
background-color: rgba(78, 133, 200, 0.8) !important;
|
|
height: 4px;
|
|
width: 100px;
|
|
}
|
|
|
|
.oc-progress > div {
|
|
/* Needs to be important to overwrite material-ui */
|
|
background-color: #4a76ac !important;
|
|
}
|
|
|
|
.oc-input {
|
|
background-color: #fff;
|
|
border: 1px solid #fff;
|
|
border-radius: 3px;
|
|
height: 40px;
|
|
width: 300px;
|
|
padding: 16px;
|
|
box-sizing: border-box;
|
|
font-size: 1rem;
|
|
}
|
|
|
|
.oc-label {
|
|
color: #fff;
|
|
display: inline-block;
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
.oc-input.error {
|
|
outline: none;
|
|
border: 1px solid #fe4600;
|
|
}
|
|
|
|
.MuiTypography-colorError {
|
|
color: #fe4600 !important;
|
|
}
|
|
|
|
.oc-input:focus {
|
|
outline: none;
|
|
border: 1px solid #fff;
|
|
}
|
|
|
|
.oc-input + .oc-input {
|
|
margin-top: 15px;
|
|
}
|
|
|
|
.MuiTouchRipple-root {
|
|
display: none !important;
|
|
}
|
|
|
|
.oc-button {
|
|
/* Needs to be important to overwrite material-ui */
|
|
font-size: 1.0625rem !important;
|
|
}
|
|
|
|
.oc-button-primary {
|
|
/* Needs to be important to overwrite material-ui */
|
|
width: 100%;
|
|
background: linear-gradient(to right, #2c588e, #4e85c8) -1px;
|
|
background-size: 103% !important;
|
|
border: 1px solid transparent !important;
|
|
}
|
|
|
|
.oc-checkbox-dark svg {
|
|
/* Needs to be important to overwrite material-ui */
|
|
fill: white !important;
|
|
}
|
|
|
|
.oc-footer-message {
|
|
color: white;
|
|
padding: 10px;
|
|
font-size: 0.8rem;
|
|
}
|
|
|
|
@media only screen and (max-width: 768px) {
|
|
.oc-logo {
|
|
height: 60px;
|
|
top: -90px;
|
|
}
|
|
}
|
|
|
|
/* Helpers */
|
|
.oc-mt-l {
|
|
margin-top: 24px !important;
|
|
}
|
|
|
|
.oc-mb-m {
|
|
margin-bottom: 20px !important;
|
|
}
|
|
|
|
.oc-light {
|
|
color: #fff !important;
|
|
}
|
|
|
|
.oc-login-form div:not(:last-of-type) {
|
|
margin-bottom: 15px;
|
|
}
|
|
|
|
|
|
/*
|
|
* Special SR classes
|
|
* Used to hide an element visually, but keeping it accessible for accessibility tools.
|
|
*/
|
|
.oc-invisible-sr {
|
|
border: 0 !important;
|
|
clip: rect(1px, 1px, 1px, 1px) !important;
|
|
height: 1px !important;
|
|
overflow: hidden !important;
|
|
padding: 0 !important;
|
|
/* Need to make sure we override any existing styles. */
|
|
position: absolute !important;
|
|
top: 0;
|
|
white-space: nowrap;
|
|
width: 1px !important;
|
|
}
|