Merge pull request #83 from cardosogabriel/master
Form area and console area
This commit is contained in:
Bill Burke
commit
8c58ce3843
28 changed files with 480 additions and 426 deletions
|
|
@ -44,8 +44,56 @@ 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 {
|
||||
/*
|
||||
|
|
@ -64,7 +112,7 @@ body {
|
|||
border: 1px solid #676c6e;
|
||||
border-radius: 2px;
|
||||
padding: 0 0.54545454545455em;
|
||||
background: #555a5e url(img/sprite-arrow-down.png) no-repeat right -26px;
|
||||
background: #555a5e url(img/sprite-arrow-down.svg) no-repeat right -26px;
|
||||
display: block;
|
||||
|
||||
&:hover,
|
||||
|
|
@ -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;
|
||||
|
|
|
|||
|
|
@ -63,10 +63,65 @@ body {
|
|||
|
||||
/* Header */
|
||||
|
||||
.header.rcue .navbar.primary {
|
||||
.header.rcue {
|
||||
|
||||
.navbar.utility {
|
||||
background-color: #393F45;
|
||||
border-bottom: 1px solid #53565B;
|
||||
|
||||
.navbar-inner {
|
||||
border-bottom: 0;
|
||||
max-width: 1170px;
|
||||
}
|
||||
}
|
||||
|
||||
.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 {
|
||||
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;
|
||||
|
||||
&:hover {
|
||||
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;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.nav > li {
|
||||
|
|
@ -88,7 +143,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;
|
||||
|
|
@ -156,7 +211,7 @@ body {
|
|||
border: 1px solid #676c6e;
|
||||
border-radius: 2px;
|
||||
padding: 0 0.54545454545455em;
|
||||
background: #555a5e url(img/sprite-arrow-down.png) no-repeat right -26px;
|
||||
background: #555a5e url(img/sprite-arrow-down.svg) no-repeat right -26px;
|
||||
display: block;
|
||||
|
||||
&:hover,
|
||||
|
|
@ -233,7 +288,7 @@ body {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.bs-sidebar {
|
||||
background-color: @bg-grey;
|
||||
|
|
@ -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,13 +739,31 @@ 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 {
|
||||
ul li {
|
||||
|
||||
margin-left: 0;
|
||||
|
||||
a {
|
||||
border-width: 1px;
|
||||
padding-left: 1.53846153846154em;
|
||||
}
|
||||
|
||||
&.active a {
|
||||
background-image: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -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%;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 46 KiB |
|
|
@ -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>
|
||||
|
Before Width: | Height: | Size: 9.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 37 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 162 B |
Binary file not shown.
|
After Width: | Height: | Size: 202 B |
|
|
@ -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>
|
||||
|
After Width: | Height: | Size: 573 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 131 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1.3 KiB After Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 453 B |
|
|
@ -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;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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 */
|
||||
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -23,9 +23,6 @@
|
|||
</form>
|
||||
</div>
|
||||
<#elseif section = "info" >
|
||||
|
||||
<div id="info">
|
||||
</div>
|
||||
|
||||
<p><a href="#">« Back to Login</a></p>
|
||||
</#if>
|
||||
</@layout.registrationLayout>
|
||||
|
|
@ -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">
|
||||
|
|
|
|||
|
|
@ -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" />
|
||||
|
|
|
|||
|
|
@ -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">
|
||||
|
|
|
|||
|
|
@ -13,8 +13,7 @@
|
|||
<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>
|
||||
|
|
|
|||
|
|
@ -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">
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
||||
|
|
|
|||
|
|
@ -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
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue