From 64204578c258dcbf2463d5b2595dd2c4c53e6c75 Mon Sep 17 00:00:00 2001 From: Thomas Lenz Date: Thu, 16 Aug 2018 16:44:27 +0200 Subject: update CSS and default templates --- .../conf/moa-id/htmlTemplates/css_template.css | 195 +++++++++------------ .../moa/id/auth/frontend/utils/FormBuildUtils.java | 4 +- .../src/main/resources/mainGUI/img/eIDAS_small.png | Bin 36713 -> 42602 bytes .../src/main/resources/templates/css_template.css | 195 +++++++++------------ 4 files changed, 174 insertions(+), 220 deletions(-) diff --git a/id/server/data/deploy/conf/moa-id/htmlTemplates/css_template.css b/id/server/data/deploy/conf/moa-id/htmlTemplates/css_template.css index 40e8eae7a..3fc7f934c 100644 --- a/id/server/data/deploy/conf/moa-id/htmlTemplates/css_template.css +++ b/id/server/data/deploy/conf/moa-id/htmlTemplates/css_template.css @@ -6,6 +6,7 @@ background-color : #fff; text-align: left; background-color: #E6E6E6; + font-family: Arial, Helvetica, sans-serif; } .browserInfoButton{ @@ -14,19 +15,18 @@ #page { display: block; - margin: 0 auto; + margin: auto; margin-top: 5%; position: relative; background: rgb(255,255,255); } #page1 { - padding-top: 1%; text-align: center; } #main { - float:left; + padding-top: 2%; width: 100%; text-align: center; } @@ -43,20 +43,24 @@ min-height: 155px; margin-bottom: 5%; } + #mandateLogin { + display:flex; + flex-direction: row; padding-bottom: 1%; padding-top: 2%; + margin-left: 1%; position: relative; - text-align: left; - } + font-size: 0.75em; + } .unvisible { - visibility: hidden; + display:none; } .OA_header { - /* background-color: white;*/ font-size: 2.1em; + padding-top:1%; margin-bottom: 1%; margin-top: 1%; } @@ -73,31 +77,35 @@ } #processSelectionArea { - width: 550px; - margin-left: 25px; - margin-top: 35px; + float:left; + width: 100%; } .processSelectionButtonArea { - float: none; - margin-bottom: 5%; - height: 35px; + width:100%; } .processSelectionButton { background: #ababab; cursor: pointer; - height: 40px; - width: 200px; + height: 40%; + width: 25%; float: right; + padding-top: 1%; + padding-bottom: 1% + } + + #bkuselectionarea { + display:flex; + flex-direction: row; + margin-top: 2%; + text-align:center; } .buttonDescription { - float: left; - margin-left: 10px; - padding-bottom: 0.4em; + width: 62%; + margin-left: 1%; text-align: left; - width: 60%; } #processContent { @@ -109,46 +117,29 @@ margin-right: 5px; } - #bkukarte { - float:left; - width:33%; - text-align:center; - margin-top: 2%; + .bkuimage { + width: 50%; } - #bkuhandy { - float:left; - width:33%; - text-align:center; - margin-top: 2%; + input { + cursor: pointer; } - #bkueulogin { - display:block; - float:left; - text-align:center; - width:33%; - margin-top: 2%; + #bkuselectionarea input[type=button],#bkuselectionarea input[type=submit]{ + font-size: 0.85em; + width:65%; + border:none; + background-color: transparent; } - .bkuimage { - width: 55%; - } + #localBKU input { + display: inline-block; - input { - width:auto; - cursor: pointer; - } - - #localBKU input { - display: inline-block; - - } - #localBKU input:hover, #localBKU input:focus, #localBKU input:active { - /*text-decoration: underline;*/ - } + #localBKU input:hover, #localBKU input:focus, #localBKU input:active { + /*text-decoration: underline;*/ + } #installJava, #BrowserNOK { clear:both; @@ -159,40 +150,26 @@ #ssoSessionTransferBlock { clear: both; - } + } #stork { clear: both; - } - - + } - .verticalcenter { - vertical-align: middle; - } - .mandate{ - float: left; - margin-left: 2%; font-size: 1.3em; } - #mandateLogin div { - clear: both; - margin-top: -1%; - position: relative; - top: 50%; - } #localBKU { padding-bottom: 4%; - /*padding-top: 4%;*/ position: relative; clear: both; text-align: center; } #selectArea { + float:left; width:90%; padding-left: 4% } @@ -204,6 +181,7 @@ width: 70px; height: 25px; } + #leftcontent { width: 70%; margin-bottom: 4%; @@ -211,6 +189,7 @@ border: 1px solid rgb(0,0,0); margin:auto; } + .hell { background-color : $MAIN_BACKGOUNDCOLOR; color: $MAIN_COLOR; @@ -221,12 +200,11 @@ color: $HEADER_COLOR; } - @media screen and (min-width: 650px) { #page { - width: 650px; - height: 460px; + width: 660px; + height: 460px; } #localBKU p { @@ -235,27 +213,12 @@ #localBKU input{ font-size: 0.85em; - /*border-radius: 5px;*/ - } - - #bkuselectionarea input[type=button],#bkuselectionarea input[type=submit]{ - font-size: 0.85em; - width:65% - } - - #mandateLogin { - font-size: 0.85em; - } - - #alert_area { - width: 500px; - padding-left: 80px; - } + } - #selectArea { + #selectArea { font-size: 15px; padding-bottom: 65px; - } + } #stork h2 { font-size: 1.0em; @@ -269,8 +232,7 @@ width: 100px; height: 30px } - - + #validation { position: absolute; bottom: 0px; @@ -280,7 +242,6 @@ } - @media screen and (max-width: 649px) { body { @@ -321,39 +282,27 @@ display: none; visibility: hidden; } - - + h2#tabheader{ font-size: 1.5em; position: relative; } + .mandate{ - font-size: 1.0em; + font-size: 1.2em; } #leftcontent { - float: left; width:auto; border:none; visibility:visible; margin-bottom: 2%; } + .bkuimage { width: 40%; } - - #bkukarte { - box-sizing: border-box; - } - - #bkuhandy { - box-sizing: border-box; - } - - #bkueulogin { - box-sizing: border-box; - } - + .setAssertionButton_full { background: #efefef; cursor: pointer; @@ -365,4 +314,32 @@ input[type=button],input[type=submit] { width:65%; } -} \ No newline at end of file + + #processInfoArea { + margin-bottom: 4%; + margin-top: 4%; + } + + #processSelectionArea { + flaot:left; + width: 100%; + } + + .processSelectionButton { + flaot:left; + height: 10%; + width: 2%; + } + + .buttonDescription { + float: left; + width: 70%; + text-align: left; + } + + #processContent { + margin-top: 10%; + } + +} + diff --git a/id/server/moa-id-frontend-resources/src/main/java/at/gv/egovernment/moa/id/auth/frontend/utils/FormBuildUtils.java b/id/server/moa-id-frontend-resources/src/main/java/at/gv/egovernment/moa/id/auth/frontend/utils/FormBuildUtils.java index 248bde700..8e4e7e5b3 100644 --- a/id/server/moa-id-frontend-resources/src/main/java/at/gv/egovernment/moa/id/auth/frontend/utils/FormBuildUtils.java +++ b/id/server/moa-id-frontend-resources/src/main/java/at/gv/egovernment/moa/id/auth/frontend/utils/FormBuildUtils.java @@ -62,7 +62,7 @@ public class FormBuildUtils { defaultmap.put(PARAM_MAIN_BACKGROUNDCOLOR, "#F7F8F7"); defaultmap.put(PARAM_MAIN_COLOR, "#000000"); - defaultmap.put(PARAM_HEADER_BACKGROUNDCOLOR, "#C3D2E2"); + defaultmap.put(PARAM_HEADER_BACKGROUNDCOLOR, "#F7F8F7"); defaultmap.put(PARAM_HEADER_COLOR, "#000000"); defaultmap.put(PARAM_HEADER_TEXT, "Login"); @@ -70,7 +70,7 @@ public class FormBuildUtils { defaultmap.put(PARAM_BUTTON_BACKGROUNDCOLOR_FOCUS, "#EBEBEB"); defaultmap.put(PARAM_BUTTON_COLOR, "#000000"); - defaultmap.put(PARAM_FONTFAMILY, "Verdana,Geneva,Arial,sans-serif"); + defaultmap.put(PARAM_FONTFAMILY, "Arial,Helvetica,sans-serif"); defaultmap.put(PARAM_REDIRECTTARGET, "_top"); } diff --git a/id/server/moa-id-frontend-resources/src/main/resources/mainGUI/img/eIDAS_small.png b/id/server/moa-id-frontend-resources/src/main/resources/mainGUI/img/eIDAS_small.png index 6c785bf06..7d8b10c37 100644 Binary files a/id/server/moa-id-frontend-resources/src/main/resources/mainGUI/img/eIDAS_small.png and b/id/server/moa-id-frontend-resources/src/main/resources/mainGUI/img/eIDAS_small.png differ diff --git a/id/server/moa-id-frontend-resources/src/main/resources/templates/css_template.css b/id/server/moa-id-frontend-resources/src/main/resources/templates/css_template.css index 40e8eae7a..3fc7f934c 100644 --- a/id/server/moa-id-frontend-resources/src/main/resources/templates/css_template.css +++ b/id/server/moa-id-frontend-resources/src/main/resources/templates/css_template.css @@ -6,6 +6,7 @@ background-color : #fff; text-align: left; background-color: #E6E6E6; + font-family: Arial, Helvetica, sans-serif; } .browserInfoButton{ @@ -14,19 +15,18 @@ #page { display: block; - margin: 0 auto; + margin: auto; margin-top: 5%; position: relative; background: rgb(255,255,255); } #page1 { - padding-top: 1%; text-align: center; } #main { - float:left; + padding-top: 2%; width: 100%; text-align: center; } @@ -43,20 +43,24 @@ min-height: 155px; margin-bottom: 5%; } + #mandateLogin { + display:flex; + flex-direction: row; padding-bottom: 1%; padding-top: 2%; + margin-left: 1%; position: relative; - text-align: left; - } + font-size: 0.75em; + } .unvisible { - visibility: hidden; + display:none; } .OA_header { - /* background-color: white;*/ font-size: 2.1em; + padding-top:1%; margin-bottom: 1%; margin-top: 1%; } @@ -73,31 +77,35 @@ } #processSelectionArea { - width: 550px; - margin-left: 25px; - margin-top: 35px; + float:left; + width: 100%; } .processSelectionButtonArea { - float: none; - margin-bottom: 5%; - height: 35px; + width:100%; } .processSelectionButton { background: #ababab; cursor: pointer; - height: 40px; - width: 200px; + height: 40%; + width: 25%; float: right; + padding-top: 1%; + padding-bottom: 1% + } + + #bkuselectionarea { + display:flex; + flex-direction: row; + margin-top: 2%; + text-align:center; } .buttonDescription { - float: left; - margin-left: 10px; - padding-bottom: 0.4em; + width: 62%; + margin-left: 1%; text-align: left; - width: 60%; } #processContent { @@ -109,46 +117,29 @@ margin-right: 5px; } - #bkukarte { - float:left; - width:33%; - text-align:center; - margin-top: 2%; + .bkuimage { + width: 50%; } - #bkuhandy { - float:left; - width:33%; - text-align:center; - margin-top: 2%; + input { + cursor: pointer; } - #bkueulogin { - display:block; - float:left; - text-align:center; - width:33%; - margin-top: 2%; + #bkuselectionarea input[type=button],#bkuselectionarea input[type=submit]{ + font-size: 0.85em; + width:65%; + border:none; + background-color: transparent; } - .bkuimage { - width: 55%; - } + #localBKU input { + display: inline-block; - input { - width:auto; - cursor: pointer; - } - - #localBKU input { - display: inline-block; - - } - #localBKU input:hover, #localBKU input:focus, #localBKU input:active { - /*text-decoration: underline;*/ - } + #localBKU input:hover, #localBKU input:focus, #localBKU input:active { + /*text-decoration: underline;*/ + } #installJava, #BrowserNOK { clear:both; @@ -159,40 +150,26 @@ #ssoSessionTransferBlock { clear: both; - } + } #stork { clear: both; - } - - + } - .verticalcenter { - vertical-align: middle; - } - .mandate{ - float: left; - margin-left: 2%; font-size: 1.3em; } - #mandateLogin div { - clear: both; - margin-top: -1%; - position: relative; - top: 50%; - } #localBKU { padding-bottom: 4%; - /*padding-top: 4%;*/ position: relative; clear: both; text-align: center; } #selectArea { + float:left; width:90%; padding-left: 4% } @@ -204,6 +181,7 @@ width: 70px; height: 25px; } + #leftcontent { width: 70%; margin-bottom: 4%; @@ -211,6 +189,7 @@ border: 1px solid rgb(0,0,0); margin:auto; } + .hell { background-color : $MAIN_BACKGOUNDCOLOR; color: $MAIN_COLOR; @@ -221,12 +200,11 @@ color: $HEADER_COLOR; } - @media screen and (min-width: 650px) { #page { - width: 650px; - height: 460px; + width: 660px; + height: 460px; } #localBKU p { @@ -235,27 +213,12 @@ #localBKU input{ font-size: 0.85em; - /*border-radius: 5px;*/ - } - - #bkuselectionarea input[type=button],#bkuselectionarea input[type=submit]{ - font-size: 0.85em; - width:65% - } - - #mandateLogin { - font-size: 0.85em; - } - - #alert_area { - width: 500px; - padding-left: 80px; - } + } - #selectArea { + #selectArea { font-size: 15px; padding-bottom: 65px; - } + } #stork h2 { font-size: 1.0em; @@ -269,8 +232,7 @@ width: 100px; height: 30px } - - + #validation { position: absolute; bottom: 0px; @@ -280,7 +242,6 @@ } - @media screen and (max-width: 649px) { body { @@ -321,39 +282,27 @@ display: none; visibility: hidden; } - - + h2#tabheader{ font-size: 1.5em; position: relative; } + .mandate{ - font-size: 1.0em; + font-size: 1.2em; } #leftcontent { - float: left; width:auto; border:none; visibility:visible; margin-bottom: 2%; } + .bkuimage { width: 40%; } - - #bkukarte { - box-sizing: border-box; - } - - #bkuhandy { - box-sizing: border-box; - } - - #bkueulogin { - box-sizing: border-box; - } - + .setAssertionButton_full { background: #efefef; cursor: pointer; @@ -365,4 +314,32 @@ input[type=button],input[type=submit] { width:65%; } -} \ No newline at end of file + + #processInfoArea { + margin-bottom: 4%; + margin-top: 4%; + } + + #processSelectionArea { + flaot:left; + width: 100%; + } + + .processSelectionButton { + flaot:left; + height: 10%; + width: 2%; + } + + .buttonDescription { + float: left; + width: 70%; + text-align: left; + } + + #processContent { + margin-top: 10%; + } + +} + -- cgit v1.2.3