Korbs revidoval tento gist 5 hours ago. Přejít na revizi
1 file changed, 210 insertions
styles.css(vytvořil soubor)
| @@ -0,0 +1,210 @@ | |||
| 1 | + | /* Changes made by SudoVanilla */ | |
| 2 | + | html::before { | |
| 3 | + | content: ""; | |
| 4 | + | background: url("https://via.sudovanilla.org/media/wallpapers/SudoVanilla/Night%20Lint.png"); | |
| 5 | + | position: fixed; | |
| 6 | + | top: 0; | |
| 7 | + | left: 0; | |
| 8 | + | width: 100%; | |
| 9 | + | height: 100%; | |
| 10 | + | background-repeat: no-repeat; | |
| 11 | + | background-size: cover; | |
| 12 | + | background-position: bottom; | |
| 13 | + | z-index: -1; | |
| 14 | + | } | |
| 15 | + | .pf-v5-c-login__main-header { | |
| 16 | + | border: none !important; | |
| 17 | + | } | |
| 18 | + | .pf-v5-c-login__main { | |
| 19 | + | border: 1px var(--pf-v5-global--palette--cyan-500) solid !important; | |
| 20 | + | border-radius: 12px !important; | |
| 21 | + | background: transparent; | |
| 22 | + | backdrop-filter: blur(12px) brightness(0.6) contrast(0.9); | |
| 23 | + | } | |
| 24 | + | .pf-v5-c-form-control::after, .pf-v5-c-form-control::before, #password-show-password::after, .pf-v5-c-login__main-footer-band-item.pf-v5-u-font-size-sm.pf-v5-u-color-200, #reset-login::after { | |
| 25 | + | display: none | |
| 26 | + | } | |
| 27 | + | .pf-v5-c-form-control { | |
| 28 | + | border-radius: 4px; | |
| 29 | + | background: rgba(255, 255, 255, 0.1); | |
| 30 | + | } | |
| 31 | + | .pf-v5-c-form-control:hover { | |
| 32 | + | outline: 1px rgba(255, 255, 255, 0.25) solid; | |
| 33 | + | } | |
| 34 | + | .pf-v5-c-form-control:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible { | |
| 35 | + | outline: 1px rgba(255, 255, 255, 0.5) solid !important; | |
| 36 | + | border-radius: 4px; | |
| 37 | + | } | |
| 38 | + | #password-show-password, #reset-login { | |
| 39 | + | background: transparent; | |
| 40 | + | position: absolute; | |
| 41 | + | right: 0px; | |
| 42 | + | } | |
| 43 | + | .pf-v5-c-login__main-footer-band { | |
| 44 | + | margin: 0px !important; | |
| 45 | + | padding: 4px 0px !important; | |
| 46 | + | border: none; | |
| 47 | + | } | |
| 48 | + | .pf-v5-c-login__main-body.pf-v5-u-pl-0.pf-v5-u-pr-0 { | |
| 49 | + | padding: 0px; | |
| 50 | + | } | |
| 51 | + | #kc-page-title { | |
| 52 | + | font-size: 20px; | |
| 53 | + | } | |
| 54 | + | .pf-v5-c-input-group__item { | |
| 55 | + | border: none; | |
| 56 | + | } | |
| 57 | + | #login-select-toggle { | |
| 58 | + | border-radius: 4px; | |
| 59 | + | background: transparent; | |
| 60 | + | } | |
| 61 | + | #kc-header { | |
| 62 | + | display: none; | |
| 63 | + | } | |
| 64 | + | .pf-v5-c-data-list__item.pf-m-clickable, .pf-v5-c-data-list.select-auth-container { | |
| 65 | + | border: none; | |
| 66 | + | } | |
| 67 | + | .pf-v5-c-data-list__item.pf-m-clickable { | |
| 68 | + | border-radius: 12px; | |
| 69 | + | } | |
| 70 | + | ||
| 71 | + | /* Default for Keycloak.v2 */ | |
| 72 | + | :root { | |
| 73 | + | --keycloak-logo-url: url('../img/keycloak-logo-text.svg'); | |
| 74 | + | --keycloak-bg-logo-url: url("../img/keycloak-bg-darken.svg"); | |
| 75 | + | --keycloak-logo-height: 63px; | |
| 76 | + | --keycloak-logo-width: 300px; | |
| 77 | + | --keycloak-card-top-color: var(--pf-v5-global--palette--blue-400); | |
| 78 | + | } | |
| 79 | + | ||
| 80 | + | .pf-v5-c-login__container { | |
| 81 | + | grid-template-columns: 34rem; | |
| 82 | + | grid-template-areas: "header" | |
| 83 | + | "main" | |
| 84 | + | } | |
| 85 | + | ||
| 86 | + | .pf-v5-c-login__main-header { | |
| 87 | + | border-top: 4px solid var(--keycloak-card-top-color); | |
| 88 | + | } | |
| 89 | + | ||
| 90 | + | /* Info section - top margin + bottom padding */ | |
| 91 | + | .pf-v5-c-login__main-footer-band:first-child { | |
| 92 | + | margin-block-start: var(--pf-v5-global--spacer--lg); | |
| 93 | + | } | |
| 94 | + | ||
| 95 | + | .pf-v5-c-login__main-footer-band:last-child { | |
| 96 | + | padding-bottom: 0; | |
| 97 | + | } | |
| 98 | + | /* Info section */ | |
| 99 | + | ||
| 100 | + | .login-pf body { | |
| 101 | + | background: var(--keycloak-bg-logo-url) no-repeat center center fixed; | |
| 102 | + | background-size: cover; | |
| 103 | + | height: 100%; | |
| 104 | + | } | |
| 105 | + | ||
| 106 | + | div.kc-logo-text { | |
| 107 | + | background-image: var(--keycloak-logo-url); | |
| 108 | + | height: var(--keycloak-logo-height); | |
| 109 | + | width: var(--keycloak-logo-width); | |
| 110 | + | background-repeat: no-repeat; | |
| 111 | + | background-size: contain; | |
| 112 | + | margin: 0 auto; | |
| 113 | + | } | |
| 114 | + | ||
| 115 | + | div.kc-logo-text span { | |
| 116 | + | display: none; | |
| 117 | + | } | |
| 118 | + | ||
| 119 | + | .kc-login-tooltip { | |
| 120 | + | position: relative; | |
| 121 | + | display: inline-block; | |
| 122 | + | } | |
| 123 | + | ||
| 124 | + | .kc-login-tooltip .kc-tooltip-text{ | |
| 125 | + | top:-3px; | |
| 126 | + | left:160%; | |
| 127 | + | background-color: black; | |
| 128 | + | visibility: hidden; | |
| 129 | + | color: #fff; | |
| 130 | + | ||
| 131 | + | min-width:130px; | |
| 132 | + | text-align: center; | |
| 133 | + | border-radius: 2px; | |
| 134 | + | box-shadow:0 1px 8px rgba(0,0,0,0.6); | |
| 135 | + | padding: 5px; | |
| 136 | + | ||
| 137 | + | position: absolute; | |
| 138 | + | opacity:0; | |
| 139 | + | transition:opacity 0.5s; | |
| 140 | + | } | |
| 141 | + | ||
| 142 | + | /* Show tooltip */ | |
| 143 | + | .kc-login-tooltip:hover .kc-tooltip-text { | |
| 144 | + | visibility: visible; | |
| 145 | + | opacity:0.7; | |
| 146 | + | } | |
| 147 | + | ||
| 148 | + | /* Arrow for tooltip */ | |
| 149 | + | .kc-login-tooltip .kc-tooltip-text::after { | |
| 150 | + | content: " "; | |
| 151 | + | position: absolute; | |
| 152 | + | top: 15px; | |
| 153 | + | right: 100%; | |
| 154 | + | margin-top: -5px; | |
| 155 | + | border-width: 5px; | |
| 156 | + | border-style: solid; | |
| 157 | + | border-color: transparent black transparent transparent; | |
| 158 | + | } | |
| 159 | + | ||
| 160 | + | #kc-recovery-codes-list { | |
| 161 | + | columns: 2; | |
| 162 | + | } | |
| 163 | + | ||
| 164 | + | #certificate_subjectDN { | |
| 165 | + | overflow-wrap: break-word | |
| 166 | + | } | |
| 167 | + | ||
| 168 | + | #kc-verify-email-form { | |
| 169 | + | margin-top: 24px; | |
| 170 | + | margin-bottom: 24px; | |
| 171 | + | } | |
| 172 | + | ||
| 173 | + | #kc-header-wrapper { | |
| 174 | + | font-size: 29px; | |
| 175 | + | text-transform: uppercase; | |
| 176 | + | letter-spacing: 3px; | |
| 177 | + | line-height: 1.2em; | |
| 178 | + | white-space: normal; | |
| 179 | + | color: var(--pf-v5-global--Color--light-100) !important; | |
| 180 | + | text-align: center; | |
| 181 | + | } | |
| 182 | + | ||
| 183 | + | #kc-code pre code { | |
| 184 | + | word-break: break-all; | |
| 185 | + | } | |
| 186 | + | ||
| 187 | + | hr { | |
| 188 | + | margin-top: var(--pf-v5-global--spacer--sm); | |
| 189 | + | margin-bottom: var(--pf-v5-global--spacer--md); | |
| 190 | + | } | |
| 191 | + | ||
| 192 | + | #kc-social-providers svg:not(.google) { | |
| 193 | + | filter: invert(47%) sepia(88%) saturate(7486%) hue-rotate(199deg) brightness(91%) contrast(101%); | |
| 194 | + | } | |
| 195 | + | ||
| 196 | + | #kc-social-providers svg { | |
| 197 | + | height: var(--pf-v5-global--FontSize--xl); | |
| 198 | + | } | |
| 199 | + | ||
| 200 | + | @media (prefers-color-scheme: dark) { | |
| 201 | + | #kc-social-providers svg:not(.google) { | |
| 202 | + | filter: invert(54%) sepia(96%) saturate(2028%) hue-rotate(174deg) brightness(99%) contrast(97%); | |
| 203 | + | } | |
| 204 | + | } | |
| 205 | + | ||
| 206 | + | @media (min-width: 768px) { | |
| 207 | + | div.pf-v5-c-login__main-header { | |
| 208 | + | grid-template-columns: 70% 30%; | |
| 209 | + | } | |
| 210 | + | } | |
Novější
Starší