libre.sh/keycloak-scim
3
0
Fork 0
Code Issues 15 Pull requests Releases Packages Activity Actions

header, button and input

Browse source
This commit is contained in:
Gabriel Cardoso 2013-10-23 16:06:13 -02:00
parent 9e4d5f0eb6
commit 4019b6fd5f
14 changed files with 403 additions and 400 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

208
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/admin-console.css
View file

@ -44,91 +44,109 @@ body {
background-color: #e4f3fa; background-color: #e4f3fa;
} }
/* Header */ /* Header */
.header.rcue .navbar.utility {
background-color: #393F45;
border-bottom: 1px solid #53565B;
}
.header.rcue .navbar.utility .navbar-inner {
border-bottom: 0;
max-width: 1170px;
}
.header.rcue .navbar.primary {
background-image: -moz-linear-gradient(top, #474c50, #383f43);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#474c50), to(#383f43));
background-image: -webkit-linear-gradient(top, #474c50, #383f43);
background-image: -o-linear-gradient(top, #474c50, #383f43);
background-image: linear-gradient(to bottom, #474c50, #383f43);
background-repeat: repeat-x;
background-color: #41474b;
}
.header.rcue .navbar.primary .navbar-inner { .header.rcue .navbar.primary .navbar-inner {
min-height: 42px; min-height: 42px;
max-width: 1170px;
} }
.header.rcue .navbar.primary .nav > li { .header.rcue .navbar.primary .nav > li {
/* /*
.dropdown { .dropdown {
display: inline-block;
margin-left: 0.53846153846154em;
margin-top: 0.46153846153846em;
min-width: 15.3846153846154em;
width: auto;
.dropdown-toggle {
font-size: 0.84615384615385em;
color: #fff;
display: inline-block; display: inline-block;
line-height: 2.36363636363636em; margin-left: 0.53846153846154em;
border: 1px solid #676c6e; margin-top: 0.46153846153846em;
border-radius: 2px; min-width: 15.3846153846154em;
padding: 0 0.54545454545455em; width: auto;
background: #555a5e url(img/sprite-arrow-down.svg) no-repeat right -26px;
display: block;
&:hover, .dropdown-toggle {
&:focus { font-size: 0.84615384615385em;
text-decoration: none; color: #fff;
} display: inline-block;
line-height: 2.36363636363636em;
border: 1px solid #676c6e;
border-radius: 2px;
padding: 0 0.54545454545455em;
background: #555a5e url(img/sprite-arrow-down.svg) no-repeat right -26px;
display: block;
&:hover { &:hover,
border-color: #7e8385; &:focus {
} text-decoration: none;
} }
.dropdown-menu { &:hover {
border-color: #7e8385;
left: 0;
min-width: 0;
width: 100%;
overflow: hidden;
li,
li.selected {
width: auto;
a {
width: auto;
border-top: 1px solid transparent;
border-bottom: 1px solid transparent;
&:hover {
background-color: #D5ECF9;
background-image: none;
border-bottom: 1px solid #A7D7F1;
border-top: 1px solid #A7D7F1;
color: #4D5258;
}
} }
} }
li.selected a { .dropdown-menu {
background-color: #2B99C0;
background-image: linear-gradient(top, #2EA1CA 0%, #2792B6 100%); left: 0;
background-image: -o-linear-gradient(top, #2EA1CA 0%, #2792B6 100%); min-width: 0;
background-image: -moz-linear-gradient(top, #2EA1CA 0%, #2792B6 100%); width: 100%;
background-image: -webkit-linear-gradient(top, #2EA1CA 0%, #2792B6 100%); overflow: hidden;
background-image: -ms-linear-gradient(top, #2EA1CA 0%, #2792B6 100%);
background-image: -webkit-gradient( li,
linear, li.selected {
left top, width: auto;
left bottom,
color-stop(0.0, #2EA1CA), a {
color-stop(1,0, #2792B6) width: auto;
); border-top: 1px solid transparent;
background-repeat: repeat-x; border-bottom: 1px solid transparent;
color: #FFFFFF;
&:hover {
background-color: #D5ECF9;
background-image: none;
border-bottom: 1px solid #A7D7F1;
border-top: 1px solid #A7D7F1;
color: #4D5258;
}
}
}
li.selected a {
background-color: #2B99C0;
background-image: linear-gradient(top, #2EA1CA 0%, #2792B6 100%);
background-image: -o-linear-gradient(top, #2EA1CA 0%, #2792B6 100%);
background-image: -moz-linear-gradient(top, #2EA1CA 0%, #2792B6 100%);
background-image: -webkit-linear-gradient(top, #2EA1CA 0%, #2792B6 100%);
background-image: -ms-linear-gradient(top, #2EA1CA 0%, #2792B6 100%);
background-image: -webkit-gradient(
linear,
left top,
left bottom,
color-stop(0.0, #2EA1CA),
color-stop(1,0, #2792B6)
);
background-repeat: repeat-x;
color: #FFFFFF;
}
}
&.open .dropdown-toggle {
text-decoration: none;
box-shadow: inset 0px 2px 5px rgba(0,0,0,0.2);
border-color: #7e8385;
} }
} }
*/
&.open .dropdown-toggle {
text-decoration: none;
box-shadow: inset 0px 2px 5px rgba(0,0,0,0.2);
border-color: #7e8385;
}
}
*/
} }
.header.rcue .navbar.primary .nav > li .dropdown-label { .header.rcue .navbar.primary .nav > li .dropdown-label {
@ -166,18 +184,17 @@ body {
} }
.header.rcue .navbar.primary .nav > li .select-rcue select option { .header.rcue .navbar.primary .nav > li .select-rcue select option {
background-color: #fff; background-color: #fff;
color: #333; color: black;
padding: 0.36363636363636em 0.90909090909091em; padding: 4px 10px;
} }
.header.rcue .navbar.primary .nav > li a#refresh { .header.rcue .navbar.primary .nav > li a#refresh {
border: none; border: none;
margin: 0; margin: 0;
padding: 0; padding: 0;
display: inline-block; float: right;
vertical-align: middle;
font-size: 0.76923076923077em; font-size: 0.76923076923077em;
margin-left: 1em; margin-left: 1em;
margin-top: 0.7em; margin-top: 1.4em;
} }
.header.rcue .navbar.primary .nav > li a#refresh:hover { .header.rcue .navbar.primary .nav > li a#refresh:hover {
background: none; background: none;
@ -207,11 +224,12 @@ body {
} }
.bs-sidebar ul li { .bs-sidebar ul li {
margin-bottom: 0.5em; margin-bottom: 0.5em;
margin-left: -1em;
} }
.bs-sidebar ul li a { .bs-sidebar ul li a {
font-size: 1.3em; font-size: 1.3em;
font-family: "Open Sans", sans-serif; font-family: "Open Sans", sans-serif;
padding-left: 3em; padding-left: 1.92307692307692em;
color: #4d5258; color: #4d5258;
line-height: 2.07692307692308em; line-height: 2.07692307692308em;
display: block; display: block;
@ -219,7 +237,8 @@ body {
border-style: solid; border-style: solid;
border-color: #f9f9f9; border-color: #f9f9f9;
} }
.bs-sidebar ul li a:hover { .bs-sidebar ul li a:hover,
.bs-sidebar ul li a:focus {
text-decoration: none; text-decoration: none;
color: #777777; color: #777777;
} }
@ -227,6 +246,9 @@ body {
background-color: #c7e5f0; background-color: #c7e5f0;
border-color: #56bae0; border-color: #56bae0;
font-weight: bold; font-weight: bold;
background-image: url(img/icon-sidebar-active.svg);
background-repeat: no-repeat;
background-position: right center;
} }
#content-area { #content-area {
padding: 0; padding: 0;
@ -530,20 +552,37 @@ table.list tbody tr.expanded .form-actions {
} }
/* Break Points */ /* Break Points */
@media (max-width: 1200px) { @media (max-width: 1200px) {
.header.rcue .navbar.utility .navbar-inner,
.header.rcue .navbar.primary .navbar-inner {
max-width: 970px;
}
#container-right-bg { #container-right-bg {
margin-left: 242.5px; margin-left: 242.5px;
width: 727.5px; width: 727.5px;
} }
} }
@media (max-width: 992px) { @media (max-width: 992px) {
.header.rcue .navbar.utility .navbar-inner,
.header.rcue .navbar.primary .navbar-inner {
max-width: 750px;
}
.bs-sidebar, .bs-sidebar,
.user .bs-sidebar { .user .bs-sidebar {
padding-top: 2em; padding-top: 1em;
width: 100%; width: 100%;
} }
.bs-sidebar ul li,
.user .bs-sidebar ul li {
margin-left: 0;
}
.bs-sidebar ul li a, .bs-sidebar ul li a,
.user .bs-sidebar ul li a { .user .bs-sidebar ul li a {
border-width: 1px; border-width: 1px;
padding-left: 1.53846153846154em;
}
.bs-sidebar ul li.active a,
.user .bs-sidebar ul li.active a {
background-image: none;
} }
#content-area .top-nav { #content-area .top-nav {
border-top: 1px solid #cecece; border-top: 1px solid #cecece;
@ -557,8 +596,17 @@ table.list tbody tr.expanded .form-actions {
} }
} }
@media (max-width: 768px) { @media (max-width: 768px) {
.header.rcue .navbar.utility .navbar-inner,
.header.rcue .navbar.primary .navbar-inner {
max-width: 100%;
}
.bs-sidebar ul li.active a,
.user .bs-sidebar ul li.active a {
border-left: none;
border-right: none;
}
.container { .container {
min-width: 580px; min-width: 56 em;
} }
#content-area { #content-area {
border: none; border: none;

357
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/admin-console.less
View file

@ -63,178 +63,197 @@ body {
/* Header */ /* Header */
.header.rcue .navbar.primary { .header.rcue {
.navbar-inner { .navbar.utility {
min-height: 42px; background-color: #393F45;
border-bottom: 1px solid #53565B;
.navbar-inner {
border-bottom: 0;
max-width: 1170px;
}
} }
.nav > li { .navbar.primary {
background-image:-moz-linear-gradient(top,#474c50,#383f43);
background-image:-webkit-gradient(linear,0 0,0 100%,from(#474c50),to(#383f43));
background-image:-webkit-linear-gradient(top,#474c50,#383f43);
background-image:-o-linear-gradient(top,#474c50,#383f43);
background-image:linear-gradient(to bottom,#474c50,#383f43);
background-repeat:repeat-x;
background-color: #41474b;
.dropdown-label { .navbar-inner {
font-size: 0.84615384615385em; min-height: 42px;
color: #dbdada; max-width: 1170px;
margin-left: 1.36363636363636em;
float: left;
margin-top: 0.63636363636364em;
line-height: 2.36363636363636em
} }
.select-rcue { .nav > li {
font-size: 0.76923076923077em;
margin-left: 1em;
margin-top: 0.7em;
display: inline-block;
vertical-align: middle;
background-color: #555a5e;
background-image: none;
background-image: url(img/sprite-arrow-down.svg);
background-repeat: no-repeat;
background-position: right -26px;
border: 1px solid #676c6e;
border-radius: 2px;
padding-left: 0;
&:hover { .dropdown-label {
border-color: #7e8385;
}
select {
color: #fff;
&:-moz-focusring {
color: transparent;
text-shadow: 0 0 0 #fff;
}
option {
background-color: #fff;
color: #333;
padding: 0.36363636363636em 0.90909090909091em;
}
}
}
a#refresh {
border: none;
margin: 0;
padding: 0;
display: inline-block;
vertical-align: middle;
font-size: 0.76923076923077em;
margin-left: 1em;
margin-top: 0.7em;
&:hover {
background: none;
}
.icon-spinner6 {
margin-right: 0;
background-image: url('img/sprites-gray.png');
&:hover {
background-image: url('img/sprites-white.png');
background-color: transparent;
}
}
}
/*
.dropdown {
display: inline-block;
margin-left: 0.53846153846154em;
margin-top: 0.46153846153846em;
min-width: 15.3846153846154em;
width: auto;
.dropdown-toggle {
font-size: 0.84615384615385em; font-size: 0.84615384615385em;
color: #fff; color: #dbdada;
margin-left: 1.36363636363636em;
float: left;
margin-top: 0.63636363636364em;
line-height: 2.36363636363636em
}
.select-rcue {
font-size: 0.76923076923077em;
margin-left: 1em;
margin-top: 0.7em;
display: inline-block; display: inline-block;
line-height: 2.36363636363636em; vertical-align: middle;
background-color: #555a5e;
background-image: none;
background-image: url(img/sprite-arrow-down.svg);
background-repeat: no-repeat;
background-position: right -26px;
border: 1px solid #676c6e; border: 1px solid #676c6e;
border-radius: 2px; border-radius: 2px;
padding: 0 0.54545454545455em; padding-left: 0;
background: #555a5e url(img/sprite-arrow-down.svg) no-repeat right -26px;
display: block;
&:hover,
&:focus {
text-decoration: none;
}
&:hover { &:hover {
border-color: #7e8385; border-color: #7e8385;
} }
select {
color: #fff;
&:-moz-focusring {
color: transparent;
text-shadow: 0 0 0 #fff;
}
option {
background-color: #fff;
color: black;
padding: 4px 10px;
}
}
} }
.dropdown-menu { a#refresh {
border: none;
margin: 0;
padding: 0;
float: right;
font-size: 0.76923076923077em;
margin-left: 1em;
margin-top: 1.4em;
left: 0; &:hover {
min-width: 0; background: none;
width: 100%; }
overflow: hidden;
li, .icon-spinner6 {
li.selected { margin-right: 0;
width: auto; background-image: url('img/sprites-gray.png');
a { &:hover {
width: auto; background-image: url('img/sprites-white.png');
border-top: 1px solid transparent; background-color: transparent;
border-bottom: 1px solid transparent; }
}
}
&:hover { /*
background-color: #D5ECF9; .dropdown {
background-image: none; display: inline-block;
border-bottom: 1px solid #A7D7F1; margin-left: 0.53846153846154em;
border-top: 1px solid #A7D7F1; margin-top: 0.46153846153846em;
color: #4D5258; min-width: 15.3846153846154em;
} width: auto;
.dropdown-toggle {
font-size: 0.84615384615385em;
color: #fff;
display: inline-block;
line-height: 2.36363636363636em;
border: 1px solid #676c6e;
border-radius: 2px;
padding: 0 0.54545454545455em;
background: #555a5e url(img/sprite-arrow-down.svg) no-repeat right -26px;
display: block;
&:hover,
&:focus {
text-decoration: none;
}
&:hover {
border-color: #7e8385;
} }
} }
li.selected a { .dropdown-menu {
background-color: #2B99C0;
background-image: linear-gradient(top, #2EA1CA 0%, #2792B6 100%); left: 0;
background-image: -o-linear-gradient(top, #2EA1CA 0%, #2792B6 100%); min-width: 0;
background-image: -moz-linear-gradient(top, #2EA1CA 0%, #2792B6 100%); width: 100%;
background-image: -webkit-linear-gradient(top, #2EA1CA 0%, #2792B6 100%); overflow: hidden;
background-image: -ms-linear-gradient(top, #2EA1CA 0%, #2792B6 100%);
background-image: -webkit-gradient( li,
linear, li.selected {
left top, width: auto;
left bottom,
color-stop(0.0, #2EA1CA), a {
color-stop(1,0, #2792B6) width: auto;
); border-top: 1px solid transparent;
background-repeat: repeat-x; border-bottom: 1px solid transparent;
color: #FFFFFF;
&:hover {
background-color: #D5ECF9;
background-image: none;
border-bottom: 1px solid #A7D7F1;
border-top: 1px solid #A7D7F1;
color: #4D5258;
}
}
}
li.selected a {
background-color: #2B99C0;
background-image: linear-gradient(top, #2EA1CA 0%, #2792B6 100%);
background-image: -o-linear-gradient(top, #2EA1CA 0%, #2792B6 100%);
background-image: -moz-linear-gradient(top, #2EA1CA 0%, #2792B6 100%);
background-image: -webkit-linear-gradient(top, #2EA1CA 0%, #2792B6 100%);
background-image: -ms-linear-gradient(top, #2EA1CA 0%, #2792B6 100%);
background-image: -webkit-gradient(
linear,
left top,
left bottom,
color-stop(0.0, #2EA1CA),
color-stop(1,0, #2792B6)
);
background-repeat: repeat-x;
color: #FFFFFF;
}
}
&.open .dropdown-toggle {
text-decoration: none;
box-shadow: inset 0px 2px 5px rgba(0,0,0,0.2);
border-color: #7e8385;
} }
} }
*/
&.open .dropdown-toggle {
text-decoration: none;
box-shadow: inset 0px 2px 5px rgba(0,0,0,0.2);
border-color: #7e8385;
}
} }
*/
}
.button { .button {
font-size: 0.84615384615385em; font-size: 0.84615384615385em;
margin-right: 1.36363636363636em; margin-right: 1.36363636363636em;
margin-top: 0.63636363636364em; margin-top: 0.63636363636364em;
&:focus { &:focus {
text-decoration: none; text-decoration: none;
}
} }
} }
} }
.bs-sidebar { .bs-sidebar {
background-color: @bg-grey; background-color: @bg-grey;
padding-top: 4.3em; padding-top: 4.3em;
@ -244,11 +263,12 @@ body {
ul li { ul li {
margin-bottom: 0.5em; margin-bottom: 0.5em;
margin-left: -1em;
a { a {
font-size: 1.3em; font-size: 1.3em;
font-family: @open-sans; font-family: @open-sans;
padding-left: 3em; padding-left: 1.92307692307692em;
color: @text-black; color: @text-black;
line-height: 2.07692307692308em; line-height: 2.07692307692308em;
display: block; display: block;
@ -256,7 +276,8 @@ body {
border-style: solid; border-style: solid;
border-color: @bg-grey; border-color: @bg-grey;
&:hover { &:hover,
&:focus {
text-decoration: none; text-decoration: none;
color: @text-grey; color: @text-grey;
} }
@ -266,6 +287,9 @@ body {
background-color: #c7e5f0; background-color: #c7e5f0;
border-color: #56bae0; border-color: #56bae0;
font-weight: bold; font-weight: bold;
background-image: url(img/icon-sidebar-active.svg);
background-repeat: no-repeat;
background-position: right center;
} }
} }
} }
@ -663,6 +687,14 @@ table.list {
@media (max-width: 1200px) { @media (max-width: 1200px) {
.header.rcue {
.navbar.utility .navbar-inner,
.navbar.primary .navbar-inner {
max-width: 970px;
}
}
#container-right-bg { #container-right-bg {
margin-left: 242.5px; margin-left: 242.5px;
width: 727.5px; width: 727.5px;
@ -671,13 +703,31 @@ table.list {
@media (max-width: 992px) { @media (max-width: 992px) {
.header.rcue {
.navbar.utility .navbar-inner,
.navbar.primary .navbar-inner {
max-width: 750px;
}
}
.bs-sidebar, .bs-sidebar,
.user .bs-sidebar { .user .bs-sidebar {
padding-top: 2em; padding-top: 1em;
width: 100%; width: 100%;
ul li a { ul li {
border-width: 1px;
margin-left: 0;
a {
border-width: 1px;
padding-left: 1.53846153846154em;
}
&.active a {
background-image: none;
}
} }
} }
@ -698,8 +748,25 @@ table.list {
@media (max-width: 768px) { @media (max-width: 768px) {
.header.rcue {
.navbar.utility .navbar-inner,
.navbar.primary .navbar-inner {
max-width: 100%;
}
}
.bs-sidebar,
.user .bs-sidebar {
ul li.active a {
border-left: none;
border-right: none;
}
}
.container { .container {
min-width: 580px; min-width: 56 em;
} }
#content-area { #content-area {

26
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/forms.css
View file

@ -55,6 +55,25 @@ textarea {
padding: 0.45em 0.545454545454545em; padding: 0.45em 0.545454545454545em;
height: auto; height: auto;
} }
input[type="text"][readonly],
input[type="password"][readonly],
input[type="email"][readonly],
textarea[readonly] {
background-color: #f0f0f0;
}
input[type="text"][readonly]:hover,
input[type="password"][readonly]:hover,
input[type="email"][readonly]:hover,
textarea[readonly]:hover {
border-color: #62afdb;
}
input[type="text"][readonly]:focus,
input[type="password"][readonly]:focus,
input[type="email"][readonly]:focus,
textarea[readonly]:focus {
border-color: #b6b6b6;
box-shadow: none;
}
.input-below { .input-below {
clear: both; clear: both;
display: inline-block; display: inline-block;
@ -235,9 +254,14 @@ button.primary:focus,
right: 0.2em; right: 0.2em;
top: 0.4em; top: 0.4em;
opacity: 0.5; opacity: 0.5;
filter: alpha(opacity=50);
} }
.search-comp .icon-search:hover { .search-comp .icon-search:hover,
.search-comp .icon-search:active,
.search-comp .icon-search:focus {
background-image: url('img/sprites.png');
opacity: 1; opacity: 1;
filter: alpha(opacity=100);
-webkit-transition: ease-in-out opacity 0.25s; -webkit-transition: ease-in-out opacity 0.25s;
-moz-transition: ease-in-out opacity 0.25s; -moz-transition: ease-in-out opacity 0.25s;
-o-transition: ease-in-out opacity 0.25s; -o-transition: ease-in-out opacity 0.25s;

23
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/forms.less
View file

@ -56,6 +56,22 @@ textarea {
height: auto; height: auto;
} }
input[type="text"][readonly],
input[type="password"][readonly],
input[type="email"][readonly],
textarea[readonly] {
background-color: #f0f0f0;
&:hover {
border-color: #62afdb;
}
&:focus {
border-color: #b6b6b6;
box-shadow: none;
}
}
.input-below { .input-below {
clear: both; clear: both;
display: inline-block; display: inline-block;
@ -266,9 +282,14 @@ button.primary,
right: 0.2em; right: 0.2em;
top: 0.4em; top: 0.4em;
opacity: 0.5; opacity: 0.5;
filter: alpha(opacity=50);
&:hover { &:hover,
&:active,
&:focus {
background-image: url('img/sprites.png');
opacity: 1; opacity: 1;
filter: alpha(opacity=100);
-webkit-transition: ease-in-out opacity 0.25s; -webkit-transition: ease-in-out opacity 0.25s;
-moz-transition: ease-in-out opacity 0.25s; -moz-transition: ease-in-out opacity 0.25s;
-o-transition: ease-in-out opacity 0.25s; -o-transition: ease-in-out opacity 0.25s;

BIN
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/customer-login-screen-bg.jpg
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 46 KiB

164
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/customer-login-screen-bg.svg
View file

@ -1,164 +0,0 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="1680px" height="1080px" viewBox="0 0 1680 1080" enable-background="new 0 0 1680 1080" xml:space="preserve">
<rect fill="#383D42" width="1680" height="1080"/>
<g>
<defs>
<filter id="Adobe_OpacityMaskFilter" filterUnits="userSpaceOnUse" x="1057" y="597" width="704" height="572">
<feColorMatrix type="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0"/>
</filter>
</defs>
<mask maskUnits="userSpaceOnUse" x="1057" y="597" width="704" height="572" id="SVGID_1_">
<g filter="url(#Adobe_OpacityMaskFilter)">
<linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="1302.4395" y1="-269.9951" x2="1622.4397" y2="22.0046" gradientTransform="matrix(-1 0 0 -1 3112 976.6914)">
<stop offset="0" style="stop-color:#000000"/>
<stop offset="1" style="stop-color:#FFFFFF"/>
</linearGradient>
<rect x="1035" y="573" fill="url(#SVGID_2_)" width="752" height="620"/>
</g>
</mask>
<path mask="url(#SVGID_1_)" fill="#D8D8D8" d="M1761,597c-140,214-410,510-704,572h704V597z"/>
<defs>
<filter id="Adobe_OpacityMaskFilter_1_" filterUnits="userSpaceOnUse" x="1056.742" y="596.315" width="705.304" height="573.907">
<feColorMatrix type="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0"/>
</filter>
</defs>
<mask maskUnits="userSpaceOnUse" x="1056.742" y="596.315" width="705.304" height="573.907" id="SVGID_3_">
<g filter="url(#Adobe_OpacityMaskFilter_1_)">
<linearGradient id="SVGID_4_" gradientUnits="userSpaceOnUse" x1="1302.4395" y1="-269.9951" x2="1622.4397" y2="22.0046" gradientTransform="matrix(-1 0 0 -1 3112 976.6914)">
<stop offset="0" style="stop-color:#000000"/>
<stop offset="1" style="stop-color:#FFFFFF"/>
</linearGradient>
<rect x="1035" y="573" fill="url(#SVGID_4_)" width="752" height="620"/>
</g>
</mask>
<path opacity="0.1" mask="url(#SVGID_3_)" fill="none" stroke="#D8D8D8" stroke-width="2.5" stroke-miterlimit="10" d="M1761,597
c-140,214-410,510-704,572"/>
</g>
<defs>
<filter id="Adobe_OpacityMaskFilter_2_" filterUnits="userSpaceOnUse" x="168.747" y="365.576" width="1798.615" height="822.631">
<feColorMatrix type="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0"/>
</filter>
</defs>
<mask maskUnits="userSpaceOnUse" x="168.747" y="365.576" width="1798.615" height="822.631" id="SVGID_5_">
<g filter="url(#Adobe_OpacityMaskFilter_2_)">
<linearGradient id="SVGID_6_" gradientUnits="userSpaceOnUse" x1="1476.5908" y1="477.5732" x2="2688.6016" y2="21.5689" gradientTransform="matrix(-0.9876 -0.1569 0.1569 -0.9876 3048.3154 1294.3018)">
<stop offset="0" style="stop-color:#000000"/>
<stop offset="1" style="stop-color:#FFFFFF"/>
</linearGradient>
<polygon fill="url(#SVGID_6_)" points="329.208,58.782 1976.554,320.459 1810.26,1367.334 162.914,1105.656 "/>
</g>
</mask>
<path mask="url(#SVGID_5_)" fill="#E0E0E0" d="M1967.361,365.576c-393.429,322.269-1126.777,782.925-1798.615,728.856
c379.652,70.433,1428.387,135.769,1651.069,59.762L1967.361,365.576z"/>
<path fill="#D8D8D8" d="M-114.695,1221h1160.347c80.272-27.337,158.024-70.67,230.989-123.266
C792.789,983.34-203.837,592.187-368.695,373L-114.695,1221z"/>
<defs>
<filter id="Adobe_OpacityMaskFilter_3_" filterUnits="userSpaceOnUse" x="-395" y="514.337" width="1423.831" height="829.326">
<feColorMatrix type="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0"/>
</filter>
</defs>
<mask maskUnits="userSpaceOnUse" x="-395" y="514.337" width="1423.831" height="829.326" id="SVGID_7_">
<g filter="url(#Adobe_OpacityMaskFilter_3_)">
<linearGradient id="SVGID_8_" gradientUnits="userSpaceOnUse" x1="2111.374" y1="319.9775" x2="3115.3701" y2="81.9786" gradientTransform="matrix(-1.075 0.1117 -0.1167 -1.1224 3229.8789 866.1523)">
<stop offset="0" style="stop-color:#000000"/>
<stop offset="0.0972" style="stop-color:#060606"/>
<stop offset="0.2213" style="stop-color:#151515"/>
<stop offset="0.36" style="stop-color:#303030"/>
<stop offset="0.5093" style="stop-color:#545454"/>
<stop offset="0.6671" style="stop-color:#838383"/>
<stop offset="0.8323" style="stop-color:#BDBDBD"/>
<stop offset="1" style="stop-color:#FFFFFF"/>
</linearGradient>
<polygon fill="url(#SVGID_8_)" points="-543.126,587.599 1129.521,413.746 1223.549,1318.382 -449.1,1492.233 "/>
</g>
</mask>
<path mask="url(#SVGID_7_)" fill="#C6C6C5" d="M-395,1343.663c225.178-156.636,836.847-511.283,1423.831-382.832l-17.056-446.355
C360.896,503.847-136.975,1108.097-395,1343.663z"/>
<path opacity="0.2" fill="none" stroke="#D8D8D8" stroke-width="5" stroke-miterlimit="10" d="M-368.695,373
c164.858,219.187,1161.484,610.34,1645.336,724.734c154.24,39.423,293.768,67.189,413.359,86.745"/>
<path opacity="0.4" fill="none" stroke="#777D82" stroke-width="3" stroke-miterlimit="10" d="M-218.695,311
c338,316,1048,836,1440,990"/>
<path opacity="0.1" fill="none" stroke="#C6C6C5" stroke-width="2" stroke-miterlimit="10" d="M1257.069,1089.063
c124.494-56.997,382.481-291.736,437.979-414.73"/>
<defs>
<filter id="Adobe_OpacityMaskFilter_4_" filterUnits="userSpaceOnUse" x="535.169" y="-135" width="1423.831" height="829.326">
<feColorMatrix type="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0"/>
</filter>
</defs>
<mask maskUnits="userSpaceOnUse" x="535.169" y="-135" width="1423.831" height="829.326" id="SVGID_9_">
<g filter="url(#Adobe_OpacityMaskFilter_4_)">
<linearGradient id="SVGID_10_" gradientUnits="userSpaceOnUse" x1="664.5693" y1="382.668" x2="1668.5647" y2="144.6692" gradientTransform="matrix(1.075 -0.1117 0.1167 1.1224 -117.8789 110.5386)">
<stop offset="0" style="stop-color:#000000"/>
<stop offset="1" style="stop-color:#FFFFFF"/>
</linearGradient>
<polygon fill="url(#SVGID_10_)" points="2107.126,621.064 434.478,794.917 340.452,-109.719 2013.1,-283.57 "/>
</g>
</mask>
<path mask="url(#SVGID_9_)" fill="#C6C6C5" d="M1959-135C1733.822,21.636,1122.153,376.284,535.169,247.832l17.055,446.356
C1203.104,704.816,1700.975,100.567,1959-135z"/>
<path fill="#D8D8D8" d="M1743-27H582.653C502.38,0.337,424.629,43.67,351.665,96.265C835.516,210.66,1832.142,601.813,1997,821
L1743-27z"/>
<defs>
<filter id="Adobe_OpacityMaskFilter_5_" filterUnits="userSpaceOnUse" x="-49" y="-47" width="704" height="572">
<feColorMatrix type="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0"/>
</filter>
</defs>
<mask maskUnits="userSpaceOnUse" x="-49" y="-47" width="704" height="572" id="SVGID_11_">
<g filter="url(#Adobe_OpacityMaskFilter_5_)">
<linearGradient id="SVGID_12_" gradientUnits="userSpaceOnUse" x1="-97.5605" y1="-124.686" x2="222.4397" y2="167.3137">
<stop offset="0" style="stop-color:#000000"/>
<stop offset="1" style="stop-color:#FFFFFF"/>
</linearGradient>
<rect x="-75" y="-71" fill="url(#SVGID_12_)" width="752" height="620"/>
</g>
</mask>
<path mask="url(#SVGID_11_)" fill="#D8D8D8" d="M-49,525C91,311,361,15,655-47H-49V525z"/>
<defs>
<filter id="Adobe_OpacityMaskFilter_6_" filterUnits="userSpaceOnUse" x="-209" y="-147.691" width="1662" height="1002.691">
<feColorMatrix type="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0"/>
</filter>
</defs>
<mask maskUnits="userSpaceOnUse" x="-209" y="-147.691" width="1662" height="1002.691" id="SVGID_13_">
<g filter="url(#Adobe_OpacityMaskFilter_6_)">
<linearGradient id="SVGID_14_" gradientUnits="userSpaceOnUse" x1="54.2939" y1="584.9688" x2="1266.2927" y2="128.9689">
<stop offset="0" style="stop-color:#000000"/>
<stop offset="1" style="stop-color:#FFFFFF"/>
</linearGradient>
<rect x="-211" y="-159" fill="url(#SVGID_14_)" width="1668" height="1060"/>
</g>
</mask>
<path mask="url(#SVGID_13_)" fill="#E0E0E0" d="M-209,855C129,475,781-95,1453-147C1067-157,21-57-187,53L-209,855z"/>
<path opacity="0.2" fill="none" stroke="#D8D8D8" stroke-width="5" stroke-miterlimit="10" d="M1997,821
C1832.142,601.813,835.516,210.66,351.665,96.265C197.423,56.843,57.896,29.076-61.695,9.521"/>
<path opacity="0.4" fill="none" stroke="#777D82" stroke-width="3" stroke-miterlimit="10" d="M1847,883C1509,567,799,47,407-107"/>
<defs>
<filter id="Adobe_OpacityMaskFilter_7_" filterUnits="userSpaceOnUse" x="-50.046" y="-48.223" width="705.304" height="573.907">
<feColorMatrix type="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0"/>
</filter>
</defs>
<mask maskUnits="userSpaceOnUse" x="-50.046" y="-48.223" width="705.304" height="573.907" id="SVGID_15_">
<g filter="url(#Adobe_OpacityMaskFilter_7_)">
<linearGradient id="SVGID_16_" gradientUnits="userSpaceOnUse" x1="-97.5605" y1="-124.686" x2="222.4397" y2="167.3137">
<stop offset="0" style="stop-color:#000000"/>
<stop offset="1" style="stop-color:#FFFFFF"/>
</linearGradient>
<rect x="-75" y="-71" fill="url(#SVGID_16_)" width="752" height="620"/>
</g>
</mask>
<path opacity="0.1" mask="url(#SVGID_15_)" fill="none" stroke="#D8D8D8" stroke-width="2.5" stroke-miterlimit="10" d="M-49,525
C91,311,361,15,655-47"/>
<circle fill="#D8D8D8" cx="1247.084" cy="399.5" r="2.5"/>
<circle fill="#D8D8D8" cx="436.333" cy="117.667" r="2"/>
<circle fill="#D8D8D8" cx="254.667" cy="173.667" r="2"/>
<circle fill="#D8D8D8" cx="375" cy="101.667" r="4"/>
<circle fill="#D8D8D8" cx="351.665" cy="96.265" r="5"/>
</svg>
Side by side

Before

Width:  |  Height:  |  Size: 9.6 KiB

BIN
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/customer-login-screen-bg2.jpg
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 37 KiB

BIN
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/icon-sidebar-active.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 202 B

7
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/icon-sidebar-active.svg Normal file
View file

@ -0,0 +1,7 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg version="1.0" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="23px" height="14px" viewBox="0 0 23 14" enable-background="new 0 0 23 14" xml:space="preserve">
<polyline fill="none" stroke="#009AD8" stroke-miterlimit="10" points="1,13 7,7 1,1 "/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 573 B

BIN
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/login-register-email-separator.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1.3 KiB

BIN
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/login-register-separator.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 131 B

BIN
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/login-register-social-separators.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.3 KiB

After

Width:  |  Height:  |  Size: 1.3 KiB

BIN
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/tooltip-box-arrow-right-up.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 453 B

4
admin-ui/src/main/resources/META-INF/resources/admin/partials/menu.html
View file

@ -1,6 +1,6 @@
<div class="header rcue"> <div class="header rcue">
<div class="navbar utility"> <div class="navbar utility">
<div class="navbar-inner clearfix"> <div class="navbar-inner clearfix container">
<h1><a href="#"><strong>Keycloak</strong> Central Login</a></h1> <h1><a href="#"><strong>Keycloak</strong> Central Login</a></h1>
<ul class="nav pull-right" data-ng-hide="auth.loggedIn"> <ul class="nav pull-right" data-ng-hide="auth.loggedIn">
<li><a href="/auth-server/rest/saas/login">Login</a></li> <li><a href="/auth-server/rest/saas/login">Login</a></li>
@ -19,7 +19,7 @@
</div> </div>
</div> </div>
<div class="navbar primary"> <div class="navbar primary">
<div class="navbar-inner clearfix" data-ng-controller="RealmDropdownCtrl"> <div class="navbar-inner clearfix container" data-ng-controller="RealmDropdownCtrl">
<ul class="nav pull-left"> <ul class="nav pull-left">
<li> <li>
<span class="dropdown-label" data-ng-show="showNav()">Realm:</span> <span class="dropdown-label" data-ng-show="showNav()">Realm:</span>