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

Final design adjustments

Browse source
This commit is contained in:
Gabriel Cardoso 2013-10-18 18:34:14 -03:00
parent 07107220ae
commit 0dc9036a4c
22 changed files with 5121 additions and 4883 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -12,20 +12,16 @@ body {
.header.rcue .navbar.primary .navbar-inner {
min-height: 42px;
}
.header.rcue .navbar.primary .nav > li .dropdown-label {
font-size: 0.84615384615385em;
color: #dbdada;
margin-left: 1.36363636363636em;
display: inline-block;
}
.header.rcue .navbar.primary .nav > li .dropdown {
.header.rcue .navbar.primary .nav > li {
/*
.dropdown {
display: inline-block;
margin-left: 0.53846153846154em;
margin-top: 0.46153846153846em;
min-width: 15.3846153846154em;
width: auto;
}
.header.rcue .navbar.primary .nav > li .dropdown .dropdown-toggle {
.dropdown-toggle {
font-size: 0.84615384615385em;
color: #fff;
display: inline-block;
@ -35,53 +31,128 @@ body {
padding: 0 0.54545454545455em;
background: #555a5e url(img/sprite-arrow-down.svg) no-repeat right -26px;
display: block;
}
.header.rcue .navbar.primary .nav > li .dropdown .dropdown-toggle:hover,
.header.rcue .navbar.primary .nav > li .dropdown .dropdown-toggle:focus {
&:hover,
&:focus {
text-decoration: none;
}
.header.rcue .navbar.primary .nav > li .dropdown .dropdown-toggle:hover {
}
&:hover {
border-color: #7e8385;
}
.header.rcue .navbar.primary .nav > li .dropdown .dropdown-menu {
}
}
.dropdown-menu {
left: 0;
min-width: 0;
width: 100%;
overflow: hidden;
}
.header.rcue .navbar.primary .nav > li .dropdown .dropdown-menu li,
.header.rcue .navbar.primary .nav > li .dropdown .dropdown-menu li.selected {
li,
li.selected {
width: auto;
}
.header.rcue .navbar.primary .nav > li .dropdown .dropdown-menu li a,
.header.rcue .navbar.primary .nav > li .dropdown .dropdown-menu li.selected a {
a {
width: auto;
border-top: 1px solid transparent;
border-bottom: 1px solid transparent;
}
.header.rcue .navbar.primary .nav > li .dropdown .dropdown-menu li a:hover,
.header.rcue .navbar.primary .nav > li .dropdown .dropdown-menu li.selected a:hover {
&:hover {
background-color: #D5ECF9;
background-image: none;
border-bottom: 1px solid #A7D7F1;
border-top: 1px solid #A7D7F1;
color: #4D5258;
}
.header.rcue .navbar.primary .nav > li .dropdown .dropdown-menu li.selected a {
}
}
}
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, #2ea1ca), color-stop(1, 0, #2792b6));
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;
}
.header.rcue .navbar.primary .nav > li .dropdown.open .dropdown-toggle {
}
}
&.open .dropdown-toggle {
text-decoration: none;
box-shadow: inset 0px 2px 5px rgba(0, 0, 0, 0.2);
box-shadow: inset 0px 2px 5px rgba(0,0,0,0.2);
border-color: #7e8385;
}
}
*/
}
.header.rcue .navbar.primary .nav > li .dropdown-label {
font-size: 0.84615384615385em;
color: #dbdada;
margin-left: 1.36363636363636em;
float: left;
margin-top: 0.63636363636364em;
line-height: 2.36363636363636em;
}
.header.rcue .navbar.primary .nav > li .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;
}
.header.rcue .navbar.primary .nav > li .select-rcue:hover {
border-color: #7e8385;
}
.header.rcue .navbar.primary .nav > li .select-rcue select {
color: #fff;
}
.header.rcue .navbar.primary .nav > li .select-rcue select:-moz-focusring {
color: transparent;
text-shadow: 0 0 0 #fff;
}
.header.rcue .navbar.primary .nav > li .select-rcue select option {
background-color: #fff;
color: black;
padding: 4px 10px;
}
.header.rcue .navbar.primary .nav > li a#refresh {
border: none;
margin: 0;
padding: 0;
float: right;
font-size: 0.76923076923077em;
margin-left: 1em;
margin-top: 1.4em;
}
.header.rcue .navbar.primary .nav > li a#refresh:hover {
background: none;
}
.header.rcue .navbar.primary .nav > li a#refresh .icon-spinner6 {
margin-right: 0;
background-image: url('img/sprites-gray.png');
}
.header.rcue .navbar.primary .nav > li a#refresh .icon-spinner6:hover {
background-image: url('img/sprites-white.png');
background-color: transparent;
}
.header.rcue .navbar.primary .button {
font-size: 0.84615384615385em;

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

@ -34,9 +34,71 @@ body {
font-size: 0.84615384615385em;
color: #dbdada;
margin-left: 1.36363636363636em;
display: inline-block;
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;
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 {
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;
}
}
}
a#refresh {
border: none;
margin: 0;
padding: 0;
float: right;
font-size: 0.76923076923077em;
margin-left: 1em;
margin-top: 1.4em;
&: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;
@ -116,6 +178,7 @@ body {
border-color: #7e8385;
}
}
*/
}
.button {

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

@ -6,9 +6,14 @@ fieldset {
color: #838383;
font-style: italic;
}
select:-moz-focusring {
color: transparent;
text-shadow: 0 0 0 #333;
}
input[type="text"],
input[type="password"],
input[type="email"] {
input[type="email"],
textarea {
font-size: 1.1em;
padding: 0 0.545454545454545em;
min-width: 18.1818181818182em;
@ -20,18 +25,21 @@ input[type="email"] {
}
input[type="text"]:hover,
input[type="password"]:hover,
input[type="email"]:hover {
input[type="email"]:hover,
textarea:hover {
border-color: #62afdb;
}
input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus {
input[type="email"]:focus,
textarea:focus {
border-color: #62afdb;
box-shadow: #62afdb 0 0 5px;
}
input[type="text"].error,
input[type="password"].error,
input[type="email"].error {
input[type="email"].error,
textarea.error {
border-color: #ba1212;
transition: all 0.33s ease-in-out;
-moz-transition: all 0.33s ease-in-out;
@ -39,9 +47,14 @@ input[type="email"].error {
}
input[type="text"].error:focus,
input[type="password"].error:focus,
input[type="email"].error:focus {
input[type="email"].error:focus,
textarea.error:focus {
box-shadow: 0 0 5px #ba1212;
}
textarea {
padding: 0.45em 0.545454545454545em;
height: auto;
}
input[type="button"],
button,
a.button {
@ -164,6 +177,23 @@ button.primary:enabled:active,
background-color: #0099d4;
box-shadow: inset 0 0 5px 3px #0074ae;
}
.destructive {
background-image: linear-gradient(top, #d90000 0%, #ad0101 100%);
background-image: -o-linear-gradient(top, #d90000 0%, #ad0101 100%);
background-image: -moz-linear-gradient(top, #d90000 0%, #ad0101 100%);
background-image: -webkit-linear-gradient(top, #d90000 0%, #ad0101 100%);
background-image: -ms-linear-gradient(top, #d90000 0%, #ad0101 100%);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #d90000), color-stop(1, 0, #ad0101));
border-color: #350000;
color: #FFFFFF;
}
.destructive:hover {
background-color: #AD0101;
}
.destructive:enabled:active {
background-color: #AD0101;
box-shadow: 0 0 5px 3px #750101 inset;
}
/* Code from Gabriel */
button.primary,
.button.primary {
@ -278,6 +308,24 @@ button.primary:focus,
background-image: url(img/feedback-warning-sign.svg);
background-color: #fef1e9;
}
.feedback.info p {
border-color: #5994b2;
background-image: url(img/feedback-info-sign.svg);
background-color: #e4f3fa;
}
.feedback.inline {
opacity: 1;
position: relative;
margin-bottom: 20px;
}
.feedback.inline p {
border-width: 1px;
}
.feedback .button {
display: inline-block;
font-size: 0.90909090909091em;
margin-left: 0.90909090909091em;
}
button,
a.button {
background-color: #eeeeee;

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

@ -11,10 +11,16 @@ fieldset {
font-style: italic;
}
select:-moz-focusring {
color: transparent;
text-shadow: 0 0 0 #333;
}
input[type="text"],
input[type="password"],
input[type="email"],
{
textarea {
font-size: 1.1em;
padding: 0 0.545454545454545em;
min-width: 18.1818181818182em;
@ -45,6 +51,11 @@ input[type="email"],
}
}
textarea {
padding: 0.45em 0.545454545454545em;
height: auto;
}
input[type="button"],
button,
a.button {
@ -180,6 +191,32 @@ button.primary:enabled:active,
box-shadow: inset 0 0 5px 3px #0074ae;
}
.destructive {
background-image: linear-gradient(top, #D90000 0%, #AD0101 100%);
background-image: -o-linear-gradient(top, #D90000 0%, #AD0101 100%);
background-image: -moz-linear-gradient(top, #D90000 0%, #AD0101 100%);
background-image: -webkit-linear-gradient(top, #D90000 0%, #AD0101 100%);
background-image: -ms-linear-gradient(top, #D90000 0%, #AD0101 100%);
background-image: -webkit-gradient(
linear,
left top,
left bottom,
color-stop(0.0, #D90000),
color-stop(1,0, #AD0101)
);
border-color: #350000;
color: #FFFFFF;
&:hover {
background-color: #AD0101;
}
&:enabled:active {
background-color: #AD0101;
box-shadow: 0 0 5px 3px #750101 inset;
}
}
/* Code from Gabriel */
@ -320,6 +357,32 @@ button.primary,
}
}
&.info {
p {
border-color: #5994b2;
background-image: url(img/feedback-info-sign.svg);
background-color: #e4f3fa;
}
}
&.inline {
opacity: 1;
position: relative;
margin-bottom: 20px;
p {
border-width: 1px;
}
}
.button {
display: inline-block;
font-size: 0.90909090909091em;
margin-left: 0.90909090909091em;
}
}
button,

BIN
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/feedback-info-sign.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 402 B

22
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/feedback-info-sign.svg Normal file
View file

@ -0,0 +1,22 @@
<?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="svg7384" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="17px" height="17px" viewBox="0 0 17 17" enable-background="new 0 0 17 17" xml:space="preserve">
<g>
<g>
<g>
<path fill="#418093" d="M8.24,12.734c-0.544,0.018-1.048-0.486-1.031-1.031V7.766c-0.007-0.527,0.473-1.014,1-1.014
c0.528,0,1.008,0.486,1,1.014v3.938c0.008,0.467-0.354,0.914-0.813,1C8.345,12.719,8.292,12.729,8.24,12.734L8.24,12.734z"/>
</g>
<g>
<rect x="7.208" y="3.766" fill="#418093" width="2" height="2"/>
</g>
</g>
<g id="path3869_3_">
<path fill="#418093" d="M8.209,16.418C3.683,16.418,0,12.736,0,8.209C0,3.683,3.683,0,8.209,0s8.208,3.683,8.208,8.209
C16.418,12.736,12.736,16.418,8.209,16.418z M8.209,1.5C4.51,1.5,1.5,4.51,1.5,8.209s3.01,6.709,6.709,6.709
c3.699,0,6.708-3.01,6.708-6.709S11.908,1.5,8.209,1.5z"/>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.1 KiB

BIN
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/sprites-gray.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 34 KiB

After

Width:  |  Height:  |  Size: 79 KiB

2653
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/sprites-gray.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 270 KiB

After

Width:  |  Height:  |  Size: 250 KiB

BIN
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/sprites-white.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 62 KiB

After

Width:  |  Height:  |  Size: 64 KiB

2653
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/sprites-white.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 270 KiB

After

Width:  |  Height:  |  Size: 250 KiB

BIN
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/sprites.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 76 KiB

After

Width:  |  Height:  |  Size: 80 KiB

2653
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/img/sprites.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 270 KiB

After

Width:  |  Height:  |  Size: 250 KiB

1630
admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/sprites.css
View file

File diff suppressed because one or more lines are too long

2
admin-ui/src/main/resources/META-INF/resources/admin/partials/application-detail.html
View file

@ -86,7 +86,7 @@
</button>
<button type="submit" data-ng-click="reset()" data-ng-show="changed">Clear changes
</button>
<button type="submit" data-ng-click="remove()" class="danger">
<button type="submit" data-ng-click="remove()" class="destructive">
Delete
</button>
</div>

3
admin-ui/src/main/resources/META-INF/resources/admin/partials/application-list.html
View file

@ -58,6 +58,9 @@
</tr>
</tbody>
</table>
<div class="feedback warning inline">
<p><strong>Your search returned no results.</strong><br>Try modifying the query and try again.</p>
</div>
</div>
</div>
<div id="container-right-bg"></div>

2
admin-ui/src/main/resources/META-INF/resources/admin/partials/application-role-detail.html
View file

@ -64,7 +64,7 @@
</button>
<button type="submit" data-ng-click="reset()" data-ng-show="changed">Clear changes
</button>
<button type="submit" data-ng-click="remove()" class="danger" data-ng-hide="changed">
<button type="submit" data-ng-click="remove()" class="destructive" data-ng-hide="changed">
Delete
</button>
</div>

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

@ -23,9 +23,11 @@
<ul class="nav pull-left">
<li>
<span class="dropdown-label" data-ng-show="showNav()">Realm:</span>
<div class="dropdown" data-ng-show="showNav()">
<div class="select-rcue" data-ng-show="showNav()">
<select ng-change="changeRealm()" ng-model="current.realm" ng-options="r.realm for r in current.realms"></select>
</div>
<a href="#/realms/{{realm.id}}" id="refresh"><span class="icon-spinner6">Icon: spinner</span></a>
</li>
</ul>
<div class="pull-right" data-ng-show="auth.loggedIn">

6
admin-ui/src/main/resources/META-INF/resources/admin/partials/realm-credentials.html
View file

@ -24,21 +24,21 @@
<label for="user" class="control-label">Required User Credentials</label>
<div class="controls">
<input id="user" type="text" ui-select2="userCredentialOptions" ng-model="realm.requiredCredentials" class="form-control tokenfield" placeholder="Type a role and enter">
<input id="user" type="text" ui-select2="userCredentialOptions" ng-model="realm.requiredCredentials" placeholder="Type a role and enter">
</div>
</div>
<div class="form-group clearfix">
<label for="application" class="control-label">Required Application Credentials</label>
<div class="controls">
<input id="application" type="text" ui-select2="userCredentialOptions" ng-model="realm.requiredApplicationCredentials" class="form-control tokenfield" placeholder="Type a role and enter">
<input id="application" type="text" ui-select2="userCredentialOptions" ng-model="realm.requiredApplicationCredentials" placeholder="Type a role and enter">
</div>
</div>
<div class="form-group clearfix">
<label for="oauth" class="control-label">Required OAuth Credentials</label>
<div class="controls">
<input id="oauth" type="text" ui-select2="userCredentialOptions" ng-model="realm.requiredOAuthClientCredentials" class="form-control tokenfield" placeholder="Type a role and enter">
<input id="oauth" type="text" ui-select2="userCredentialOptions" ng-model="realm.requiredOAuthClientCredentials" placeholder="Type a role and enter">
</div>
</div>
</fieldset>

2
admin-ui/src/main/resources/META-INF/resources/admin/partials/realm-detail.html
View file

@ -115,7 +115,7 @@
</button>
<button type="submit" data-ng-click="reset()" data-ng-show="changed">Clear changes
</button>
<button type="submit" data-ng-click="remove()" class="danger" data-ng-hide="changed">
<button type="submit" data-ng-click="remove()" class="destructive" data-ng-hide="changed">
Delete
</button>
</div>

2
admin-ui/src/main/resources/META-INF/resources/admin/partials/role-detail.html
View file

@ -59,7 +59,7 @@
</button>
<button type="submit" data-ng-click="reset()" data-ng-show="changed">Clear changes
</button>
<button type="submit" data-ng-click="remove()" class="danger" data-ng-hide="changed">
<button type="submit" data-ng-click="remove()" class="destructive" data-ng-hide="changed">
Delete
</button>
</div>

2
admin-ui/src/main/resources/META-INF/resources/admin/partials/user-detail.html
View file

@ -79,7 +79,7 @@
</button>
<button type="submit" data-ng-click="reset()" data-ng-show="changed">Clear changes
</button>
<button type="submit" data-ng-click="remove()" class="danger">
<button type="submit" data-ng-click="remove()" class="destructive">
Delete
</button>
</div>

3
admin-ui/src/main/resources/META-INF/resources/admin/partials/user-list.html
View file

@ -61,6 +61,9 @@
</tr>
</tbody>
</table>
<div class="feedback warning inline">
<p><strong>Your search returned no results.</strong><br>Try modifying the query and try again.</p>
</div>
</div>
</div>
<div id="container-right-bg"></div>