@ -0,0 +1,3 @@ | |||
FROM quay.io/keycloak/keycloak:latest | |||
COPY ["./juice", "/opt/jboss/keycloak/themes/juice/"] |
@ -1,2 +1,45 @@ | |||
# keycloak-themed | |||
# Keycloak image with juice theme inside | |||
A short project that inject juice theme into a docker image. | |||
Juice theme should be located in `./juice` folder. | |||
!!!IMPORTANT!!!: IF YOU MAKE AN UPDATE, PLEASE UPDATE THE VERSION.INI FILE ACORDING TO STANDARD VERSIONING RULES (NUMBERS ONLY). | |||
## Docker commands | |||
### Build the image | |||
Build an image with tag juice-keycloak. | |||
```bash | |||
docker build -t juice-keycloak . | |||
``` | |||
### Stop previously running container | |||
```bash | |||
docker stop juice-keycloak | |||
``` | |||
### Start a container | |||
```bash | |||
docker run --rm -it -d \ | |||
-p 8080:8080 \ | |||
-e KEYCLOAK_USER=admin \ | |||
-e KEYCLOAK_PASSWORD=admin \ | |||
-e DB_VENDOR=postgres \ | |||
-e DB_ADDR=172.17.0.1 \ | |||
-e DB_DATABASE=keycloak \ | |||
-e DB_USER=keycloak \ | |||
-e DB_PASSWORD=keycloak \ | |||
--name juice-keycloak \ | |||
juice-keycloak | |||
``` | |||
Linux: PGHOST=172.17.0.1 | |||
Mac&Win: PGHOST=host.docker.internal | |||
## Testing | |||
There is a file `url.test.js` that will generate a login URL. After sucessfull login, provide the redirect url from the browser as an argument for the script to acquire tokens. | |||
The script includes installable package listed at the top. | |||
Change configuration inside of the script according to your realm settings. |
@ -0,0 +1,63 @@ | |||
#!/bin/bash | |||
function cleanup { | |||
if [ ! -z "${RPM_BUILD_ROOT}" ] && [ -d "${RPM_BUILD_ROOT}" ] && [ "${RPM_BUILD_ROOT}" != "./" ] | |||
then | |||
rm -rf "${RPM_BUILD_ROOT}" | |||
fi | |||
} | |||
export SOURCE_DIR=`dirname $0` | |||
echo "${SOURCE_DIR}" |grep -q "^\." | |||
if [ $? -eq 0 ] | |||
then | |||
echo "sourcdir is ." | |||
export SOURCE_DIR="`pwd`/" | |||
fi | |||
echo "${SOURCE_DIR}" |grep -q "^/" | |||
if [ $? -ne 0 ] | |||
then | |||
export SOURCE_DIR="`pwd`/`dirname $0`" | |||
fi | |||
echo "SOURCE_DIR: ${SOURCE_DIR}" | |||
export RELEASE_VERSION=`cat version.ini` | |||
if [ "${docker_registry}" != "" ] || [ "${1}" == "docker-image" ] || [ "${2}" == "docker-image" ] | |||
then | |||
docker build -t ${docker_registry}${docker_registry_path_suffix}/juice-keycloak:${RELEASE_VERSION} -t ${docker_registry}${docker_registry_path_suffix}/juice-keycloak:latest . && | |||
docker login --username ${docker_registry_username} --password ${docker_registry_password} ${docker_registry} && | |||
docker push ${docker_registry}${docker_registry_path_suffix}/juice-keycloak:${RELEASE_VERSION} && | |||
docker push ${docker_registry}${docker_registry_path_suffix}/juice-keycloak:latest | |||
exit $? | |||
fi | |||
if [ "${BUILD_RPM}" != "" ] || [ "${1}" == "rpm" ] || [ "${2}" == "rpm" ] | |||
then | |||
export _RPMBUILD_DIR="${RPMBUILD_DIR:-/tmp/rpmbuild-juice-keycloak}" | |||
export RPM_BUILD_ROOT="${RPM_BUILD_ROOT:-/tmp/build-juice-keycloak}" | |||
if [ ! -d "${_RPMBUILD_DIR}" ] | |||
then | |||
mkdir -p "${_RPMBUILD_DIR}" | |||
mkdir -p "${_RPMBUILD_DIR}"/RPMS/noarch | |||
mkdir -p "${_RPMBUILD_DIR}"/SOURCES | |||
mkdir -p "${_RPMBUILD_DIR}"/SPECS | |||
mkdir -p "${_RPMBUILD_DIR}"/SRPMS | |||
fi | |||
if [ ! -d "${RPM_BUILD_ROOT}" ] | |||
then | |||
mkdir -p "${RPM_BUILD_ROOT}" | |||
fi | |||
rpmbuild --target noarch -bb "${SOURCE_DIR}/juice-keycloak.spec" --buildroot="${RPM_BUILD_ROOT}" --define "_topdir ${_RPMBUILD_DIR}" --define "_release_version ${RELEASE_VERSION}" | |||
fi | |||
if [ "${RUN_HOOKS}" != "" ] | |||
then | |||
if [ "${BUILD_RPM}" != "" ] || [ "${1}" == "rpm" ] || [ "${2}" == "rpm" ] | |||
then | |||
run-parts "${SOURCE_DIR}/build-hooks/rpm" | |||
fi | |||
if [ "${docker_registry}" != "" ] || [ "${1}" == "docker-image" ] || [ "${2}" == "docker-image" ] | |||
then | |||
run-parts "${SOURCE_DIR}/build-hooks/docker-image" | |||
fi | |||
fi | |||
cleanup |
@ -0,0 +1,277 @@ | |||
html { | |||
height: 100%; | |||
} | |||
body { | |||
background-color: #F9F9F9; | |||
margin: 0; | |||
padding: 0; | |||
height: 100%; | |||
} | |||
header .navbar { | |||
margin-bottom: 0; | |||
min-height: inherit; | |||
} | |||
.header .container { | |||
position: relative; | |||
} | |||
.navbar-title { | |||
background-image: url('../img/logo.png'); | |||
height: 25px; | |||
background-repeat: no-repeat; | |||
width: 123px; | |||
margin: 3px 10px 5px; | |||
text-indent: -99999px; | |||
} | |||
.navbar-pf .navbar-utility { | |||
right: 20px; | |||
top: -34px; | |||
font-size: 12px; | |||
} | |||
.navbar-pf .navbar-utility > li > a { | |||
color: #fff !important; | |||
padding-bottom: 12px; | |||
padding-top: 11px; | |||
border-left: medium none; | |||
} | |||
.container { | |||
height: 100%; | |||
} | |||
.content-area { | |||
background-color: #fff; | |||
border-color: #CECECE; | |||
border-style: solid; | |||
border-width: 0 1px; | |||
height: 100%; | |||
padding: 0 30px; | |||
} | |||
.margin-bottom { | |||
margin-bottom: 10px; | |||
} | |||
/* Sidebar */ | |||
.bs-sidebar { | |||
background-color: #f9f9f9; | |||
padding-top: 44px; | |||
padding-right: 0; | |||
padding-left: 0; | |||
z-index: 20; | |||
} | |||
.bs-sidebar ul { | |||
list-style: none; | |||
padding-left: 12px; | |||
} | |||
.bs-sidebar ul li { | |||
margin-bottom: 0.5em; | |||
margin-left: -1em; | |||
} | |||
.bs-sidebar ul li a { | |||
font-size: 14px; | |||
padding-left: 25px; | |||
color: #4d5258; | |||
line-height: 28px; | |||
display: block; | |||
border-width: 1px 0 1px 1px; | |||
border-style: solid; | |||
border-color: #f9f9f9; | |||
} | |||
.bs-sidebar ul li a:hover, | |||
.bs-sidebar ul li a:focus { | |||
text-decoration: none; | |||
color: #777777; | |||
border-right: 2px solid #aaa; | |||
} | |||
.bs-sidebar ul li.active a { | |||
background-color: #c7e5f0; | |||
border-color: #56bae0; | |||
font-weight: bold; | |||
background-image: url(../img/icon-sidebar-active.png); | |||
background-repeat: no-repeat; | |||
background-position: right center; | |||
} | |||
.bs-sidebar ul li.active a:hover { | |||
border-right: none; | |||
} | |||
.content-area h2 { | |||
font-family: "Open Sans", sans-serif; | |||
font-weight: 100; | |||
font-size: 24px; | |||
margin-bottom: 25px; | |||
margin-top: 25px; | |||
} | |||
.subtitle { | |||
text-align: right; | |||
margin-top: 30px; | |||
color: #909090; | |||
} | |||
.required { | |||
color: #CB2915; | |||
} | |||
.alert { | |||
margin-top: 30px; | |||
margin-bottom: 0; | |||
} | |||
.feedback-aligner .alert { | |||
background-position: 1.27273em center; | |||
background-repeat: no-repeat; | |||
border-radius: 2px; | |||
border-width: 1px; | |||
color: #4D5258; | |||
display: inline-block; | |||
font-size: 1.1em; | |||
line-height: 1.4em; | |||
margin: 0; | |||
padding: 0.909091em 3.63636em; | |||
position: relative; | |||
text-align: left; | |||
} | |||
.alert.alert-success { | |||
background-color: #E4F1E1; | |||
border-color: #4B9E39; | |||
} | |||
.alert.alert-error { | |||
background-color: #F8E7E7; | |||
border-color: #B91415; | |||
} | |||
.alert.alert-warning { | |||
background-color: #FEF1E9; | |||
border-color: #F17528; | |||
} | |||
.alert.alert-info { | |||
background-color: #E4F3FA; | |||
border-color: #5994B2; | |||
} | |||
.form-horizontal { | |||
border-top: 1px solid #E9E8E8; | |||
padding-top: 23px; | |||
} | |||
.form-horizontal .control-label { | |||
color: #909090; | |||
line-height: 1.4em; | |||
padding-top: 5px; | |||
position: relative; | |||
text-align: right; | |||
width: 100%; | |||
} | |||
.form-group { | |||
position: relative; | |||
} | |||
.control-label + .required { | |||
position: absolute; | |||
right: -2px; | |||
top: 0; | |||
} | |||
#kc-form-buttons { | |||
text-align: right; | |||
margin-top: 10px; | |||
} | |||
#kc-form-buttons .btn-primary { | |||
float: right; | |||
margin-left: 8px; | |||
} | |||
/* Authenticator page */ | |||
ol { | |||
padding-left: 40px; | |||
} | |||
ol li { | |||
font-size: 13px; | |||
margin-bottom: 10px; | |||
position: relative; | |||
} | |||
ol li img { | |||
margin-top: 15px; | |||
margin-bottom: 5px; | |||
border: 1px solid #eee; | |||
} | |||
hr + .form-horizontal { | |||
border: none; | |||
padding-top: 0; | |||
} | |||
.kc-dropdown{ | |||
position: relative; | |||
} | |||
.kc-dropdown > a{ | |||
display:block; | |||
padding: 11px 10px 12px; | |||
line-height: 12px; | |||
font-size: 12px; | |||
color: #fff !important; | |||
text-decoration: none; | |||
} | |||
.kc-dropdown > a::after{ | |||
content: "\2c5"; | |||
margin-left: 4px; | |||
} | |||
.kc-dropdown:hover > a{ | |||
background-color: rgba(0,0,0,0.2); | |||
} | |||
.kc-dropdown ul li a{ | |||
padding: 1px 11px; | |||
font-size: 12px; | |||
color: #000 !important; | |||
border: 1px solid #fff; | |||
text-decoration: none; | |||
display:block; | |||
line-height: 20px; | |||
} | |||
.kc-dropdown ul li a:hover{ | |||
color: #4d5258; | |||
background-color: #d4edfa; | |||
border-color: #b3d3e7; | |||
} | |||
.kc-dropdown ul{ | |||
position: absolute; | |||
z-index: 2000; | |||
list-style:none; | |||
display:none; | |||
padding: 5px 0px; | |||
margin: 0px; | |||
background-color: #fff !important; | |||
border: 1px solid #b6b6b6; | |||
border-radius: 1px; | |||
-webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); | |||
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); | |||
background-clip: padding-box; | |||
min-width: 100px; | |||
} | |||
.kc-dropdown:hover ul{ | |||
display:block; | |||
} | |||
#kc-totp-secret-key { | |||
border: 1px solid #eee; | |||
font-size: 16px; | |||
padding: 10px; | |||
margin: 50px 0; | |||
} |
@ -0,0 +1,14 @@ | |||
parent=base | |||
import=common/keycloak | |||
styles=css/account.css | |||
stylesCommon=node_modules/patternfly/dist/css/patternfly.min.css node_modules/patternfly/dist/css/patternfly-additions.min.css | |||
##### css classes for form buttons | |||
# main class used for all buttons | |||
kcButtonClass=btn | |||
# classes defining priority of the button - primary or default (there is typically only one priority button for the form) | |||
kcButtonPrimaryClass=btn-primary | |||
kcButtonDefaultClass=btn-default | |||
# classes defining size of the button | |||
kcButtonLargeClass=btn-lg |
@ -0,0 +1,480 @@ | |||
html,body { | |||
height: 100%; | |||
} | |||
form { | |||
margin-top: 20px; | |||
} | |||
table { | |||
margin-top: 20px; | |||
} | |||
.required { | |||
color: #f00; | |||
} | |||
.tooltip-inner { | |||
min-width: 200px; | |||
} | |||
.margin-top { | |||
margin-top: 20px; | |||
} | |||
.no-margin-top { | |||
margin-top: 0px !important; | |||
} | |||
table { | |||
max-width: 100%; | |||
} | |||
td.clip { | |||
overflow: hidden; | |||
text-overflow: ellipsis; | |||
white-space: nowrap; | |||
max-width: 0; | |||
} | |||
th.w-10 { | |||
width: 10%; | |||
} | |||
th.w-15 { | |||
width: 15%; | |||
} | |||
th.w-20 { | |||
width: 20%; | |||
} | |||
th.w-25 { | |||
width: 25%; | |||
} | |||
th.w-30 { | |||
width: 30%; | |||
} | |||
th.w-35 { | |||
width: 35%; | |||
} | |||
th.w-40 { | |||
width: 40%; | |||
} | |||
/*********** Loading ***********/ | |||
.loading { | |||
background-color: #f5f5f5; | |||
border: 1px solid #eee; | |||
position: absolute; | |||
bottom: 0px; | |||
left: 0px; | |||
padding: 2px 200px 2px 5px; | |||
} | |||
/*********** Feedback ***********/ | |||
.feedback-aligner { | |||
position: fixed; | |||
top: 15px; | |||
text-align: center; | |||
width: 100%; | |||
height: 0; | |||
z-index: 100; | |||
} | |||
.feedback-aligner .alert { | |||
border-radius: 2px; | |||
border-width: 1px; | |||
display: inline-block; | |||
position: relative; | |||
} | |||
/*********** On-Off Switch ***********/ | |||
.onoffswitch { | |||
-moz-user-select: none; | |||
height: 26px; | |||
position: relative; | |||
width: 62px; | |||
} | |||
.onoffswitch .onoffswitch-checkbox { | |||
display: none; | |||
} | |||
.onoffswitch .onoffswitch-label { | |||
border: 1px solid #bbb; | |||
border-radius: 2px; | |||
cursor: pointer; | |||
display: block; | |||
overflow: hidden; | |||
width: 62px; | |||
} | |||
.onoffswitch .onoffswitch-inner { | |||
display: block; | |||
margin-left: -100%; | |||
transition: margin 0.3s ease-in 0s; | |||
width: 200%; | |||
} | |||
.onoffswitch .onoffswitch-inner > span { | |||
-moz-box-sizing: border-box; | |||
color: white; | |||
float: left; | |||
font-size: 11px; | |||
font-family: "Open Sans", sans-serif; | |||
font-weight: bold; | |||
height: 24px; | |||
line-height: 24px; | |||
padding: 0; | |||
width: 50%; | |||
} | |||
.onoffswitch .onoffswitch-switch { | |||
background-image: linear-gradient(top, #fafafa 0%, #ededed 100%); | |||
background-image: -o-linear-gradient(top, #fafafa 0%, #ededed 100%); | |||
background-image: -moz-linear-gradient(top, #fafafa 0%, #ededed 100%); | |||
background-image: -webkit-linear-gradient(top, #fafafa 0%, #ededed 100%); | |||
background-image: -ms-linear-gradient(top, #fafafa 0%, #ededed 100%); | |||
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fafafa), color-stop(1, 0, #ededed)); | |||
border: 1px solid #aaa; | |||
border-radius: 2px; | |||
bottom: 0; | |||
margin: 0; | |||
position: absolute; | |||
right: 39px; | |||
top: 0; | |||
transition: all 0.3s ease-in 0s; | |||
-webkit-transition: all 0.3s ease-in 0s; | |||
width: 23px; | |||
} | |||
.onoffswitch .onoffswitch-inner .onoffswitch-active { | |||
background-image: linear-gradient(top, #00a9ec 0%, #009bd3 100%); | |||
background-image: -o-linear-gradient(top, #00a9ec 0%, #009bd3 100%); | |||
background-image: -moz-linear-gradient(top, #00a9ec 0%, #009bd3 100%); | |||
background-image: -webkit-linear-gradient(top, #00a9ec 0%, #009bd3 100%); | |||
background-image: -ms-linear-gradient(top, #00a9ec 0%, #009bd3 100%); | |||
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #00a9ec), color-stop(1, 0, #009bd3)); | |||
color: #FFFFFF; | |||
padding-left: 10px; | |||
} | |||
.onoffswitch-checkbox:disabled + .onoffswitch-label .onoffswitch-inner .onoffswitch-active, | |||
.onoffswitch-checkbox:disabled + .onoffswitch-label .onoffswitch-inner .onoffswitch-inactive { | |||
background-image: none; | |||
background-color: #e5e5e5; | |||
color: #9d9fa1; | |||
} | |||
.onoffswitch .onoffswitch-inner .onoffswitch-inactive { | |||
background: linear-gradient(#fefefe, #e8e8e8) repeat scroll 0 0 transparent; | |||
color: #4d5258; | |||
padding-right: 10px; | |||
text-align: right; | |||
} | |||
.onoffswitch .onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner { | |||
margin-left: 0; | |||
} | |||
.onoffswitch .onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch { | |||
right: 0; | |||
} | |||
/*********** Select 2 ***********/ | |||
.select2-container { | |||
width: 100%; | |||
} | |||
.select2-container-multi .select2-choices .select2-search-field { | |||
height: 26px; | |||
} | |||
/*********** html select ********/ | |||
.overflow-select { | |||
overflow: auto; | |||
} | |||
/*********** New Menu ***********/ | |||
.sidebar-pf-left{ | |||
background: #292e34; | |||
} | |||
.sidebar-pf .nav-pills > li a i, .sidebar-pf .nav-pills > li a span{ | |||
color: #72767b; | |||
display: inline-block; | |||
margin-right: 10px; | |||
} | |||
.sidebar-pf .nav-pills > li > a{ | |||
color: #dbdada; | |||
padding: 0px 20px 0 30px!important; | |||
line-height: 30px; | |||
border-left-width: 12px; | |||
border-left-style: solid; | |||
border-left-color: #292e34; | |||
margin-left: -6px; | |||
} | |||
.sidebar-pf .nav-pills > li > a:hover{ | |||
background: #393f44; | |||
border-color:#292e34; | |||
border-left-color: #393f44; | |||
color: #fff; | |||
} | |||
.sidebar-pf .nav-pills > li > a:after{ | |||
display: none!important; | |||
} | |||
.sidebar-pf .nav-pills > li.active > a { | |||
color: #fff; | |||
background: #393f44!important; | |||
border-bottom: 1px solid #000!important; | |||
border-top: 1px solid #000!important; | |||
border-left-color: #39a5dc!important; | |||
} | |||
.sidebar-pf .nav-pills > li.active a i, .sidebar-pf .nav-pills > li.active a span{ | |||
color: #39a5dc; | |||
} | |||
/*********** Realm selector ***********/ | |||
.realm-selector{ | |||
color: #fff; | |||
margin: 0 -20px; | |||
position: relative; | |||
} | |||
.realm-dropmenu{ | |||
display: none; | |||
cursor: pointer; | |||
position: absolute; | |||
top: 60px; | |||
left: 0; | |||
right: 0; | |||
z-index: 999; | |||
background: #fff; | |||
} | |||
.realm-selector:hover .realm-dropmenu{ | |||
display: block; | |||
} | |||
.realm-add{ | |||
padding: 10px; | |||
} | |||
.realm-selector h2{ | |||
font-size: 16px; | |||
line-height: 60px; | |||
padding: 0 20px; | |||
margin: 0; | |||
border-bottom: 1px solid #d5d5d6; | |||
} | |||
.realm-selector h2 i{ | |||
display: inline-block; | |||
float: right; | |||
line-height: 60px; | |||
} | |||
.realm-selector ul{ | |||
padding-left: 0; | |||
margin: 0; | |||
list-style: none; | |||
max-height: 200px; | |||
overflow-y:auto; | |||
} | |||
.realm-selector ul li a{ | |||
line-height: 60px; | |||
padding: 0 20px; | |||
border-bottom: 1px solid #d5d5d6; | |||
line-height: 39px; | |||
display: block; | |||
font-size: 14px; | |||
} | |||
/*********** Overwrites header defaults ***********/ | |||
.navbar-pf{ | |||
border-top: none!important; | |||
} | |||
.navbar-pf .navbar-brand { | |||
padding: 0; | |||
height: 56px; | |||
line-height: 56px; | |||
background-position: center center; | |||
background-image: url('../img/keyclok-logo.png'); | |||
background-size: 148px 30px; | |||
background-repeat: no-repeat; | |||
width: 148px; | |||
} | |||
.navbar-pf .navbar-utility .dropdown-toggle { | |||
padding: 23px !important; | |||
} | |||
.clickable { | |||
cursor: pointer; | |||
} | |||
h1 i { | |||
color: #999999; | |||
font-size: 18px; | |||
margin-left: 10px; | |||
} | |||
/* Action cell */ | |||
.kc-action-cell { | |||
background-color: #eeeeee; | |||
background-image: linear-gradient(to bottom, #fafafa 0%, #ededed 100%); | |||
background-repeat: repeat-x; | |||
text-align: center; | |||
vertical-align: middle; | |||
overflow: hidden; | |||
text-overflow: ellipsis; | |||
white-space: nowrap; | |||
cursor:pointer; | |||
} | |||
.kc-action-cell:hover { | |||
background-color: #eeeeee; | |||
background-image: none; | |||
} | |||
.kc-sorter span { | |||
margin-left: 10px; | |||
} | |||
/* Time selector */ | |||
.time-selector input { | |||
display: inline-block; | |||
width: 120px; | |||
padding-right: 0; | |||
margin-right: 0; | |||
} | |||
.time-selector select { | |||
display: inline-block; | |||
width: 80px; | |||
margin-left: 0; | |||
padding-left: 0; | |||
} | |||
.ace_editor { | |||
height: 600px; | |||
width: 100%; | |||
} | |||
.kc-button-input-file input { | |||
float: left; | |||
width: 73%; | |||
} | |||
.kc-button-input-file label { | |||
float: left; | |||
margin-left: 2%; | |||
width: 25%; | |||
} | |||
table.kc-authz-table-expanded { | |||
margin-top: 0px !important; | |||
} | |||
.no-gutter > [class*='col-'] { | |||
padding-right:0!important; | |||
padding-left:0!important; | |||
} | |||
.password-conceal { | |||
font-family: 'text-security-disc'; | |||
font-size: 14px; | |||
} | |||
/* Deactivation styles for user-group membership tree models */ | |||
div[tree-model] li .deactivate { | |||
color: #4a5053; | |||
opacity: 0.4; | |||
} | |||
div[tree-model] li .deactivate_selected { | |||
background-color: #dcdcdc; | |||
font-weight: bold; | |||
padding: 1px 5px; | |||
} | |||
/* search highlighting */ | |||
div[tree-model] li .highlight { | |||
background-color: #aaddff; | |||
} | |||
/* Manage credentials */ | |||
table.credentials-table { | |||
margin-top: 0; | |||
margin-bottom: 20px; | |||
} | |||
table.credentials-table td { | |||
vertical-align: middle !important; | |||
} | |||
table.credentials-table input[type='text'] { | |||
width: 100%; | |||
} | |||
td.credential-arrows-cell { | |||
width: 75px; | |||
} | |||
td.credential-label-cell { | |||
padding: 5px !important; | |||
} | |||
td.credential-action-cell { | |||
padding: 0px !important; | |||
} | |||
td.credential-action-cell div.kc-action-cell { | |||
width: 100%; | |||
height: 36px; | |||
line-height: 34px; | |||
} | |||
td.credential-action-cell.expanded div.kc-action-cell { | |||
border-bottom: 1px solid #d1d1d1; | |||
} | |||
table.credential-data-table td { | |||
word-break: break-all; | |||
} | |||
table.credential-data-table tr:first-child td { | |||
border-top: 0; | |||
} | |||
table.credential-data-table td:first-child { | |||
width: 150px; | |||
} | |||
table.credential-data-table td.key { | |||
text-align: right; | |||
font-weight: bold; | |||
} | |||
@ -0,0 +1,194 @@ | |||
<?xml version="1.0" encoding="utf-8"?> | |||
<!-- Generator: Adobe Illustrator 18.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> | |||
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" | |||
viewBox="-145.2 359 325.4 77.2" enable-background="new -145.2 359 325.4 77.2" xml:space="preserve"> | |||
<g> | |||
<g> | |||
<path fill="none" stroke="#FFFFFF" stroke-width="7" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" d=" | |||
M-79.1,393.1c-7.2,5-14.7,3.7-23.2-3.4c-4.9-4.1-11.2-2.8-15.4-1.5c-2.6,0.8-6.3,0.7-9.5,0.1c-14-2.9-10.9,6-8.3,14 | |||
c4.8,14.6-3.2,18-6,12.8c-1.8,6.6,7.1,8.6,10.9,7.7c6-1.4,14.1-2.2,19-0.6c9.5,2.9,13.1,0.5,11.5-2.6c-0.5-1-0.2-2.4,0.6-3.1 | |||
c2.8-2.4,5.3-0.4,8-1.9c2.1-1.2,2.1-3.9-1.2-5.5c-1.7-0.8-1.6-2.9,0.2-3.8c3.7-2,8.8-1,10-5.1C-81.9,398.7-80.7,395-79.1,393.1z" | |||
/> | |||
<path fill="none" stroke="#FFFFFF" stroke-width="7" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" d=" | |||
M-112.4,367.4c-1.1-0.6-4.3-2.6-5.1-3.1c-0.8-0.5-2.7-1.9-4.8-1.9s-4,1.4-4.8,1.9c-0.8,0.5-4,2.5-5.1,3.1c-0.8,0.5-3.7,2-3.7,6.3 | |||
c0,1.3,0,3.6,0,4.5c0,2.8,1.6,5,4.5,6.4c1,0.5,1.8,1.3,1.8,3.5c0,0.9,0.4,1.2,0.9,1.2h0.7c0.6,0,1,0.2,1,1.3c0,0.6,0,2.1,0,2.1 | |||
v37.2l2.7,2.8h1.2l5.7-5.8v-34.2c0,0,0-1.5,0-2.1c0-1,0.3-1.3,1-1.3h0.7c0.6,0,0.9-0.2,0.9-1.2c0-2.1,0.8-3,1.8-3.5 | |||
c2.9-1.5,4.5-3.6,4.5-6.4c0-1,0-3.2,0-4.5C-108.7,369.5-111.6,367.9-112.4,367.4z"/> | |||
</g> | |||
<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="-227.7191" y1="2220.7964" x2="-165.056" y2="2220.7964" gradientTransform="matrix(1 0 0 1 86 -1815.5)"> | |||
<stop offset="0" style="stop-color:#FDFDFD"/> | |||
<stop offset="0.1452" style="stop-color:#F4F5F5"/> | |||
<stop offset="0.6844" style="stop-color:#D9DBDB"/> | |||
<stop offset="1" style="stop-color:#CFD1D1"/> | |||
</linearGradient> | |||
<path fill="url(#SVGID_1_)" d="M-79.1,393.1c-7.2,5-14.7,3.7-23.2-3.4c-4.9-4.1-11.2-2.8-15.4-1.5c-2.6,0.8-6.3,0.7-9.5,0.1 | |||
c-14-2.9-10.9,6-8.3,14c4.8,14.6-3.2,18-6,12.8c-1.8,6.6,7.1,8.6,10.9,7.7c6-1.4,14.1-2.2,19-0.6c9.5,2.9,13.1,0.5,11.5-2.6 | |||
c-0.5-1-0.2-2.4,0.6-3.1c2.8-2.4,5.3-0.4,8-1.9c2.1-1.2,2.1-3.9-1.2-5.5c-1.7-0.8-1.6-2.9,0.2-3.8c3.7-2,8.8-1,10-5.1 | |||
C-81.9,398.7-80.7,395-79.1,393.1z"/> | |||
<linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="192.3203" y1="1507.8835" x2="184.0467" y2="1507.8835" gradientTransform="matrix(1 0 0 1 -302 -1102)"> | |||
<stop offset="0" style="stop-color:#E6E6E6"/> | |||
<stop offset="1" style="stop-color:#B2B3B3"/> | |||
</linearGradient> | |||
<path fill="url(#SVGID_2_)" d="M-115,391.3c0,5,0.7,22.8,4.5,30.4l-8.7-0.2v-31.5L-115,391.3z"/> | |||
<linearGradient id="SVGID_3_" gradientUnits="userSpaceOnUse" x1="-200.8627" y1="2227.3811" x2="-193.8624" y2="2207.8804" gradientTransform="matrix(1 0 0 1 86 -1815.5)"> | |||
<stop offset="0" style="stop-color:#F6F6F6"/> | |||
<stop offset="1" style="stop-color:#B2B3B3"/> | |||
</linearGradient> | |||
<path fill="url(#SVGID_3_)" d="M-134.6,403.1c-2.8-7.5-6.5-16.6,7.5-13.7c3.2,0.7,6.9,0.7,9.5-0.1c4.3-1.3,10-2.4,14.5,1.5 | |||
c8.9,7.7,16.9,8.3,24.1,3.3c-1.6,1.9-3.1,5.6-3.3,7.1c-0.2,1.3-1.1,1.9-2.4,2.4c-18.5,7.5-15.4-5.3-21.4-9.5 | |||
c-3.2-2.2-7.7-2.1-11.2-0.8c-3.2,1.2-6.4,0.9-9.8-0.4C-132.9,390.8-136.7,391.9-134.6,403.1z"/> | |||
<line fill="none" stroke="#FFFFFF" stroke-width="3.5" stroke-miterlimit="10" x1="-117.4" y1="421.8" x2="-117.4" y2="390.6"/> | |||
<g opacity="0.75"> | |||
<path fill="#FFFFFF" d="M-110.3,389c2.7,0,4.9,0.7,6.8,2.3c5.5,4.6,10.6,6.8,15.6,6.8c1.5,0,2.9-0.2,4.4-0.6 | |||
c-0.3,0.9-0.6,1.6-0.7,2.1c-0.4,1.4-1.6,1.8-4.4,2.4c-1.5,0.3-3.1,0.7-4.7,1.5c-1.6,0.8-2.5,2.3-2.5,3.9c0,1.5,0.9,2.8,2.4,3.5 | |||
c1.2,0.5,1.5,1.1,1.5,1.4c0,0.3-0.3,0.5-0.5,0.6c-0.6,0.3-1.2,0.4-2.1,0.4c-0.2,0-0.3,0-0.5,0c-0.2,0-0.4,0-0.5,0 | |||
c-1.6,0-3.4,0.2-5.2,1.7c-1.5,1.3-2,3.7-1.1,5.6c0.1,0.3,0.1,0.4,0.1,0.4c-0.1,0.1-0.8,0.6-2.6,0.6c-1.8,0-4.1-0.4-6.7-1.2 | |||
c-2-0.6-4.5-0.9-7.5-0.9c-3.8,0-8.4,0.6-12.6,1.5c-0.4,0.1-0.9,0.1-1.5,0.1c-1.9,0-4.2-0.5-5.7-1.6c1.7,0,3.3-0.9,4.4-2.4 | |||
c1.3-1.8,3.2-6.3,0.2-15.3l-0.1-0.2c-1.3-3.9-2.9-8.8-1.5-10.7c0.5-0.7,1.6-1.1,3.4-1.1c1.2,0,2.6,0.2,4.3,0.5 | |||
c1.8,0.4,3.6,0.6,5.4,0.6c1.9,0,3.7-0.2,5.1-0.7C-115.4,389.7-112.9,389-110.3,389 M-110.3,387c-2.7,0-5.2,0.6-7.3,1.3 | |||
c-1.3,0.4-2.9,0.6-4.6,0.6c-1.6,0-3.4-0.2-5-0.5c-1.9-0.4-3.4-0.6-4.7-0.6c-8.5,0-5.9,7.7-3.6,14.6c3.4,10.4,0.3,15.1-2.7,15.1 | |||
c-1.2,0-2.5-0.8-3.3-2.3c-1.5,5.6,4.8,7.9,9,7.9c0.7,0,1.4-0.1,2-0.2c3.7-0.8,8.1-1.5,12.2-1.5c2.5,0,4.9,0.2,6.9,0.8 | |||
c3,0.9,5.5,1.3,7.3,1.3c4,0,5.3-1.8,4.2-3.9c-0.5-1-0.2-2.4,0.6-3.1c1.4-1.2,2.7-1.3,3.9-1.3c0.3,0,0.7,0,1,0c1,0,2-0.1,3.1-0.7 | |||
c2.1-1.2,2.1-3.9-1.2-5.5c-1.7-0.8-1.6-2.9,0.2-3.8c3.7-2,8.8-1,10-5.1c0.4-1.5,1.7-5.2,3.3-7.1c-2.9,2-5.9,3-8.9,3 | |||
c-4.5,0-9.2-2.2-14.3-6.4C-104.7,387.7-107.6,387-110.3,387L-110.3,387z M-79.1,393.1L-79.1,393.1L-79.1,393.1z"/> | |||
</g> | |||
<path fill="none" stroke="#034672" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" d=" | |||
M-79.1,393.1c-7.2,5-14.7,3.7-23.2-3.4c-4.9-4.1-11.2-2.8-15.4-1.5c-2.6,0.8-6.3,0.7-9.5,0.1c-14-2.9-10.9,6-8.3,14 | |||
c4.8,14.6-3.2,18-6,12.8c-1.8,6.6,7.1,8.6,10.9,7.7c6-1.4,14.1-2.2,19-0.6c9.5,2.9,13.1,0.5,11.5-2.6c-0.5-1-0.2-2.4,0.6-3.1 | |||
c2.8-2.4,5.3-0.4,8-1.9c2.1-1.2,2.1-3.9-1.2-5.5c-1.7-0.8-1.6-2.9,0.2-3.8c3.7-2,8.8-1,10-5.1C-81.9,398.7-80.7,395-79.1,393.1z"/> | |||
<path fill="#034672" d="M-134.6,402.1c-2.8-7.5-6.5-16.6,7.5-13.7c3.2,0.7,6.9,0.7,9.5-0.1c4.3-1.3,10-2.4,14.5,1.5 | |||
c8.9,7.7,16.9,8.3,24.1,3.3c-1.6,1.9-3.1,5.6-3.3,7.1c-0.2,1.3-1.1,1.9-2.4,2.4c-13.1,4.8-14.1-5.5-20.1-9.7 | |||
c-3.2-2.2-9-1.9-12.5-0.6c-3.2,1.2-6.4,0.9-9.8-0.4C-132.9,389.8-136.7,390.9-134.6,402.1z"/> | |||
<path fill="#FFFFFF" d="M-112.4,367.4c-1.1-0.6-4.3-2.6-5.1-3.1c-0.8-0.5-2.7-1.9-4.8-1.9s-4,1.4-4.8,1.9c-0.8,0.5-4,2.5-5.1,3.1 | |||
c-0.8,0.5-3.7,2-3.7,6.3c0,1.3,0,3.6,0,4.5c0,2.8,1.6,5,4.5,6.4c1,0.5,1.8,1.3,1.8,3.5c0,0.9,0.4,1.2,0.9,1.2h0.7 | |||
c0.6,0,1,0.2,1,1.3c0,0.6,0,2.1,0,2.1v37.2l2.7,2.8h1.2l5.7-5.8v-34.2c0,0,0-1.5,0-2.1c0-1,0.3-1.3,1-1.3h0.7 | |||
c0.6,0,0.9-0.2,0.9-1.2c0-2.1,0.8-3,1.8-3.5c2.9-1.5,4.5-3.6,4.5-6.4c0-1,0-3.2,0-4.5C-108.7,369.5-111.6,367.9-112.4,367.4z"/> | |||
<linearGradient id="SVGID_4_" gradientUnits="userSpaceOnUse" x1="-217.9037" y1="2215.0122" x2="-187.068" y2="2207.345" gradientTransform="matrix(1 0 0 1 86 -1815.5)"> | |||
<stop offset="0" style="stop-color:#B8D7E9"/> | |||
<stop offset="0.3324" style="stop-color:#CCE3F1"/> | |||
<stop offset="0.6937" style="stop-color:#DAEBF7"/> | |||
<stop offset="1" style="stop-color:#DFEEF9"/> | |||
</linearGradient> | |||
<path fill="url(#SVGID_4_)" d="M-112.4,367.4c-1.1-0.6-4.3-2.6-5.1-3.1c-0.8-0.5-2.7-1.9-4.8-1.9v69.3l4.8-4.9v-34.2 | |||
c0,0,0-1.5,0-2.1c0-1,0.3-1.3,1-1.3h0.7c0.6,0,0.9-0.2,0.9-1.2c0-2.1,0.8-3,1.8-3.5c2.9-1.5,4.5-3.6,4.5-6.4c0-1,0-3.2,0-4.5 | |||
C-108.7,369.5-111.6,367.9-112.4,367.4z"/> | |||
<linearGradient id="SVGID_5_" gradientUnits="userSpaceOnUse" x1="-214.9444" y1="2190.8406" x2="-206.3191" y2="2233.0925" gradientTransform="matrix(1 0 0 1 86 -1815.5)"> | |||
<stop offset="0" style="stop-color:#F1F9FE"/> | |||
<stop offset="0.4254" style="stop-color:#E9F5FD"/> | |||
<stop offset="1" style="stop-color:#E4F3FD"/> | |||
</linearGradient> | |||
<path fill="url(#SVGID_5_)" d="M-122.3,362.5c-2.1,0-4,1.4-4.8,1.9c-0.8,0.5-4,2.5-5.1,3.1c-0.8,0.5-3.7,2-3.7,6.3 | |||
c0,1.3,0,3.6,0,4.5c0,2.8,1.6,5,4.5,6.4c1,0.5,1.8,1.3,1.8,3.5c0,0.9,0.4,1.2,0.9,1.2h0.7c0.6,0,1,0.2,1,1.3c0,0.6,0,2.1,0,2.1 | |||
v37.2l2.7,2.8h1.2l0.9-0.9L-122.3,362.5L-122.3,362.5z"/> | |||
<path fill="none" stroke="#FFFFFF" stroke-width="2" stroke-miterlimit="10" d="M-122.6,362.5c1.9,0.9,3.4,2,4.2,2.4 | |||
c0.8,0.5,4,2.5,5.1,3.1c0.8,0.5,3.7,2,3.7,6.3c0,1.3,0,2.8,0,3.8c0,2.8-1.6,5-4.5,6.4c-1,0.5-1.8,1.4-1.8,3.6v1.2"/> | |||
<path fill="none" stroke="#034672" stroke-width="2" stroke-miterlimit="10" d="M-112.4,367.4c-1.1-0.6-4.3-2.6-5.1-3.1 | |||
c-0.8-0.5-2.7-1.9-4.8-1.9s-4,1.4-4.8,1.9c-0.8,0.5-4,2.5-5.1,3.1c-0.8,0.5-3.7,2-3.7,6.3c0,1.3,0,3.6,0,4.5c0,2.8,1.6,5,4.5,6.4 | |||
c1,0.5,1.8,1.3,1.8,3.5c0,0.9,0.4,1.2,0.9,1.2h0.7c0.6,0,1,0.2,1,1.3c0,0.6,0,2.1,0,2.1v37.2l2.7,2.8h1.2l5.7-5.8v-34.2 | |||
c0,0,0-1.5,0-2.1c0-1,0.3-1.3,1-1.3h0.7c0.6,0,0.9-0.2,0.9-1.2c0-2.1,0.8-3,1.8-3.5c2.9-1.5,4.5-3.6,4.5-6.4c0-1,0-3.2,0-4.5 | |||
C-108.7,369.5-111.6,367.9-112.4,367.4z"/> | |||
<path fill="#E9F6FE" stroke="#034672" stroke-width="2" stroke-miterlimit="10" d="M-107.5,392.7"/> | |||
<g> | |||
<linearGradient id="SVGID_6_" gradientUnits="userSpaceOnUse" x1="-106.4885" y1="2203.667" x2="-106.4885" y2="2254.552" gradientTransform="matrix(1 0 0 1 86 -1815.5)"> | |||
<stop offset="0" style="stop-color:#FFFFFE"/> | |||
<stop offset="0.4815" style="stop-color:#F2F1F1"/> | |||
<stop offset="1" style="stop-color:#E9E7E8"/> | |||
</linearGradient> | |||
<path fill="url(#SVGID_6_)" d="M-14.5,407.6h-11.6c0.3,2.3,1,3.9,2.1,4.7s2.9,1.2,5.5,1.2c3.4,0,7.4-0.2,12-0.7l0.9,6 | |||
c-3.3,1.6-8,2.4-14,2.4c-6,0-10.3-1.3-12.9-3.9c-2.6-2.6-3.8-6.9-3.8-12.9c0-6.3,1.2-10.7,3.7-13.2c2.5-2.5,6.7-3.8,12.6-3.8 | |||
c5.3,0,9.2,0.9,11.6,2.8c2.4,1.8,3.6,4.7,3.6,8.4c0,3-0.8,5.2-2.3,6.7C-8.5,406.8-11,407.6-14.5,407.6z M-26.3,401.8h9.1 | |||
c1.2,0,2-0.3,2.4-0.8c0.4-0.6,0.6-1.4,0.6-2.5c0-1.5-0.4-2.6-1.2-3.2c-0.8-0.6-2.2-0.9-4.3-0.9c-2.5,0-4.2,0.5-5.1,1.5 | |||
C-25.6,396.9-26.1,398.8-26.3,401.8z"/> | |||
<linearGradient id="SVGID_7_" gradientUnits="userSpaceOnUse" x1="-72.864" y1="2203.667" x2="-72.864" y2="2254.5503" gradientTransform="matrix(1 0 0 1 86 -1815.5)"> | |||
<stop offset="0" style="stop-color:#FFFFFE"/> | |||
<stop offset="0.4815" style="stop-color:#F2F1F1"/> | |||
<stop offset="1" style="stop-color:#E9E7E8"/> | |||
</linearGradient> | |||
<path fill="url(#SVGID_7_)" d="M31,388.3l-11.4,32.6c-0.6,1.7-1.4,3.3-2.2,4.8c-0.9,1.5-2,2.9-3.4,4.3c-1.4,1.4-3.1,2.4-5.2,3 | |||
c-2.1,0.7-4.4,0.8-6.9,0.5L1,427.8c2.6-0.7,4.6-1.6,6.1-2.7c1.5-1.1,2.6-2.6,3.5-4.5l0.1-0.3H8.9c-1.6,0-2.6-0.8-3.1-2.3 | |||
l-10.5-29.8H5.6l6,20.8c0.4,1.5,0.7,3.1,1,4.8h0.8c0.1-0.5,0.3-1.3,0.7-2.4s0.5-1.9,0.7-2.4l5.9-20.8L31,388.3L31,388.3z"/> | |||
<linearGradient id="SVGID_8_" gradientUnits="userSpaceOnUse" x1="-41.775" y1="2203.667" x2="-41.775" y2="2254.552" gradientTransform="matrix(1 0 0 1 86 -1815.5)"> | |||
<stop offset="0" style="stop-color:#FFFFFE"/> | |||
<stop offset="0.4815" style="stop-color:#F2F1F1"/> | |||
<stop offset="1" style="stop-color:#E9E7E8"/> | |||
</linearGradient> | |||
<path fill="url(#SVGID_8_)" d="M57.6,412.8l0.9,6.3c-3.3,1.4-7.5,2.1-12.4,2.1c-5.9,0-10.1-1.3-12.5-3.8 | |||
c-2.4-2.5-3.6-6.9-3.6-13.1c0-6.2,1.2-10.6,3.6-13.1c2.4-2.5,6.6-3.8,12.6-3.8c4.9,0,8.8,0.7,11.9,2l-1,6 | |||
c-4.7-0.1-7.8-0.1-9.2-0.1c-3,0-5,0.6-6.1,1.9c-1.1,1.3-1.7,3.6-1.7,7.2c0,3.5,0.6,5.9,1.7,7.2c1.1,1.3,3.1,1.9,6.1,1.9 | |||
C51.6,413.4,54.9,413.2,57.6,412.8z"/> | |||
<linearGradient id="SVGID_9_" gradientUnits="userSpaceOnUse" x1="8.9715" y1="2203.667" x2="8.9715" y2="2254.553" gradientTransform="matrix(1 0 0 1 86 -1815.5)"> | |||
<stop offset="0" style="stop-color:#FFFFFE"/> | |||
<stop offset="0.4815" style="stop-color:#F2F1F1"/> | |||
<stop offset="1" style="stop-color:#E9E7E8"/> | |||
</linearGradient> | |||
<path fill="url(#SVGID_9_)" d="M95,387.4c6,0,10.2,1.3,12.7,3.9c2.5,2.6,3.7,7,3.7,13.1c0,6.2-1.2,10.5-3.7,13.1 | |||
c-2.5,2.5-6.7,3.8-12.7,3.8c-6,0-10.3-1.3-12.8-3.8c-2.5-2.5-3.7-6.9-3.7-13.1c0-6.2,1.2-10.6,3.7-13.2 | |||
C84.7,388.7,89,387.4,95,387.4z M95,394.6c-2.6,0-4.3,0.6-5.1,2c-0.9,1.3-1.3,3.9-1.3,7.8c0,3.8,0.4,6.4,1.3,7.7 | |||
c0.9,1.3,2.6,2,5.1,2c2.5,0,4.2-0.7,5.1-2c0.9-1.3,1.3-3.9,1.3-7.7c0-3.9-0.4-6.5-1.3-7.8C99.2,395.3,97.5,394.6,95,394.6z"/> | |||
<linearGradient id="SVGID_10_" gradientUnits="userSpaceOnUse" x1="42.879" y1="2203.667" x2="42.879" y2="2254.552" gradientTransform="matrix(1 0 0 1 86 -1815.5)"> | |||
<stop offset="0" style="stop-color:#FFFFFE"/> | |||
<stop offset="0.4815" style="stop-color:#F2F1F1"/> | |||
<stop offset="1" style="stop-color:#E9E7E8"/> | |||
</linearGradient> | |||
<path fill="url(#SVGID_10_)" d="M115.9,395.5l-0.9-6.5c5.8-1,11.4-1.6,16.7-1.6c4.3,0,7.5,0.9,9.6,2.6c2,1.8,3.1,4.8,3.1,9.2v21.2 | |||
h-7.6l-1-4.9c-3.2,3.8-7.2,5.7-11.9,5.7c-3.1,0-5.6-0.8-7.6-2.4s-2.9-3.9-2.9-6.8v-3.3c0-2.6,0.9-4.6,2.6-6 | |||
c1.7-1.4,4.1-2.1,7.2-2.1h11.5v-1.4c0-1.6-0.4-2.8-1.1-3.3c-0.7-0.6-2.1-0.8-4.1-0.8C125.9,394.9,121.4,395.1,115.9,395.5z | |||
M122.9,409.4v1.2c0,2.2,1.3,3.3,3.8,3.3c2.6,0,5.3-1,8-3.1v-4.5H126C124,406.4,122.9,407.4,122.9,409.4z"/> | |||
<linearGradient id="SVGID_11_" gradientUnits="userSpaceOnUse" x1="-136.063" y1="2203.667" x2="-136.063" y2="2254.5491" gradientTransform="matrix(1 0 0 1 86 -1815.5)"> | |||
<stop offset="0" style="stop-color:#FFFFFE"/> | |||
<stop offset="0.4815" style="stop-color:#F2F1F1"/> | |||
<stop offset="1" style="stop-color:#E9E7E8"/> | |||
</linearGradient> | |||
<path fill="url(#SVGID_11_)" d="M-43.5,406.1c-0.9-1.6-1.9-2.7-3-3.5v-0.1c1.3-0.9,2.3-1.9,3-3.1l8.3-11.1H-46l-7.9,11.2h-3 | |||
c0.3-1.8,0.5-3.7,0.5-5.9v-18.8h-3l-6.7,9.5v36.1h9.6v-10.1c0-1.3-0.2-2.9-0.5-4.8h3.1l9,14.9H-34L-43.5,406.1z"/> | |||
<linearGradient id="SVGID_12_" gradientUnits="userSpaceOnUse" x1="-16.68" y1="2203.667" x2="-16.68" y2="2254.551" gradientTransform="matrix(1 0 0 1 86 -1815.5)"> | |||
<stop offset="0" style="stop-color:#FFFFFE"/> | |||
<stop offset="0.4815" style="stop-color:#F2F1F1"/> | |||
<stop offset="1" style="stop-color:#E9E7E8"/> | |||
</linearGradient> | |||
<path fill="url(#SVGID_12_)" d="M76.7,413.2h-2.6c-2.4,0-3.6-1.1-3.6-3.3v-35.1h-3l-6.6,9.4v28.2c0,2.8,0.8,5,2.5,6.5 | |||
c1.6,1.5,3.9,2.3,6.8,2.3c3.5,0,6-0.4,7.7-1.3L76.7,413.2z"/> | |||
<linearGradient id="SVGID_13_" gradientUnits="userSpaceOnUse" x1="78.107" y1="2203.667" x2="78.107" y2="2254.5491" gradientTransform="matrix(1 0 0 1 86 -1815.5)"> | |||
<stop offset="0" style="stop-color:#FFFFFE"/> | |||
<stop offset="0.4815" style="stop-color:#F2F1F1"/> | |||
<stop offset="1" style="stop-color:#E9E7E8"/> | |||
</linearGradient> | |||
<path fill="url(#SVGID_13_)" d="M170.7,406.1c-0.9-1.6-1.9-2.7-3-3.5v-0.1c1.3-0.9,2.3-1.9,3-3.1l8.3-11.1h-10.8l-7.9,11.2h-3 | |||
c0.3-1.8,0.5-3.7,0.5-5.9v-18.8h-3l-6.7,9.5v36.1h9.6v-10.1c0-1.3-0.2-2.9-0.5-4.8h3.1l9,14.9h10.8L170.7,406.1z"/> | |||
</g> | |||
<linearGradient id="SVGID_14_" gradientUnits="userSpaceOnUse" x1="-208.281" y1="2186.001" x2="-208.281" y2="2196.1689" gradientTransform="matrix(1 0 0 1 86 -1815.5)"> | |||
<stop offset="0" style="stop-color:#00639A"/> | |||
<stop offset="0.2355" style="stop-color:#00578A"/> | |||
<stop offset="0.507" style="stop-color:#004D7B"/> | |||
<stop offset="0.7167" style="stop-color:#004773"/> | |||
<stop offset="1" style="stop-color:#00446E"/> | |||
</linearGradient> | |||
<polygon fill="url(#SVGID_14_)" points="-122.3,372.4 -131.3,370.4 -132.3,374.1 -122.3,379.2 -112.2,374.1 -113.2,370.4 "/> | |||
<polyline opacity="0.2" enable-background="new " points="-122.3,379.2 -112.2,374.1 -113.2,370.4 -122.3,372.4 "/> | |||
<path fill="#034672" d="M-127.2,391.9c3.4,1.3,6.7,1.5,9.8,0.4l-0.3-2.2c-2.6,0.8-6.3,0.7-9.5,0.1L-127.2,391.9z"/> | |||
<path fill="#034672" d="M-122.6,391.5c-0.4,2.8,1.9,4.7,1.9,7.6C-116.8,394.8-121.7,393.3-122.6,391.5z"/> | |||
<path fill="#034672" d="M-122.6,391.7c-0.1,3.2-0.4,5.6-1.7,7.2C-126.8,394.2-123.7,392.6-122.6,391.7z"/> | |||
<circle fill="#034672" cx="-122.6" cy="391.7" r="1.6"/> | |||
<linearGradient id="SVGID_15_" gradientUnits="userSpaceOnUse" x1="-197.511" y1="2237.772" x2="-197.511" y2="2237.772" gradientTransform="matrix(1 0 0 1 86 -1815.5)"> | |||
<stop offset="0" style="stop-color:#F6F6F6"/> | |||
<stop offset="0.5386" style="stop-color:#E4E4E4"/> | |||
<stop offset="1" style="stop-color:#DADADA"/> | |||
</linearGradient> | |||
<path fill="url(#SVGID_15_)" d="M-111.5,422.3"/> | |||
</g> | |||
</svg> |
@ -0,0 +1,5 @@ | |||
parent=base | |||
import=common/keycloak | |||
styles=css/styles.css css/mytheme.css | |||
stylesCommon=node_modules/patternfly/dist/css/patternfly.min.css node_modules/patternfly/dist/css/patternfly-additions.min.css node_modules/select2/select2.css lib/angular/treeview/css/angular.treeview.css node_modules/text-security/text-security.css css/mytheme.css |
@ -0,0 +1 @@ | |||
parent=base |
@ -0,0 +1,13 @@ | |||
<#import "template.ftl" as layout> | |||
<@layout.registrationLayout displayMessage=false; section> | |||
<#if section = "header"> | |||
<div class="header-login-welcome">${msg("error")}</div> | |||
<div class="header-login-title error-welcome">${msg("errorTitle")}</div> | |||
<div class="error-image"></div> | |||
<#elseif section = "form"> | |||
<div id="kc-error-message"> | |||
<p class="instruction">${message.summary?no_esc}</p> | |||
</div> | |||
</#if> | |||
</@layout.registrationLayout> | |||
<div class="juice-footer"> ยฉ 2020-2021, <span>Juice World</span> </div> |
@ -0,0 +1,13 @@ | |||
<#import "template.ftl" as layout> | |||
<@layout.registrationLayout; section> | |||
<#if section = "header"> | |||
<div class="header-login-welcome">${msg("error")}</div> | |||
<div class="header-login-title error-welcome expired-title">${msg("pageExpiredTitle")}</div> | |||
<div class="expired-image"></div> | |||
<#elseif section = "form"> | |||
<p id="instruction1" class="instruction"> | |||
${msg("pageExpiredMsg1")} | |||
</p> | |||
<a id="loginRestartLink" class="${properties.kcButtonClass!} ${properties.kcButtonBlockClass!} expired-button" href="${url.loginRestartFlowUrl}">${msg("pageExpiredButton")}</a> | |||
</#if> | |||
</@layout.registrationLayout> |
@ -0,0 +1,61 @@ | |||
<#import "template.ftl" as layout> | |||
<@layout.registrationLayout displayInfo=true displayMessage=!messagesPerField.existsError('username'); section> | |||
<#if section = "header"> | |||
<div class="header-login-welcome">${msg("passwordRecovery")}</div> | |||
<div class="header-login-title"> | |||
${msg("emailForgotTitle")} | |||
<br /> | |||
${msg("emailForgotTitle1")} | |||
</div> | |||
<#elseif section = "form"> | |||
<form id="kc-reset-password-form" class="${properties.kcFormClass!}" action="${url.loginAction}" method="post"> | |||
<div class="${properties.kcFormGroupClass!}"> | |||
<div class="email-instruction"> | |||
${msg("emailInstruction")} | |||
<br /> | |||
${msg("emailInstruction1")} | |||
</div> | |||
<div class="${properties.kcFormGroupClass!}"> | |||
<#if auth?has_content && auth.showUsername()> | |||
<input type="text" id="username" name="username" class="${properties.kcInputClass!}" autocomplete="off" autofocus value="${auth.attemptedUsername}"aria-invalid="<#if messagesPerField.existsError('username')>true</#if>"/> | |||
<label class="login-form-input-label">${msg("email")}</label> | |||
<#else> | |||
<input type="text" id="username" name="username" class="${properties.kcInputClass!}" autocomplete="off" autofocus placeholder=${msg("email")} aria-invalid="<#if messagesPerField.existsError('username')>true</#if>"/> | |||
<label class="login-form-input-label">${msg("email")}</label> | |||
</#if> | |||
<#if messagesPerField.existsError('username')> | |||
<div id="input-error-username" class="${properties.kcInputErrorMessageClass!}" aria-live="polite"> | |||
${kcSanitize(messagesPerField.get('username'))?no_esc} | |||
</div> | |||
</#if> | |||
</div> | |||
<div id="kc-form-buttons" > | |||
<input class="${properties.kcButtonClass!} ${properties.kcButtonBlockClass!} ${properties.kcButtonLargeClass!}" type="submit" value="${msg("doSubmit")}"/> | |||
</div> | |||
<div class="${properties.kcFormGroupClass!} ${properties.kcFormSettingClass!}"> | |||
<div id="kc-form-options"> | |||
<#if client?? && client.baseUrl?has_content> | |||
<span><a href="${client.baseUrl}">${kcSanitize(msg("backToLogin"))?no_esc}</a></span> | |||
</#if> | |||
</div> | |||
<div class="${properties.kcFormOptionsWrapperClass!}"> | |||
<div id="kc-registration"> | |||
<span>${msg("haveAccount")} <a tabindex="6" | |||
href="${url.loginUrl}">${msg("signInHere")}</a></span> | |||
</div> | |||
</div> | |||
</div> | |||
</div> | |||
</form> | |||
<#elseif section = "info" > | |||
</#if> | |||
</@layout.registrationLayout> | |||
<div class="juice-footer"> ยฉ 2020-2021, <span>Juice World</span> </div> |
@ -0,0 +1,14 @@ | |||
<#import "template.ftl" as layout> | |||
<@layout.registrationLayout displayInfo=true; section> | |||
<#if section = "header"> | |||
<div class="header-login-welcome">${msg("emailVerifyTitle")}</div> | |||
<div class="header-login-title">${msg("emailVerifyTitle")}</div> | |||
<div class="verify-image"></div> | |||
<#elseif section = "form"> | |||
<p class="instruction">${msg("emailVerifyInstruction1")}</p> | |||
<#elseif section = "info"> | |||
<div class="verify-email-question">${msg("emailVerifyInstruction2")}</div> | |||
<a class="verify-email-link" href="${url.loginAction}"> ${msg("emailVerifyInstruction3")}</a> | |||
</#if> | |||
</@layout.registrationLayout> | |||
<div class="juice-footer"> ยฉ 2020-2021, <span>Juice World</span> </div> |
@ -0,0 +1,122 @@ | |||
<#import "template.ftl" as layout> | |||
<@layout.registrationLayout displayMessage=!messagesPerField.existsError('username','password') displayInfo=realm.password && realm.registrationAllowed && !registrationDisabled??; section> | |||
<#if section = "header"> | |||
<div class="welcome-container"> | |||
<div class="header-login-welcome">${msg("welcome")}</div> | |||
<#if realm.internationalizationEnabled && locale.supported?size gt 1> | |||
<div id="kc-locale"> | |||
<div id="kc-locale-wrapper" class="${properties.kcLocaleWrapperClass!}"> | |||
<div class="kc-dropdown" id="kc-locale-dropdown"> | |||
<a href="#" id="kc-current-locale-link">${locale.current}</a> | |||
<ul> | |||
<#list locale.supported as l> | |||
<#if locale.current==l.label> | |||
<li class="kc-dropdown-item selected ${l.label}"><a href="${l.url}">${l.label}</a></li> | |||
<#else> | |||
<li class="kc-dropdown-item ${l.label}"><a href="${l.url}">${l.label}</a></li> | |||
</#if> | |||
</#list> | |||
</ul> | |||
</div> | |||
</div> | |||
</div> | |||
</#if> | |||
</div> | |||
<div class="header-login-title">${msg("loginAccountTitle")}</div> | |||
<#elseif section = "form"> | |||
<div id="kc-form"> | |||
<div id="kc-form-wrapper"> | |||
<#if realm.password> | |||
<form id="kc-form-login" onsubmit="login.disabled = true; return true;" action="${url.loginAction}" method="post"> | |||
<div class="${properties.kcFormGroupClass!}"> | |||
<#if usernameEditDisabled??> | |||
<input tabindex="1" id="username" class="${properties.kcInputClass!}" name="username" value="${(login.username!'')}" placeholder=${msg("usernameOrEmail")} type="text" disabled /> | |||
<#else> | |||
<input tabindex="1" id="username" class="${properties.kcInputClass!}" name="username" value="${(login.username!'')}" placeholder=${msg("usernameOrEmail")} type="text" autofocus autocomplete="off" | |||
aria-invalid="<#if messagesPerField.existsError('username','password')>true</#if>" | |||
/> | |||
<#if messagesPerField.existsError('username','password')> | |||
<div id="input-error" class="${properties.kcInputErrorMessageClass!}" aria-live="polite"> | |||
${kcSanitize(messagesPerField.getFirstError('username','password'))?no_esc} | |||
</div> | |||
</#if> | |||
<label class="login-form-input-label">${msg("usernameOrEmail")}</label> | |||
</#if> | |||
</div> | |||
<div class="${properties.kcFormGroupClass!}"> | |||
<input tabindex="2" id="password" class="${properties.kcInputClass!}" name="password" type="password" placeholder=${msg("password")} autocomplete="off" | |||
aria-invalid="<#if messagesPerField.existsError('username','password')>true</#if>" | |||
/> | |||
<label class="login-form-input-label">${msg("password")}</label> | |||
</div> | |||
<div id="kc-form-buttons" class="${properties.kcFormGroupClass!}"> | |||
<input type="hidden" id="id-hidden-input" name="credentialId" <#if auth.selectedCredential?has_content>value="${auth.selectedCredential}"</#if>/> | |||
<input tabindex="4" class="${properties.kcButtonClass!} ${properties.kcButtonBlockClass!} ${properties.kcButtonLargeClass!}" name="login" id="kc-login" type="submit" value="${msg("doLogIn")}"/> | |||
</div> | |||
<#if realm.password && social.providers??> | |||
<div id="kc-social-providers" class="${properties.kcFormSocialAccountSectionClass!}"> | |||
<div class="separate-container"> | |||
<div class="separator"></div> | |||
<div class="separate-text">${msg("identity-provider-login-label")} </div> | |||
<div class="separator"></div> | |||
</div> | |||
<ul class="${properties.kcFormSocialAccountListClass!} <#if social.providers?size gt 3>${properties.kcFormSocialAccountListGridClass!}</#if>"> | |||
<#list social.providers as p> | |||
<a id="social-${p.alias}" class="${properties.kcButtonClass!} <#if social.providers?size gt 3>${properties.kcFormSocialAccountGridItem!}</#if> social-button" | |||
type="button" href="${p.loginUrl}"> | |||
<#if p.displayName=="Facebook" > | |||
<div class="login-sign-image facebook"></div> | |||
<#elseif p.displayName=="Twitter" > | |||
<div class="login-sign-image twitter"></div> | |||
<#elseif p.displayName=="Google" > | |||
<div class="login-sign-image google"></div> | |||
<#elseif p.displayName=="LinkedIn" > | |||
<div class="login-sign-image linkedin"></div> | |||
<#elseif p.displayName=="Apple" > | |||
<div class="login-sign-image apple"></div> | |||
<#elseif p.iconClasses?has_content> | |||
<i class="${properties.kcCommonLogoIdP!} ${p.iconClasses!}" aria-hidden="true"></i> | |||
<#else> | |||
<span class="${properties.kcFormSocialAccountNameClass!}">${p.displayName!}</span> | |||
</#if> | |||
</a> | |||
</#list> | |||
</ul> | |||
</div> | |||
</#if> | |||
<div class="signup-terms login-signup-terms">${msg("signinTerms")}</div> | |||
<div> | |||
<div class="${properties.kcFormGroupClass!} ${properties.kcFormSettingClass!}"> | |||
<div id="kc-form-options"> | |||
<#if realm.resetPasswordAllowed> | |||
<span><a tabindex="5" href="${url.loginResetCredentialsUrl}">${msg("doForgotPassword")}</a></span> | |||
</#if> | |||
</div> | |||
<#if realm.password && realm.registrationAllowed && !registrationDisabled??> | |||
<div id="kc-registration-container"> | |||
<div id="kc-registration"> | |||
<span>${msg("noAccount")} <a tabindex="6" | |||
href="${url.registrationUrl}">${msg("signUpHere")}</a></span> | |||
</div> | |||
</div> | |||
</#if> | |||
</div> | |||
</form> | |||
</#if> | |||
</div> | |||
</div> | |||
</#if> | |||
</@layout.registrationLayout> | |||
<div class="juice-footer"> ยฉ 2020-2021, <span>Juice World</span> </div> |
@ -0,0 +1,35 @@ | |||
welcome=Willkommen! | |||
error=Fehler | |||
signinTerms=Mit der Registrierung erkl\u00E4ren Sie sich mit den Nutzungsbedingungen und der Datenschutzerkl\u00E4rung von Juice einverstanden. | |||
signupTerms=Mit der Registrierung erkl\u00E4ren Sie sich mit den Nutzungsbedingungen und der Datenschutzerkl\u00E4rung von Juice einverstanden. | |||
signInHere=Hier anmelden | |||
signUpHere=Mit Email registrieren | |||
passwordRecovery=Passwort wiederherstellen | |||
loginAccountTitle=Anmelden | |||
doRegister=Registrieren | |||
doForgotPassword=Passwort vergessen? | |||
noAccount=Haben Sie ein Konto? | |||
emailForgotTitle=Ihr Passwort | |||
emailForgotTitle1=zur\u00FCcksetzen | |||
emailInstruction=Bitte geben Sie Ihre E-Mail Adresse ein | |||
emailInstruction1=Wir senden Ihnen dann eine E-Mail, um Ihr Passwort zur\u00FCckzusetzen. | |||
doSubmit=E-Mail senden | |||
backToLogin=Zur\u00FCck | |||
haveAccount=Haben Sie ein Konto? | |||
registerTitle=Welcome to the | |||
registerTitle1=JUICE WORLD | |||
emailVerifyTitle=Verifizieren Sie Ihre E-Mail | |||
emailVerifyInstruction1=Sie m\u00FCssen Ihre E-Mail-Adresse verifizieren, um Ihr Konto zu aktivieren. Eine E-Mail mit Anweisungen zur Verifizierung Ihrer E-Mail-Adresse wurde an Sie gesendet | |||
emailVerifyInstruction3=Senden Sie die E-Mail erneut | |||
identity-provider-login-label=Oder registrieren/anmelden mit | |||
pageExpiredTitle=Ihre Sitzung ist abgelaufen | |||
pageExpiredMsg1=Keine Sorge, melden Sie sich einfach erneut an | |||
pageExpiredButton=Gehen Sie zu Anmelden | |||
@ -0,0 +1,33 @@ | |||
welcome=Welcome! | |||
error=Error | |||
signinTerms=By signing up, you agree to Juice''s ToS and Privacy | |||
signupTerms=By signing up, you agree to Juice''s Terms of Use | |||
signInHere=Sign in here | |||
signUpHere=Sign up with the email | |||
passwordRecovery=Password recovery | |||
loginAccountTitle=Sign in | |||
doRegister=Sign up | |||
doForgotPassword=Forgot password? | |||
noAccount=Not a member? | |||
emailForgotTitle=Reset | |||
emailForgotTitle1=your password | |||
emailInstruction=Please enter your email address. | |||
emailInstruction1=We will send you an email to reset your password. | |||
doSubmit=Send email | |||
backToLogin=Go back | |||
haveAccount=Have an account? | |||
registerTitle=Welcome to the | |||
registerTitle1=JUICE WORLD | |||
emailVerifyTitle=Verify your email | |||
emailVerifyInstruction1=You need to verify your email address to activate your account. An email with instructions to verify your email address has been sent to you | |||
emailVerifyInstruction3=Re-send the email | |||
pageExpiredTitle=Your session has expired | |||
pageExpiredMsg1=No worry, simply sign in again | |||
pageExpiredButton=Go to Sign In |
@ -0,0 +1,139 @@ | |||
<#import "template.ftl" as layout> | |||
<@layout.registrationLayout displayMessage=!messagesPerField.existsError('firstName','lastName','email','username','password','password-confirm'); section> | |||
<#if section = "header"> | |||
<div class="welcome-container"> | |||
<div class="header-login-welcome">${msg("welcome")}</div> | |||
<#if realm.internationalizationEnabled && locale.supported?size gt 1> | |||
<div id="kc-locale"> | |||
<div id="kc-locale-wrapper" class="${properties.kcLocaleWrapperClass!}"> | |||
<div class="kc-dropdown" id="kc-locale-dropdown"> | |||
<a href="#" id="kc-current-locale-link">${locale.current}</a> | |||
<ul> | |||
<#list locale.supported as l> | |||
<#if locale.current==l.label> | |||
<li class="kc-dropdown-item selected ${l.label}"><a href="${l.url}">${l.label}</a></li> | |||
<#else> | |||
<li class="kc-dropdown-item ${l.label}"><a href="${l.url}">${l.label}</a></li> | |||
</#if> | |||
</#list> | |||
</ul> | |||
</div> | |||
</div> | |||
</div> | |||
</#if> | |||
</div> | |||
<div class="header-login-title">${msg("registerTitle")} <br /> ${msg("registerTitle1")}</div> | |||
<#elseif section = "form"> | |||
<form id="kc-register-form" action="${url.registrationAction}" method="post"> | |||
<div> | |||
<div class="${properties.kcFormGroupClass!} register-form"> | |||
<input type="text" id="email" class="${properties.kcInputClass!}" name="email" | |||
value="${(register.formData.email!'')}" autocomplete="off" | |||
placeholder=${msg("email")} | |||
aria-invalid="<#if messagesPerField.existsError('email')>true</#if>" | |||
/> | |||
<label class="login-form-input-label">${msg("email")}</label> | |||
<#if messagesPerField.existsError('email')> | |||
<div id="input-error-email" class="${properties.kcInputErrorMessageClass!}" aria-live="polite"> | |||
${kcSanitize(messagesPerField.get('email'))?no_esc} | |||
</div> | |||
</#if> | |||
</div> | |||
<#if passwordRequired??> | |||
<div class="${properties.kcFormGroupClass!} register-form"> | |||
<input type="password" id="password" class="${properties.kcInputClass!}" name="password" | |||
autocomplete="off" | |||
placeholder=${msg("password")} | |||
aria-invalid="<#if messagesPerField.existsError('password','password-confirm')>true</#if>" | |||
/> | |||
<label for="password" class="login-form-input-label">${msg("password")}</label> | |||
<#if messagesPerField.existsError('password')> | |||
<div id="input-error-password" class="${properties.kcInputErrorMessageClass!}" aria-live="polite"> | |||
${kcSanitize(messagesPerField.get('password'))?no_esc} | |||
</div> | |||
</#if> | |||
</div> | |||
<div class="${properties.kcFormGroupClass!}"> | |||
<input type="password" id="password-confirm" class="${properties.kcInputClass!}" | |||
name="password-confirm" autocomplete="off" | |||
placeholder=${msg("passwordConfirm")} | |||
aria-invalid="<#if messagesPerField.existsError('password-confirm')>true</#if>" | |||
/> | |||
<label for="password-confirm" | |||
class="login-form-input-label">${msg("passwordConfirm")}</label> | |||
<#if messagesPerField.existsError('password-confirm')> | |||
<div id="input-error-password-confirm" class="${properties.kcInputErrorMessageClass!}" aria-live="polite"> | |||
${kcSanitize(messagesPerField.get('password-confirm'))?no_esc} | |||
</div> | |||
</#if> | |||
</div> | |||
</#if> | |||
</div> | |||
<#if !realm.registrationEmailAsUsername> | |||
<div> | |||
<div> | |||
<label for="username" class="${properties.kcLabelClass!}">${msg("username")}</label> | |||
</div> | |||
<div> | |||
<input type="text" id="username" name="username" | |||
value="${(register.formData.username!'')}" autocomplete="off" | |||
aria-invalid="<#if messagesPerField.existsError('username')>true</#if>" | |||
/> | |||
<#if messagesPerField.existsError('username')> | |||
<div id="input-error-username" class="${properties.kcInputErrorMessageClass!}" aria-live="polite"> | |||
${kcSanitize(messagesPerField.get('username'))?no_esc} | |||
</div> | |||
</#if> | |||
</div> | |||
</div> | |||
</#if> | |||
<#if recaptchaRequired??> | |||
<div class="form-group"> | |||
<div class="${properties.kcInputWrapperClass!}"> | |||
<div class="g-recaptcha" data-size="compact" data-sitekey="${recaptchaSiteKey}"></div> | |||
</div> | |||
</div> | |||
</#if> | |||
<div class="${properties.kcFormGroupClass!}"> | |||
<div id="kc-form-buttons"> | |||
<input class="${properties.kcButtonClass!} ${properties.kcButtonBlockClass!} ${properties.kcButtonLargeClass!}" type="submit" value="${msg("doRegister")}"/> | |||
</div> | |||
<div class="signup-terms">${msg("signupTerms")}</div> | |||
</div> | |||
<div> | |||
<div class="${properties.kcFormGroupClass!} ${properties.kcFormSettingClass!}"> | |||
<div id="kc-form-options" class="signup-password"> | |||
<#if realm.resetPasswordAllowed> | |||
<span><a tabindex="5" href="${url.loginResetCredentialsUrl}">${msg("doForgotPassword")}</a></span> | |||
</#if> | |||
</div> | |||
<#if realm.password && realm.registrationAllowed && !registrationDisabled??> | |||
<div id="kc-registration-container"> | |||
<div id="kc-registration"> | |||
<span>${msg("haveAccount")} <a tabindex="6" | |||
href="${url.loginUrl}">${msg("signInHere")}</a></span> | |||
</div> | |||
</div> | |||
</#if> | |||
</div> | |||
</div> | |||
</form> | |||
</#if> | |||
</@layout.registrationLayout> | |||
<div class="juice-footer"> ยฉ 2020-2021, <span>Juice World</span> </div> |
@ -0,0 +1,758 @@ | |||
@font-face { | |||
font-family: "Swis721 Th Bt"; | |||
src: local("Swiss721ThinBT.ttf"), url("../fonts/Swiss721ThinBT.ttf") format("truetype"); | |||
font-weight: 300; | |||
} | |||
@font-face { | |||
font-family: "Swis721 Md BT"; | |||
src: local("Swiss721MediumBT.ttf"), url("../fonts/Swiss721MediumBT.ttf") format("truetype"); | |||
font-weight: 500; | |||
} | |||
@font-face { | |||
font-family: "Roboto"; | |||
src: local("Roboto-Medium.ttf"), url("../fonts/Roboto-Medium.ttf") format("truetype"); | |||
font-weight: 300; | |||
} | |||
.login-pf { | |||
height: 100%; | |||
background: none; | |||
} | |||
.login-pf body { | |||
background: url(../img/juice-bc.svg); | |||
background-repeat: no-repeat; | |||
background-color: #202020; | |||
height: 100%; | |||
display: flex; | |||
align-items: center; | |||
justify-content: center; | |||
} | |||
.login-pf body::before { | |||
position: absolute; | |||
width: 56px; | |||
height: 56px; | |||
content: ""; | |||
top: 56px; | |||
left: 63px; | |||
background: url(../img/juice.svg); | |||
background-repeat: no-repeat; | |||
} | |||
.login-pf-page { | |||
padding-top: 0px; | |||
} | |||
.h1, .h2, .h3, h1, h2, h3 { | |||
margin-top: 0px; | |||
margin-bottom: 0px; | |||
} | |||
#kc-header-wrapper { | |||
padding: 0px 10px; | |||
} | |||
.card-login { | |||
margin: 0 auto; | |||
box-shadow: -8px -8px 32px rgba(101, 101, 101, 0.12), -2px -2px 16px rgba(101, 101, 101, 0.24), 4px 4px 16px rgba(0, 0, 0, 0.3), 8px 8px 32px rgba(0, 0, 0, 0.1); | |||
padding: 56px; | |||
min-width: 440px; | |||
max-width: 440px; | |||
border-radius: 16px; | |||
background-color: #212121; | |||
} | |||
.login-pf-page-header { | |||
background: url(../img/juice.svg); | |||
background-position-x: 63px; | |||
background-position-y: 56px; | |||
background-repeat: no-repeat; | |||
} | |||
.header-login-welcome { | |||
font-family: "Swis721 Th Bt"; | |||
font-style: normal; | |||
font-weight: 300; | |||
font-size: 14px; | |||
line-height: 20px; | |||
color: #98989E; | |||
} | |||
.header-login-title { | |||
padding-top: 4px; | |||
font-family: "Swis721 Th Bt"; | |||
font-style: normal; | |||
font-weight: 300; | |||
font-size: 38px; | |||
line-height: 48px; | |||
letter-spacing: -0.75px; | |||
background: linear-gradient(180deg, #FF9900 0%, #FF7100 100%); | |||
-webkit-background-clip: text; | |||
-webkit-text-fill-color: transparent; | |||
} | |||
.error-welcome { | |||
background: #F52E2E; | |||
-webkit-background-clip: text; | |||
-webkit-text-fill-color: transparent; | |||
} | |||
.error-image { | |||
width: 96px; | |||
height: 96px; | |||
background: url(../img/error.svg); | |||
margin: 32px 0px 12px; | |||
} | |||
.verify-image { | |||
width: 96px; | |||
height: 96px; | |||
background: url(../img/verify-email.svg); | |||
margin: 32px 0px 12px; | |||
} | |||
.instruction { | |||
margin: 0px; | |||
font-family: "Swis721 Th BT"; | |||
font-style: normal; | |||
font-weight: 300; | |||
font-size: 19px; | |||
line-height: 28px; | |||
display: flex; | |||
align-items: center; | |||
letter-spacing: -0.1px; | |||
color: #BDBFBF; | |||
} | |||
#kc-error-message .instruction { | |||
margin: 0px; | |||
font-family: "Swis721 Th BT"; | |||
font-style: normal; | |||
font-weight: 300; | |||
font-size: 19px; | |||
line-height: 28px; | |||
display: flex; | |||
align-items: center; | |||
letter-spacing: -0.1px; | |||
color: #BDBFBF; | |||
} | |||
#kc-info { | |||
margin: 0px; | |||
} | |||
.verify-email-question { | |||
margin-top: 32px; | |||
margin-bottom: 8px; | |||
font-family: "Swis721 Md BT"; | |||
font-style: normal; | |||
font-weight: 500; | |||
font-size: 12px; | |||
line-height: 16px; | |||
display: flex; | |||
align-items: center; | |||
color: #BDBFBF; | |||
} | |||
.login-pf-page .login-pf-signup a { | |||
margin-left: 0px; | |||
} | |||
.login-pf-page .login-pf-settings { | |||
flex-wrap: nowrap; | |||
} | |||
.verify-email-link { | |||
margin-left: 0px; | |||
font-family: "Swis721 Md BT"; | |||
font-style: normal; | |||
font-weight: 500; | |||
font-size: 12px; | |||
line-height: 16px; | |||
display: flex; | |||
align-items: center; | |||
text-align: right; | |||
color: #FF7100; | |||
} | |||
a.verify-email-link:hover { | |||
color: #FF7100; | |||
} | |||
#kc-page-title{ | |||
text-align: left; | |||
} | |||
#kc-form-buttons { | |||
margin-top: 32px; | |||
margin-bottom: 32px; | |||
} | |||
.pf-c-button { | |||
height: 56px; | |||