Commit 5753e4e5 authored by Markus Scheidgen's avatar Markus Scheidgen
Browse files

Updated keycloak material theme for new look&feel. #346

parent a0a1ef55
Pipeline #74815 passed with stages
in 18 minutes and 10 seconds
## Introduction
This basically uses the "official" 7.0.0 keycloak with some additions
- material theme
......@@ -6,10 +7,17 @@ This basically uses the "official" 7.0.0 keycloak with some additions
- realm definitions for prod and test realm
- scripts for import and export of all users
To build the image:
## To build the image
```
cd registration_form_action
mvn package
cd ..
docker build -t nomad/keycloak .
```
## Running, Developing, Debugging
To run a keycloak container for development/test use the following. The volume mount
will allow you to edit the theme files while keycloak is running.
```
docker run -p 8002:8080 -v `pwd`/material_theme:/opt/jboss/keycloak/themes/material nomad/keycloak
```
\ No newline at end of file
@import url('https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,700,700i');
@import url('https://fonts.googleapis.com/css?family=Titillium+Web:300,300i,400,400i,700,700i');
@import url('https://fonts.googleapis.com/icon?family=Material+Icons');
body {
background: #fafafa;
font-family: 'Roboto', sans-serif;
font-family: 'Titillium Web', sans-serif;
}
a {
color: #008DC3;
}
.title {
margin-bottom: 15px;
color: rgba(0, 0, 0, 0.87);
margin: 32px 0 16px;
font-size: 3rem;
font-family: Titillium Web,sans-serif;
font-weight: 400;
line-height: 1.167;
}
.mdc-button {
......
......@@ -15,13 +15,28 @@ window.onload = function() {
});
// initialize the language select box
var select = new mdc.select.MDCSelect(
document.querySelector('.language-picker .mdc-select')
);
try {
var select = new mdc.select.MDCSelect(
document.querySelector('.language-picker .mdc-select')
);
select.listen('change', function() {
var redirectUrl = document.querySelector('#language-picker-dropdown')
.value;
window.location.href = redirectUrl;
});
select.listen('change', function() {
var redirectUrl = document.querySelector('#language-picker-dropdown')
.value;
window.location.href = redirectUrl;
});
} catch {}
const queryString = window.location.search
const urlParams = new URLSearchParams(queryString)
const redirectUri = urlParams.get('redirect_uri')
const backLink = this.document.querySelector('#mdc-back-link')
backLink.onclick = function() {
if (redirectUri) {
window.location.href = redirectUri;
} else {
window.history.back()
}
}
backLink.innerHTML = redirectUri ? 'back to NOMAD' : 'back';
};
......@@ -74,7 +74,7 @@
</div>
<div class="mdc-back">
<a href="https://nomad-coe.eu">Back to NOMAD</a>
<a id="mdc-back-link" href="#" >back</a>
</div>
<#if realm.internationalizationEnabled>
......
@import url('https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,500,500i');
@import url('https://fonts.googleapis.com/css?family=Titillium+Web:300,300i,400,400i,500,500i');
@import url('https://fonts.googleapis.com/icon?family=Material+Icons');
body {
background: #fafafa;
font-family: 'Roboto', sans-serif;
font-family: 'Titillium Web', sans-serif;
}
a {
color: #008DC3;
}
.title {
margin-bottom: 15px;
color: rgba(0, 0, 0, 0.87);
margin: 32px 0 16px;
font-size: 3rem;
font-family: Titillium Web,sans-serif;
font-weight: 400;
line-height: 1.167;
}
.mdc-button {
......
......@@ -15,13 +15,28 @@ window.onload = function() {
});
// initialize the language select box
var select = new mdc.select.MDCSelect(
document.querySelector('.language-picker .mdc-select')
);
try {
var select = new mdc.select.MDCSelect(
document.querySelector('.language-picker .mdc-select')
);
select.listen('change', function() {
var redirectUrl = document.querySelector('#language-picker-dropdown')
.value;
window.location.href = redirectUrl;
});
select.listen('change', function() {
var redirectUrl = document.querySelector('#language-picker-dropdown')
.value;
window.location.href = redirectUrl;
});
} catch {}
const queryString = window.location.search
const urlParams = new URLSearchParams(queryString)
const redirectUri = urlParams.get('redirect_uri')
const backLink = this.document.querySelector('#mdc-back-link')
backLink.onclick = function() {
if (redirectUri) {
window.location.href = redirectUri;
} else {
window.history.back()
}
}
backLink.innerHTML = redirectUri ? 'back to NOMAD' : 'back';
};
......@@ -73,7 +73,7 @@
</div>
</div>
<div class="mdc-back">
<a href="https://nomad-coe.eu">Back to NOMAD</a>
<a id="mdc-back-link" href="#" >back</a>
</div>
<#if realm.internationalizationEnabled>
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment