diff --git a/ui/src/style/enterprise_style/application.scss b/ui/src/style/enterprise_style/application.scss index f90a83d8f..e54de474c 100644 --- a/ui/src/style/enterprise_style/application.scss +++ b/ui/src/style/enterprise_style/application.scss @@ -13,6 +13,7 @@ @import 'modals'; @import 'enterprise-custom'; @import 'dygraph-override'; +@import 'auth-page'; @import 'hosts'; @import 'kapacitor'; @import 'influx-tooltips'; diff --git a/ui/src/style/enterprise_style/auth-page.scss b/ui/src/style/enterprise_style/auth-page.scss new file mode 100644 index 000000000..b6c78c668 --- /dev/null +++ b/ui/src/style/enterprise_style/auth-page.scss @@ -0,0 +1,83 @@ +/* + Styles for Authorization Page + ---------------------------------------------- +*/ +.auth-page { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + overflow: auto; + @include custom-scrollbar($g3-castle, $c-pool); + @include gradient-v($g3-castle, $g0-obsidian); + padding: $sidebar-width; +} +.auth-image { + background-image: url(assets/images/auth-bg.svg); + background-size: cover; + background-position: center center; + background-repeat: no-repeat; + position: absolute; + width: 100%; + height: 100%; + top: 0; + left: 0; + z-index: 2; +} +.auth-box { + z-index: 90; + position: absolute; + top: 43%; + left: 50%; + transform: translate(-50%,-50%); + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + + h1 { + color: $g20-white; + font-weight: 200; + font-size: 52px; + letter-spacing: -2px; + } + p { + color: $g11-sidewalk; + } + + .btn { + margin-top: ($sidebar-width / 2); + margin-bottom: $sidebar-width; + + > .icon { + font-size: 20px; + margin-right: 8px; + } + } +} +.auth-logo { + background-image: url(assets/images/auth-logo.svg); + background-size: 100% 100%; + background-position: center center; + background-repeat: no-repeat; + width: 100px; + height: 100px; +} +.auth-credits { + z-index: 90; + position: absolute; + bottom: ($sidebar-width / 4); + left: 50%; + transform: translateX(-50%); + font-size: 12px; + color: $g11-sidewalk; + + .icon { + display: inline-block; + vertical-align: middle; + position: relative; + top: -1px; + margin-right: 1px; + } +} \ No newline at end of file