Release 1.12.0

.dockerignore

@@ -1 +1,2 @@
 .git
+keycloakSetup

.gitignore

@@ -41,3 +41,5 @@ dist
 
 # Mac files
 .DS_Store
+
+keycloakSetup/docker-compose.yaml

CHANGELOG.md

@@ -5,6 +5,13 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/)
 and this project adheres to [Semantic Versioning](http://semver.org/).
 
+## [1.12.0] - 2024-06-13
+
+### Added
+- Google Analytics code for site analysis [#191](https://github.com/IN-CORE/incore-ui/issues/191)
+
+### Changed
+- Replace Incore Login Page with keycloak login page [#174](https://github.com/IN-CORE/incore-ui/issues/174)
 
 ## [1.11.0] - 2024-04-30
 

Dockerfile

@@ -32,6 +32,7 @@ RUN apk add --no-cache jq
 
 COPY --from=builder /usr/src/app/dist/ /usr/share/nginx/html/
 COPY src/public /usr/share/nginx/html/public/
+COPY src/config /usr/share/nginx/html/config/
 COPY landing.conf /etc/nginx/conf.d/default.conf
 
 WORKDIR /usr/share/nginx/html/tags

keycloakSetup/Dockerfile

@@ -0,0 +1,9 @@
+# This is a dockerfile to create a container for holding custom incore keycloak theme files
+FROM busybox
+
+# set working directory
+WORKDIR /app
+
+# copy your incore theme files into the container
+COPY keycloakThemes/incore-theme /app/keycloak_theme
+

keycloakSetup/keycloakThemes/incore-theme/login/resources/css/styles.css

@@ -0,0 +1,239 @@
+body {
+    background: #F8F8F8;
+    color: #868E96;
+    font-family: "Open Sans", sans-serif;
+    margin: 0;
+}
+
+/*links*/
+a {
+    color: #1c427d;
+    text-decoration: none;
+    font-size: 16px;
+}
+
+/*text inputs*/
+input[type=text],
+input[type=password] {
+    color: #333333;
+    font-size: 16px;
+    margin: 10px 0 25px 0;
+    background: none;
+    padding: 2%;
+    width: 96%;
+    box-sizing: content-box;
+    border: 1px solid #CED4DA;
+    border-radius: 4px;
+}
+
+input[type=text]:hover,
+input[type=text]:focus,
+input[type=text]:focus-visible,
+input[type=text]:active,
+input[type=password]:hover,
+input[type=password]:focus,
+input[type=password]:focus-visible,
+input[type=password]:active {
+    border: 1px solid #666786FF;
+}
+
+/*Submit buttons*/
+input[type=submit] {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    position: relative;
+    box-sizing: border-box;
+    text-decoration: none;
+    border: none;
+    border-radius: 4px;
+    padding: 12px;
+    font-size: 16px;
+    color: #ffffff;
+    background-color: #1B2D45;
+    box-shadow: 0px 3px 1px -2px rgb(0 0 0 / 20%), 0px 2px 2px 0px rgb(0 0 0 / 14%), 0px 1px 5px 0px rgb(0 0 0 / 12%);
+    width: 100%;
+}
+
+input[type=submit]:hover,
+input[type=submit]:focus,
+input[type=submit]:focus-visible,
+input[type=submit]:active {
+    background-color: #191A21FF;
+}
+
+/* Change content to change the title of the page*/
+div#kc-header {
+    width: 100%;
+    background-color: #1B2D45;
+    color: "#fff";
+    display: flex;
+    align-items: center;
+    /* padding: 13px 45px; */
+}
+
+div#kc-header::after {
+    content: '';
+    background-image: url(../img/resilience-logo.png);
+    background-size: contain;
+    background-repeat: no-repeat;
+    margin-left: 50px;
+    margin-bottom: 5px;
+	width: 100%;
+	height: 48px;
+}
+
+/*Sign in to your account*/
+header {
+    margin-top: 5%;
+    text-align: center;
+}
+
+header::before {
+    content: '';
+    display: block;
+    margin: auto;
+    background-image: url(../img/resilience-logo.png);
+    background-size: contain;
+    background-repeat: no-repeat;
+    background-position: center;
+    height: 161px;
+}
+
+h1 {
+    display: block;
+}
+
+div#kc-content {
+    display: block;
+    margin: 20px auto auto auto;
+    width: 30%;
+}
+
+div#kc-content-wrapper {
+    background: #ffffff;
+    padding: 10%;
+    transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+    border-radius: 4px;
+    box-shadow: 0px 2px 1px -1px rgb(0 0 0 / 20%), 0px 1px 1px 0px rgb(0 0 0 / 14%), 0px 1px 3px 0px rgb(0 0 0 / 12%);
+}
+
+
+/* label change Username, Password text*/
+div#kc-form label {
+    color: #868E96 !important;
+    display: block;
+    font-size: 16px;
+}
+
+div#kc-form a,
+div#kc-form-options a {
+    display: block;
+    margin-bottom: 5px;
+}
+
+/**/
+div#kc-form-login {
+    text-align: center;
+}
+
+div#kc-form-options div {
+    display: inline-block;
+    margin-right: 16px;
+    font-size: 25px;
+}
+
+div#kc-form-options div label {
+    font-size: 16px;
+}
+
+div#kc-feedback {
+    box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.5);
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    text-align: center;
+}
+
+div#kc-feedback-wrapper {
+    padding: 1em;
+}
+
+div.feedback-success {
+    color: #1c427d;
+}
+
+div.feedback-warning {
+    color: #CED4DA;
+}
+
+div.feedback-error {
+    color: rgb(19, 46, 87);
+}
+
+div#kc-header-wrapper {
+    display: none;
+}
+
+.pf-c-button{
+    display: none;
+}
+
+div#kc-registration {
+    font-size: 16px;
+    margin-bottom: 20px;
+    margin-top: 2em;
+}
+
+/*div#social-login {*/
+/*    border-left: 1px solid rgba(255, 255, 255, 0.2);*/
+/*    float: right;*/
+/*    width: 150px;*/
+/*    padding: 20px 0 200px 40px;*/
+/*}*/
+
+/*div.social-login span {*/
+/*    display: none;*/
+/*}*/
+
+div#kc-social-providers ul {
+    list-style: none;
+    margin: 0;
+    padding: 0;
+}
+
+/*div#kc-social-providers ul li {*/
+/*    margin-bottom: 20px;*/
+/*}*/
+
+/*div#kc-social-providers ul li span {*/
+/*    display: inline;*/
+/*    width: 100px;*/
+/*}*/
+
+div#kc-social-providers a {
+    display: block;
+    margin: 15px auto;
+    text-align: center;
+    border: solid 0.5px;
+    border-radius: 4px;
+    padding: 5px 0;
+}
+
+/*a.zocial {*/
+/*    border: none;*/
+/*    background: -webkit-linear-gradient(top, rgba(255,255,255,0.8), rgba(255,255,255,0.1)) !important;*/
+/*    background: -moz-linear-gradient(top, rgba(255,255,255,0.8), rgba(255,255,255,0.1)) !important;*/
+/*    background: -ms-linear-gradient(top, rgba(255,255,255,0.8), rgba(255,255,255,0.1)) !important;*/
+/*    background: -o-linear-gradient(top, rgba(255,255,255,0.8), rgba(255,255,255,0.1)) !important;*/
+/*    box-shadow: 0px 0px 6px rgba(0,0,0,0.5);*/
+/*    color: rgba(0,0,0,0.6);*/
+/*    width: 130px;*/
+/*    text-shadow: none;*/
+/*    -webkit-border-radius: 0;*/
+/*    -moz-border-radius: 0;*/
+/*    border-radius: 0;*/
+/*    padding-top: 0.2em;*/
+/*    padding-bottom: 0.2em;*/
+/*}*/