keycloak-aplcache
Changes
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/admin-console.less 333(+215 -118)
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/customer-login-screen-bg.jpg 0(+0 -0)
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/customer-login-screen-bg.svg 164(+0 -164)
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/customer-login-screen-bg2.jpg 0(+0 -0)
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/icon-row-selected.png 0(+0 -0)
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/icon-sidebar-active.png 0(+0 -0)
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/icon-sidebar-active.svg 7(+7 -0)
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/login-register-email-separator.png 0(+0 -0)
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/login-register-separator.png 0(+0 -0)
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/login-register-social-separators.png 0(+0 -0)
Details
diff --git a/admin-ui/src/main/resources/META-INF/resources/admin/partials/menu.html b/admin-ui/src/main/resources/META-INF/resources/admin/partials/menu.html
index 52e3d86..4ae72a7 100755
--- a/admin-ui/src/main/resources/META-INF/resources/admin/partials/menu.html
+++ b/admin-ui/src/main/resources/META-INF/resources/admin/partials/menu.html
@@ -1,6 +1,6 @@
<div class="header rcue">
<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>
<ul class="nav pull-right" data-ng-hide="auth.loggedIn">
<li><a href="/auth-server/rest/saas/login">Login</a></li>
@@ -19,7 +19,7 @@
</div>
</div>
<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">
<li>
<span class="dropdown-label" data-ng-show="showNav()">Realm:</span>
diff --git a/admin-ui/src/main/resources/META-INF/resources/admin/partials/role-mappings.html b/admin-ui/src/main/resources/META-INF/resources/admin/partials/role-mappings.html
index be3535c..642808f 100755
--- a/admin-ui/src/main/resources/META-INF/resources/admin/partials/role-mappings.html
+++ b/admin-ui/src/main/resources/META-INF/resources/admin/partials/role-mappings.html
@@ -54,7 +54,7 @@
<div class="input-group">
<div class="select-rcue">
<select id="applications" name="applications" ng-change="changeApplication()" ng-model="application" ng-options="a.name for a in applications">
- <option value="" selected> Select an Application </option>
+ <option value="" selected> Select an Application...</option>
</select>
</div>
</div>
diff --git a/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/admin-console.css b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/admin-console.css
index 67e9402..c339f2f 100644
--- a/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/admin-console.css
+++ b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/admin-console.css
@@ -44,91 +44,139 @@ body {
background-color: #e4f3fa;
}
/* 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 {
min-height: 42px;
+ max-width: 1170px;
+}
+.header.rcue .navbar.primary .select-rcue {
+ 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.png);
+ background-repeat: no-repeat;
+ background-position: right -26px;
+ border: 1px solid #676c6e;
+ border-radius: 2px;
+ padding-left: 0;
+}
+.header.rcue .navbar.primary .select-rcue:hover {
+ border-color: #7e8385;
+}
+.header.rcue .navbar.primary .select-rcue select {
+ color: #fff;
+}
+.header.rcue .navbar.primary .select-rcue select:-moz-focusring {
+ color: transparent;
+ text-shadow: 0 0 0 #fff;
+}
+.header.rcue .navbar.primary .select-rcue select option {
+ background-color: #fff;
+ color: #333;
+ padding: 0.36363636363636em 0.90909090909091em;
}
.header.rcue .navbar.primary .nav > li {
/*
- .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;
+ .dropdown {
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.png) no-repeat right -26px;
- display: block;
+ margin-left: 0.53846153846154em;
+ margin-top: 0.46153846153846em;
+ min-width: 15.3846153846154em;
+ width: auto;
- &:hover,
- &:focus {
- text-decoration: none;
+ .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;
+ }
}
- &:hover {
- border-color: #7e8385;
- }
- }
-
- .dropdown-menu {
-
- left: 0;
- min-width: 0;
- width: 100%;
- overflow: hidden;
-
- li,
- li.selected {
- width: auto;
-
- a {
+ .dropdown-menu {
+
+ left: 0;
+ min-width: 0;
+ width: 100%;
+ overflow: hidden;
+
+ li,
+ li.selected {
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;
+ 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 {
+ 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;
+ }
}
-
- 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 {
@@ -147,7 +195,7 @@ body {
vertical-align: middle;
background-color: #555a5e;
background-image: none;
- background-image: url(img/sprite-arrow-down.png);
+ background-image: url(img/sprite-arrow-down.svg);
background-repeat: no-repeat;
background-position: right -26px;
border: 1px solid #676c6e;
@@ -207,11 +255,12 @@ body {
}
.bs-sidebar ul li {
margin-bottom: 0.5em;
+ margin-left: -1em;
}
.bs-sidebar ul li a {
font-size: 1.3em;
font-family: "Open Sans", sans-serif;
- padding-left: 3em;
+ padding-left: 1.92307692307692em;
color: #4d5258;
line-height: 2.07692307692308em;
display: block;
@@ -219,7 +268,8 @@ body {
border-style: solid;
border-color: #f9f9f9;
}
-.bs-sidebar ul li a:hover {
+.bs-sidebar ul li a:hover,
+.bs-sidebar ul li a:focus {
text-decoration: none;
color: #777777;
}
@@ -227,6 +277,9 @@ body {
background-color: #c7e5f0;
border-color: #56bae0;
font-weight: bold;
+ background-image: url(img/icon-sidebar-active.svg);
+ background-repeat: no-repeat;
+ background-position: right center;
}
#content-area {
padding: 0;
@@ -530,20 +583,37 @@ table.list tbody tr.expanded .form-actions {
}
/* Break Points */
@media (max-width: 1200px) {
+ .header.rcue .navbar.utility .navbar-inner,
+ .header.rcue .navbar.primary .navbar-inner {
+ max-width: 970px;
+ }
#container-right-bg {
margin-left: 242.5px;
width: 727.5px;
}
}
@media (max-width: 992px) {
+ .header.rcue .navbar.utility .navbar-inner,
+ .header.rcue .navbar.primary .navbar-inner {
+ max-width: 750px;
+ }
.bs-sidebar,
.user .bs-sidebar {
- padding-top: 2em;
+ padding-top: 1em;
width: 100%;
}
+ .bs-sidebar ul li,
+ .user .bs-sidebar ul li {
+ margin-left: 0;
+ }
.bs-sidebar ul li a,
.user .bs-sidebar ul li a {
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 {
border-top: 1px solid #cecece;
@@ -557,8 +627,17 @@ table.list tbody tr.expanded .form-actions {
}
}
@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 {
- min-width: 580px;
+ min-width: 56em;
}
#content-area {
border: none;
diff --git a/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/admin-console.less b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/admin-console.less
index f106fd8..4cca051 100644
--- a/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/admin-console.less
+++ b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/admin-console.less
@@ -63,21 +63,30 @@ body {
/* Header */
-.header.rcue .navbar.primary {
+.header.rcue {
- .navbar-inner {
- min-height: 42px;
+ .navbar.utility {
+ background-color: #393F45;
+ border-bottom: 1px solid #53565B;
+
+ .navbar-inner {
+ border-bottom: 0;
+ max-width: 1170px;
+ }
}
-
- .nav > li {
-
- .dropdown-label {
- font-size: 0.84615384615385em;
- color: #dbdada;
- margin-left: 1.36363636363636em;
- float: left;
- margin-top: 0.63636363636364em;
- line-height: 2.36363636363636em
+
+ .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;
+
+ .navbar-inner {
+ min-height: 42px;
+ max-width: 1170px;
}
.select-rcue {
@@ -115,126 +124,172 @@ body {
}
}
- 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;
+ .nav > li {
+
+ .dropdown-label {
+ font-size: 0.84615384615385em;
+ color: #dbdada;
+ margin-left: 1.36363636363636em;
+ float: left;
+ margin-top: 0.63636363636364em;
+ line-height: 2.36363636363636em
}
-
- .icon-spinner6 {
- margin-right: 0;
- background-image: url('img/sprites-gray.png');
+
+ .select-rcue {
+ 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 {
- background-image: url('img/sprites-white.png');
- background-color: transparent;
+ 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;
+ }
}
}
- }
-
-/*
- .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;
+ a#refresh {
+ border: none;
+ margin: 0;
+ padding: 0;
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.png) no-repeat right -26px;
- display: block;
+ vertical-align: middle;
+ font-size: 0.76923076923077em;
+ margin-left: 1em;
+ margin-top: 0.7em;
- &:hover,
- &:focus {
- text-decoration: none;
+ &:hover {
+ background: none;
}
- &:hover {
- border-color: #7e8385;
+ .icon-spinner6 {
+ margin-right: 0;
+ background-image: url('img/sprites-gray.png');
+
+ &:hover {
+ background-image: url('img/sprites-white.png');
+ background-color: transparent;
+ }
}
}
- .dropdown-menu {
-
- left: 0;
- min-width: 0;
- width: 100%;
- overflow: hidden;
-
- li,
- li.selected {
- width: auto;
+ /*
+ .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;
+ 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;
+ }
- a {
+ &:hover {
+ border-color: #7e8385;
+ }
+ }
+
+ .dropdown-menu {
+
+ left: 0;
+ min-width: 0;
+ width: 100%;
+ overflow: hidden;
+
+ li,
+ li.selected {
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;
+ 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 {
+ 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;
+ }
}
-
- 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 {
+ .button {
+ font-size: 0.84615384615385em;
+ margin-right: 1.36363636363636em;
+ margin-top: 0.63636363636364em;
+
+ &:focus {
text-decoration: none;
- box-shadow: inset 0px 2px 5px rgba(0,0,0,0.2);
- border-color: #7e8385;
}
}
-*/
- }
-
- .button {
- font-size: 0.84615384615385em;
- margin-right: 1.36363636363636em;
- margin-top: 0.63636363636364em;
-
- &:focus {
- text-decoration: none;
- }
}
}
-
.bs-sidebar {
background-color: @bg-grey;
padding-top: 4.3em;
@@ -244,11 +299,12 @@ body {
ul li {
margin-bottom: 0.5em;
+ margin-left: -1em;
a {
font-size: 1.3em;
font-family: @open-sans;
- padding-left: 3em;
+ padding-left: 1.92307692307692em;
color: @text-black;
line-height: 2.07692307692308em;
display: block;
@@ -256,7 +312,8 @@ body {
border-style: solid;
border-color: @bg-grey;
- &:hover {
+ &:hover,
+ &:focus {
text-decoration: none;
color: @text-grey;
}
@@ -266,6 +323,9 @@ body {
background-color: #c7e5f0;
border-color: #56bae0;
font-weight: bold;
+ background-image: url(img/icon-sidebar-active.svg);
+ background-repeat: no-repeat;
+ background-position: right center;
}
}
}
@@ -663,6 +723,14 @@ table.list {
@media (max-width: 1200px) {
+ .header.rcue {
+
+ .navbar.utility .navbar-inner,
+ .navbar.primary .navbar-inner {
+ max-width: 970px;
+ }
+ }
+
#container-right-bg {
margin-left: 242.5px;
width: 727.5px;
@@ -671,14 +739,32 @@ table.list {
@media (max-width: 992px) {
+ .header.rcue {
+
+ .navbar.utility .navbar-inner,
+ .navbar.primary .navbar-inner {
+ max-width: 750px;
+ }
+ }
+
.bs-sidebar,
.user .bs-sidebar {
- padding-top: 2em;
+ padding-top: 1em;
width: 100%;
- ul li a {
- border-width: 1px;
- }
+ ul li {
+
+ margin-left: 0;
+
+ a {
+ border-width: 1px;
+ padding-left: 1.53846153846154em;
+ }
+
+ &.active a {
+ background-image: none;
+ }
+ }
}
#content-area .top-nav {
@@ -698,8 +784,25 @@ table.list {
@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 {
- min-width: 580px;
+ min-width: 56em;
}
#content-area {
@@ -711,9 +814,3 @@ table.list {
width: 100%;
}
}
-
-
-
-
-
-
diff --git a/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/forms.css b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/forms.css
index b8d3066..8d99830 100644
--- a/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/forms.css
+++ b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/forms.css
@@ -55,6 +55,25 @@ textarea {
padding: 0.45em 0.545454545454545em;
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 {
clear: both;
display: inline-block;
@@ -235,9 +254,14 @@ button.primary:focus,
right: 0.2em;
top: 0.4em;
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;
+ filter: alpha(opacity=100);
-webkit-transition: ease-in-out opacity 0.25s;
-moz-transition: ease-in-out opacity 0.25s;
-o-transition: ease-in-out opacity 0.25s;
diff --git a/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/forms.less b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/forms.less
index e666300..c965f0e 100644
--- a/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/forms.less
+++ b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/forms.less
@@ -56,6 +56,22 @@ textarea {
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 {
clear: both;
display: inline-block;
@@ -266,9 +282,14 @@ button.primary,
right: 0.2em;
top: 0.4em;
opacity: 0.5;
+ filter: alpha(opacity=50);
- &:hover {
+ &:hover,
+ &:active,
+ &:focus {
+ background-image: url('img/sprites.png');
opacity: 1;
+ filter: alpha(opacity=100);
-webkit-transition: ease-in-out opacity 0.25s;
-moz-transition: ease-in-out opacity 0.25s;
-o-transition: ease-in-out opacity 0.25s;
diff --git a/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/icon-row-selected.png b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/icon-row-selected.png
new file mode 100644
index 0000000..3832bb2
Binary files /dev/null and b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/icon-row-selected.png differ
diff --git a/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/icon-sidebar-active.png b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/icon-sidebar-active.png
new file mode 100644
index 0000000..e7b9b08
Binary files /dev/null and b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/icon-sidebar-active.png differ
diff --git a/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/icon-sidebar-active.svg b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/icon-sidebar-active.svg
new file mode 100644
index 0000000..3b7539d
--- /dev/null
+++ b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/icon-sidebar-active.svg
@@ -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>
diff --git a/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/login-register-email-separator.png b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/login-register-email-separator.png
new file mode 100644
index 0000000..b8deca4
Binary files /dev/null and b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/login-register-email-separator.png differ
diff --git a/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/login-register-separator.png b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/login-register-separator.png
new file mode 100644
index 0000000..d626a45
Binary files /dev/null and b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/login-register-separator.png differ
diff --git a/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/login-register-social-separators.png b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/login-register-social-separators.png
index 94d2026..3f08929 100644
Binary files a/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/login-register-social-separators.png and b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/login-register-social-separators.png differ
diff --git a/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/tooltip-box-arrow-right-up.png b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/tooltip-box-arrow-right-up.png
new file mode 100644
index 0000000..5b5174d
Binary files /dev/null and b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/tooltip-box-arrow-right-up.png differ
diff --git a/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/login-register.css b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/login-register.css
index 081ccd8..edb5894 100644
--- a/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/login-register.css
+++ b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/login-register.css
@@ -10,6 +10,14 @@ body {
background-size: auto;
background-repeat: no-repeat;
color: #fff;
+ /*
+ .form-area {
+ background-image: url(img/login-register-separator.svg);
+ background-repeat: no-repeat;
+ background-position: 40.2em center;
+ }
+ */
+
/* Login area */
/* Social login area */
@@ -60,11 +68,6 @@ body {
.rcue-login-register .background-area section:first-child {
padding-right: 4.5em;
}
-.rcue-login-register .form-area {
- background-image: url(img/login-register-separator.svg);
- background-repeat: no-repeat;
- background-position: 40.2em center;
-}
.rcue-login-register .form-area.social {
background-image: url(img/login-register-social-separators.svg);
background-position: 39.6em center;
@@ -138,6 +141,9 @@ body {
top: -9.2em;
min-width: 35em;
}
+.rcue-login-register.reset .feedback {
+ left: 35.7em;
+}
.rcue-login-register section.social-login > span {
display: none;
}
diff --git a/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/login-register.less b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/login-register.less
index 8c33302..33c5e76 100644
--- a/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/login-register.less
+++ b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/login-register.less
@@ -65,11 +65,13 @@ body {
}
+ /*
.form-area {
background-image: url(img/login-register-separator.svg);
background-repeat: no-repeat;
background-position: 40.2em center;
}
+ */
.form-area.social {
background-image: url(img/login-register-social-separators.svg);
@@ -147,6 +149,10 @@ body {
min-width: 35em;
}
+ &.reset .feedback {
+ left: 35.7em;
+ }
+
/* Social login area */
diff --git a/forms/src/main/resources/META-INF/resources/forms/theme/default/css/login-register.css b/forms/src/main/resources/META-INF/resources/forms/theme/default/css/login-register.css
index 488259d..8fa9b44 100644
--- a/forms/src/main/resources/META-INF/resources/forms/theme/default/css/login-register.css
+++ b/forms/src/main/resources/META-INF/resources/forms/theme/default/css/login-register.css
@@ -51,20 +51,24 @@ body {
}
.rcue-login-register .background-area .section {
float: left;
- padding: 1.5em 4.5em 1.5em 4.6em;
+ padding: 0 4.5em 0 4.6em;
width: auto;
position: relative;
}
+.rcue-login-register .background-area .separator .section {
+ padding-top: 1.5em;
+ padding-bottom: 1.5em;
+}
.rcue-login-register .background-area .section h3 {
display: none;
}
.rcue-login-register .background-area .section:first-child {
padding-right: 4.5em;
}
-.rcue-login-register .form-area {
+.rcue-login-register .form-area.separator {
background-image: url(img/login-register-separator.png);
background-repeat: no-repeat;
- background-position: 40.2em center;
+ background-position: 43.2em center;
}
.rcue-login-register .form-area.social {
background-image: url(img/login-register-social-separators.png);
@@ -89,9 +93,7 @@ body {
font-weight: 400;
}
.rcue-login-register label {
- width: 6.07142857142857em;
- /* 85px */
-
+ width: 8.21428571428571em;
}
.rcue-login-register label.two-lines {
float: left;
@@ -107,12 +109,8 @@ body {
.rcue-login-register form > div.aside-btn {
float: left;
font-size: 1.1em;
- margin-left: 7.72727272727273em;
- /* 85px */
-
+ margin-left: 10.4545454545454em;
margin-top: 0.90909090909091em;
- /* 10px */
-
margin-bottom: 0;
}
.rcue-login-register form > div.aside-btn label {
@@ -143,6 +141,9 @@ body {
top: -9.2em;
min-width: 35em;
}
+.rcue-login-register.reset .feedback.bottom-left {
+ left: 35.7em;
+}
.rcue-login-register input.error[type="text"],
.rcue-login-register input.error[type="password"],
.rcue-login-register input.error[type="email"] {
@@ -281,19 +282,13 @@ a.zocial:before {
color: #0099D3;
}
/* Forgot Password page */
-.rcue-login-register.reset .background-area .section {
- padding-top: 0;
- padding-bottom: 0;
-}
.rcue-login-register.reset .background-area .section.app-form {
width: 43.2em;
}
-
.rcue-login-register.oauth .form-actions {
margin-bottom: 0;
margin-top: 2em;
}
-
.rcue-login-register .background-area .content-area {
width: 50em;
}
@@ -342,7 +337,7 @@ a.zocial:before {
font-size: 1.3em;
}
-.rcue-login-register.reset .form-area, .rcue-login-register.totp .form-area {
+.rcue-login-register.totp .form-area {
background-image: none;
}
.rcue-login-register.reset .form-area p.instruction {
@@ -350,9 +345,6 @@ a.zocial:before {
line-height: 1.3em;
margin-bottom: 1.81818181818182em;
}
-.rcue-login-register.reset label {
- width: 8.21428571428571em;
-}
.rcue-login-register.totp {
min-height: 0;
}
diff --git a/forms/src/main/resources/META-INF/resources/forms/theme/default/login.ftl b/forms/src/main/resources/META-INF/resources/forms/theme/default/login.ftl
index 7e63046..2b24b4c 100755
--- a/forms/src/main/resources/META-INF/resources/forms/theme/default/login.ftl
+++ b/forms/src/main/resources/META-INF/resources/forms/theme/default/login.ftl
@@ -13,13 +13,12 @@
<div id="form">
<form action="${url.loginAction}" method="post">
<div>
- <label for="username">${rb.getString('username')}</label>
- <input id="username" name="username" value="${login.username!''}" type="text" />
+ <label for="username">${rb.getString('username')}</label><input id="username" name="username" value="${login.username!''}" type="text" />
</div>
<#list login.requiredCredentials as c>
<div>
- <label for="${c.name}">${rb.getString(c.label)}</label> <input id="${c.name}" name="${c.name}" type="${c.inputType}" />
+ <label for="${c.name}">${rb.getString(c.label)}</label><input id="${c.name}" name="${c.name}" type="${c.inputType}" />
</div>
</#list>
diff --git a/forms/src/main/resources/META-INF/resources/forms/theme/default/login-reset-password.ftl b/forms/src/main/resources/META-INF/resources/forms/theme/default/login-reset-password.ftl
index af308ac..96f8795 100755
--- a/forms/src/main/resources/META-INF/resources/forms/theme/default/login-reset-password.ftl
+++ b/forms/src/main/resources/META-INF/resources/forms/theme/default/login-reset-password.ftl
@@ -23,9 +23,6 @@
</form>
</div>
<#elseif section = "info" >
-
- <div id="info">
- </div>
-
+ <p><a href="#">« Back to Login</a></p>
</#if>
</@layout.registrationLayout>
\ No newline at end of file
diff --git a/forms/src/main/resources/META-INF/resources/forms/theme/default/login-totp.ftl b/forms/src/main/resources/META-INF/resources/forms/theme/default/login-totp.ftl
index 253ab75..0d884f6 100755
--- a/forms/src/main/resources/META-INF/resources/forms/theme/default/login-totp.ftl
+++ b/forms/src/main/resources/META-INF/resources/forms/theme/default/login-totp.ftl
@@ -16,8 +16,7 @@
<input id="password" name="password" value="${login.password!''}" type="hidden" />
<div>
- <label for="totp">${rb.getString('authenticatorCode')}</label>
- <input id="totp" name="totp" type="text" />
+ <label for="totp">${rb.getString('authenticatorCode')}</label><input id="totp" name="totp" type="text" />
</div>
<div class="aside-btn">
diff --git a/forms/src/main/resources/META-INF/resources/forms/theme/default/login-update-password.ftl b/forms/src/main/resources/META-INF/resources/forms/theme/default/login-update-password.ftl
index 4db1911..74142e0 100755
--- a/forms/src/main/resources/META-INF/resources/forms/theme/default/login-update-password.ftl
+++ b/forms/src/main/resources/META-INF/resources/forms/theme/default/login-update-password.ftl
@@ -16,7 +16,7 @@
<label for="password-new">${rb.getString('passwordNew')}</label><input type="password" id="password-new" name="password-new" />
</div>
<div>
- <label for="password-confirm">${rb.getString('passwordConfirm')}</label><input type="password" id="password-confirm" name="password-confirm" />
+ <label for="password-confirm" class="two-lines">${rb.getString('passwordConfirm')}</label><input type="password" id="password-confirm" name="password-confirm" />
</div>
<input class="btn-primary" type="submit" value="Submit" />
diff --git a/forms/src/main/resources/META-INF/resources/forms/theme/default/login-update-profile.ftl b/forms/src/main/resources/META-INF/resources/forms/theme/default/login-update-profile.ftl
index 2683d2f..32bdd23 100755
--- a/forms/src/main/resources/META-INF/resources/forms/theme/default/login-update-profile.ftl
+++ b/forms/src/main/resources/META-INF/resources/forms/theme/default/login-update-profile.ftl
@@ -21,16 +21,13 @@
</div>
<p class="subtitle">All fields required</p>
<div>
- <label for="email">${rb.getString('email')}</label>
- <input type="text" id="email" name="email" value="${user.email!''}" />
+ <label for="email">${rb.getString('email')}</label><input type="text" id="email" name="email" value="${user.email!''}" />
</div>
<div>
- <label for="firstName">${rb.getString('firstName')}</label>
- <input type="text" id="firstName" name="firstName" value="${user.firstName!''}" />
+ <label for="firstName">${rb.getString('firstName')}</label><input type="text" id="firstName" name="firstName" value="${user.firstName!''}" />
</div>
<div>
- <label for="lastName">${rb.getString('lastName')}</label>
- <input type="text" id="lastName" name="lastName" value="${user.lastName!''}" />
+ <label for="lastName">${rb.getString('lastName')}</label><input type="text" id="lastName" name="lastName" value="${user.lastName!''}" />
</div>
<div class="aside-btn">
diff --git a/forms/src/main/resources/META-INF/resources/forms/theme/default/register.ftl b/forms/src/main/resources/META-INF/resources/forms/theme/default/register.ftl
index c9b5997..8cf59a4 100755
--- a/forms/src/main/resources/META-INF/resources/forms/theme/default/register.ftl
+++ b/forms/src/main/resources/META-INF/resources/forms/theme/default/register.ftl
@@ -14,28 +14,22 @@
<form action="${url.registrationAction}" method="post">
<p class="subtitle">${rb.getString('allRequired')}</p>
<div>
- <label for="firstName">${rb.getString('firstName')}</label>
- <input type="text" id="firstName" name="firstName" value="${register.formData.firstName!''}" />
+ <label for="firstName">${rb.getString('firstName')}</label><input type="text" id="firstName" name="firstName" value="${register.formData.firstName!''}" />
</div>
<div>
- <label for="lastName">${rb.getString('lastName')}</label>
- <input type="text" id="lastName" name="lastName" value="${register.formData.lastName!''}" />
+ <label for="lastName">${rb.getString('lastName')}</label><input type="text" id="lastName" name="lastName" value="${register.formData.lastName!''}" />
</div>
<div>
- <label for="email">${rb.getString('email')}</label>
- <input type="text" id="email" name="email" value="${register.formData.email!''}" />
+ <label for="email">${rb.getString('email')}</label><input type="text" id="email" name="email" value="${register.formData.email!''}" />
</div>
<div>
- <label for="username">${rb.getString('username')}</label>
- <input type="text" id="username" name="username" value="${register.formData.username!''}" />
+ <label for="username">${rb.getString('username')}</label><input type="text" id="username" name="username" value="${register.formData.username!''}" />
</div>
<div>
- <label for="password">${rb.getString('password')}</label>
- <input type="password" id="password" name="password" />
+ <label for="password">${rb.getString('password')}</label><input type="password" id="password" name="password" />
</div>
<div>
- <label for="password-confirm">${rb.getString('passwordConfirm')}</label>
- <input type="password" id="password-confirm" name="password-confirm" />
+ <label for="password-confirm">${rb.getString('passwordConfirm')}</label><input type="password" id="password-confirm" name="password-confirm" />
</div>
<div class="aside-btn">
diff --git a/forms/src/main/resources/META-INF/resources/forms/theme/default/template-login.ftl b/forms/src/main/resources/META-INF/resources/forms/theme/default/template-login.ftl
index d64a3c6..acbb082 100644
--- a/forms/src/main/resources/META-INF/resources/forms/theme/default/template-login.ftl
+++ b/forms/src/main/resources/META-INF/resources/forms/theme/default/template-login.ftl
@@ -18,7 +18,7 @@
<body class="rcue-login-register ${bodyClass}">
<#if (template.themeConfig.logo)?has_content>
<h1>
- <a href="#" title="Go to the home page"><img src="${template.themeConfig.logo}" alt="Logo" /></a>
+ <a href="#" title="Go to the login page"><img src="${template.themeConfig.logo}" alt="Red Hat Logo" /></a>
</h1>
</#if>
diff --git a/forms/src/main/resources/META-INF/resources/forms/theme/default/template-login-action.ftl b/forms/src/main/resources/META-INF/resources/forms/theme/default/template-login-action.ftl
index 303aeeb..982b31f 100644
--- a/forms/src/main/resources/META-INF/resources/forms/theme/default/template-login-action.ftl
+++ b/forms/src/main/resources/META-INF/resources/forms/theme/default/template-login-action.ftl
@@ -25,7 +25,7 @@
</div>
<#if (template.themeConfig.logo)?has_content>
<h1>
- <a href="#" title="Go to the home page"><img src="${template.themeConfig.logo}" alt="Logo" /></a>
+ <a href="#" title="Go to the login page"><img src="${template.themeConfig.logo}" alt="Red Hat Logo" /></a>
</h1>
</#if>
diff --git a/forms/src/main/resources/org/keycloak/forms/messages.properties b/forms/src/main/resources/org/keycloak/forms/messages.properties
index 7c8b05f..be120c2 100644
--- a/forms/src/main/resources/org/keycloak/forms/messages.properties
+++ b/forms/src/main/resources/org/keycloak/forms/messages.properties
@@ -15,7 +15,7 @@ firstName=First name
lastName=Last name
email=Email
password=Password
-passwordConfirm=Confirm Password
+passwordConfirm=Password confirmation
passwordNew=New Password
passwordNewConfirm=New Password confirmation