diff options
-rw-r--r-- | idp/Dockerfile | 1 | ||||
-rw-r--r-- | idp/templates/edit-webapp/css/NORDUnet.css | 302 | ||||
-rw-r--r-- | idp/templates/edit-webapp/css/main.css | 171 | ||||
-rw-r--r-- | idp/templates/edit-webapp/images/ndn-bg1.png | bin | 0 -> 33778 bytes | |||
-rw-r--r-- | idp/templates/views/layout.vm | 42 | ||||
-rw-r--r-- | idp/templates/views/login.vm | 21 |
6 files changed, 212 insertions, 325 deletions
diff --git a/idp/Dockerfile b/idp/Dockerfile index b110812..0e1efc5 100644 --- a/idp/Dockerfile +++ b/idp/Dockerfile @@ -10,7 +10,6 @@ COPY shibboleth-identity-provider-${IDP_VERSION}.tar.gz /opt/ COPY templates /opt/templates WORKDIR /opt RUN echo $(id) && apk --no-cache add bash apache-ant curl && \ - #curl -O https://shibboleth.net/downloads/identity-provider/${IDP_VERSION}/shibboleth-identity-provider-${IDP_VERSION}.tar.gz && \ sha256sum -c shibboleth-identity-provider-$IDP_VERSION.tar.gz.sha256 && \ tar xf shibboleth-identity-provider-$IDP_VERSION.tar.gz && \ mv shibboleth-identity-provider-$IDP_VERSION shibboleth-identity-provider && \ diff --git a/idp/templates/edit-webapp/css/NORDUnet.css b/idp/templates/edit-webapp/css/NORDUnet.css deleted file mode 100644 index f7c3ef2..0000000 --- a/idp/templates/edit-webapp/css/NORDUnet.css +++ /dev/null @@ -1,302 +0,0 @@ -#wrapper { - width: 100%; - font-family: Arial, Helvetica, sans-serif; - font-size: 12px; - color: #000; - // background: #fff url('images/pipes_back.jpg') repeat-y top left; -} - -#top { - display: block; - width: 100%; - background: #00B2E4 url('images/top_back.gif') repeat-x bottom left; - overflow: hidden; - -} -#top_table { - margin:0; - padding:0; - margin-top: 33px; - width: 900px; - border-collapse: collapse; - margin-bottom: -1px; - - -} - -#top_table td { - vertical-align:bottom; -} - -#top_table td img { - margin-bottom: 20px; - display: block; - padding-right:10px; - -} - -#main_nav { - margin:0; - padding:0; - list-style:none; - color: #fff; - height: 40px; - display: block; - -} - -#main_nav li { - display: block; - float: left; - background: url('images/main_nav_left.gif') no-repeat bottom left; - padding: 0 0 0 11px; - -} -#main_nav li#selectedPage { - background: url('images/main_nav_left_selected.gif') no-repeat bottom left; -} -#main_nav li a { - display: block; - float: left; - padding: 0 11px 0 0; - height: 40px; - color: #fff; - text-decoration: none; - outline: 0; - background: url('images/main_nav_back.gif') no-repeat bottom right; -} - -#main_nav li#selectedPage a { - background: url('images/main_nav_back_selected.jpg') no-repeat bottom right; - color: #000; - -} -#main_nav li a span { - vertical-align: middle; - display: block; - padding-top: 10px; - -} - -#left { - clear: both; - background: #fff url('images/left_back.gif') repeat-y top left; - width: 200px; - float: left; -} - -#search_form { - padding-left: 8px; - width: 200px; - margin: 10px 0 20px 0; -} - -#search_form .input_image { - - vertical-align: middle; -} - -#nav { - - width: 200px; - font-size: 12px; - clear: both; -} - -#nav #intro { - width: 179px; - background: #fff url('images/intro_top.jpg') no-repeat top left; - padding: 15px 10px 1px 10px; -} - -#nav #intro_footer { - width: 199px; - height:27px; - background: #fff url('images/intro_bottom.jpg') no-repeat top left; -} - - -#nav ul.site_tree, -#nav ul.site_tree ul, -#nav ul.site_tree li { - margin: 0; - padding: 0; - list-style: none; - -} -#nav ul.site_tree { - background: transparent url(images/subnavback.gif) no-repeat bottom left; - padding-bottom:2px; -} - -#nav ul.site_tree a { - color: #4F4E4E; - text-decoration: none; - display: block; -} - -#nav ul.site_tree a:hover { - text-decoration: none; -} - -#nav ul.site_tree strong.level1 { - color: #000; - display: block; - background-color: #59BAE7; -} - -#nav ul.site_tree li.level2 { - background: transparent url(images/subnavback.gif) no-repeat top left; -} - - -#nav ul.site_tree a.level1, -#nav ul.site_tree strong.level1 { - padding:5px 0 5px 10px; - -} - -#nav ul.site_tree li.level2 { - display:block; - padding: 5px 0 2px 15px; -} - -#nav ul.site_tree a.level2 { - -} - -#nav #nav_pic { - display: block; - margin: 0; - padding: 0; -} - - -h1 { - font-size: 20px; - color: #004788; -} - -h2 { - font-size: 18px; - color: #004788; -} - -h3 { - font-size: 16px; - color: #004788; -} - -h4 { - font-size: 14px; - color: #004788; -} - -h5 { - font-size: 12px; - color: #004788; -} - -p { - font-size: 12px; - color: #004788; - -} - -ul { - font-size: 12px; - color: #004788; - -} - -#content { - margin-left: 200px; - padding: 20px; - width: auto; - line-height: 1.5em; -} - -#content table { - border-collapse: collapse; -} - -#content th { - background-color: #f0f0f0; - padding: 5px; - color: #036; -} - -#content td { - vertical-align: middle; - padding: 5px; -} - -*html #content table { width:99%; } - -#footer { - clear: both; - width: 100%; - height: 35px; - background-color: #D8D8D8; - border-top: 1px solid #989898; - border-bottom: 1px solid #989898; -} - -#footer p { - vertical-align: middle; - margin: 12px 10px 10px 200px; - font-size: 10px; - color: #848484; -} - -#footer img { - float: left; - margin: 0px 0px 0px 2px; -} - -hr { - border: 0; - color: #696969; - background-color:#696969; - height: 1px; -} - - -#intro img{ - padding-top: 5px; - border: none; -} - -/* Open trouble tickets */ -#opentickets { - margin-left: 200px; - padding: 0 20px 20px 20px; - width: auto; -} - -.blue { -background:#004788 none repeat scroll 0 0; -} - -.text { - font-size: 12px; - color: #004788; -} - -.group_heading { -color:#004788; -font-size:12px; -font-weight:bolder; -} - -.list_info { -background-color:#D9EFFA; -color:#004788; -padding:0.6em; -} - -.whitebold { -color:#FFFFFF; -font-size:12px; -font-weight:bold; -} diff --git a/idp/templates/edit-webapp/css/main.css b/idp/templates/edit-webapp/css/main.css new file mode 100644 index 0000000..edacd5f --- /dev/null +++ b/idp/templates/edit-webapp/css/main.css @@ -0,0 +1,171 @@ +* {
+ margin: 0;
+ padding: 0;
+}
+header, footer, section, nav {
+ display: block;
+}
+html, body {
+ height: 100%;
+}
+body {
+ font-family:Verdana, Geneva, sans-serif;
+ font-size: 12px;
+ line-height: 1.5;
+ color: #717171;
+}
+a:link,
+a:visited {
+ text-decoration: none;
+ color: #717171;
+}
+img {
+ max-width: 100%;
+ margin-bottom: 12px;
+}
+
+header {
+ background-color: #00a8d9;
+ width: 100%;
+}
+
+header img {
+ margin: 0;
+}
+
+form {
+ padding-bottom: 21px;
+}
+form label { /* labels are hidden */
+ font-weight: bold;
+}
+form legend {
+ font-size:1.2em;
+ margin-bottom: 12px;
+}
+.form-element-wrapper {
+ margin-bottom: 12px;
+}
+.form-element {
+ width: 100%;
+ padding: 13px 12px;
+ box-sizing: border-box;
+ border: none;
+ font-size: 14px;
+ border-radius: 4px;
+ -webkit-border-radius: 4px;
+ -moz-border-radius: 4px;
+}
+.form-field {
+ color: #B7B7B7;
+ border: 1px solid #B7B7B7;
+}
+.form-field-focus,
+.form-field:focus,
+input[type="text"]:focus {
+ color: #333333;
+ border-color: #333;
+}
+.form-button {
+ background: #00a8d9;
+ color: #ffffff;
+ cursor: pointer;
+}
+.form-button:hover {
+ background: #00baf1;
+}
+
+.form-error {
+ padding: 0;
+ color: #B61601;
+}
+
+.list-help {
+ list-style: none;
+}
+.list-help-item a {
+ display: block;
+ color: #4F4E4E;
+}
+
+.list-title {
+ font-weight: bold;
+}
+
+.list-title, .list-help-item {
+ padding: 2px 24px;
+}
+
+.item-marker {
+ color: #00a7d9;
+}
+
+footer {
+ color: #ffffff;
+ font-size: 11px;
+ background: #717171;
+ position: fixed;
+ bottom: 0;
+ width: 100%;
+ padding: 12px 20px;
+}
+
+.container.flex-group {
+ /* make space for floating footer */
+ margin: 24px 0 80px
+}
+
+body::after {
+ content: "";
+ background: transparent url('../images/ndn-bg1.png') repeat-y;
+ opacity: 0.5;
+ top: 0;
+ left: 0;
+ bottom: 0;
+ right: 0;
+ position: absolute;
+ z-index: -1;
+}
+
+
+.flex-group {
+ display: flex;
+ flex-flow: row wrap-reverse;
+}
+
+.flex-container {
+ display: flex;
+ flex-flow: row wrap;
+ flex: 1 1 400px;
+}
+
+
+.column {
+ flex: 1 1 400px;
+ max-width: 400px;
+ margin: 0 24px;
+}
+
+nav {
+ flex: 0 0 200px;
+}
+
+@media only screen and (max-width: 599px) {
+ nav {
+ max-width: 400px;
+ flex-grow: 1;
+ }
+ body::after {
+ content: none;
+ }
+ .container.flex-group {
+ margin: 0 10px 80px 10px;
+ }
+
+ .list-help-item a {
+ line-height: 18px;
+ }
+ .column {
+ margin: 0;
+ }
+}
diff --git a/idp/templates/edit-webapp/images/ndn-bg1.png b/idp/templates/edit-webapp/images/ndn-bg1.png Binary files differnew file mode 100644 index 0000000..40c0bca --- /dev/null +++ b/idp/templates/edit-webapp/images/ndn-bg1.png diff --git a/idp/templates/views/layout.vm b/idp/templates/views/layout.vm index 7dca3b5..cbad886 100644 --- a/idp/templates/views/layout.vm +++ b/idp/templates/views/layout.vm @@ -4,25 +4,51 @@ <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0"> - <title>$title - $titleSuffix</title> + + <title>#springMessageText("idp.title", "Web Login Service") #if ($titleSuffix) -$titleSuffix #end </title> <link rel="stylesheet" type="text/css" href="$request.getContextPath()/css/main.css"> </head> <body> <div class="wrapper"> - <div class="container"> <header> - <img src="$request.getContextPath()#springMessage("idp.logo")" alt="#springMessageText("idp.logo.alt-text", "logo")"> - #if ($titleSuffix) - <h3>#springMessageText("idp.title", "Web Login Service") - $titleSuffix</h3> - #end + <div class="container"> + <img src="$request.getContextPath()#springMessage("idp.logo")" alt="#springMessageText("idp.logo.alt-text", "logo")"> + </div> </header> - <div class="content"> + <div class="container flex-group"> + <nav> + <ul class="list list-help"> + <li class="list-title"> + About + </li> + <li class="list-help-item"> + <a href="#springMessageText("idp.url.home", "#")"><span class="item-marker">›</span> #springMessageText("idp.home", "Homepage") + </a> + </li> + <li class="list-help-item"> + <a href="#springMessageText("idp.url.aup", "#")"><span class="item-marker">›</span> #springMessageText("idp.aup", "Acceptable Use Policy") + </a> + </li> + <li class="list-help-item"> + <a href="#springMessageText("idp.url.privacy", "#")"><span class="item-marker">›</span> #springMessageText("idp.privacy", "Privacy Policy") + </a> + </li> + <li class="list-title"> + Tools + </li> + <li class="list-help-item"><a href="#springMessageText("idp.url.password.change", "#")"><span class="item-marker">›</span> #springMessageText("idp.login.change.password", "Change your password")</a></li> + </ul> + </nav> + <div class="content flex-container"> + #if ($titleSuffix) + <h3>#springMessageText("idp.title", "Web Login Service") - $titleSuffix</h3> + #end $!bodyContent </div> </div> <footer> - <div class="contatiner container-footer"> + <div class="container container-footer"> <p class="footer-text">#springMessageText("idp.footer", "Your footer here.")</p> </div> </footer> diff --git a/idp/templates/views/login.vm b/idp/templates/views/login.vm index b4f02d0..b813dc0 100644 --- a/idp/templates/views/login.vm +++ b/idp/templates/views/login.vm @@ -59,11 +59,6 @@ </div> #end - <div class="form-element-wrapper"> - <input id="_shib_idp_revokeConsent" type="checkbox" name="_shib_idp_revokeConsent" value="true"> - <label for="_shib_idp_revokeConsent">#springMessageText("idp.attribute-release.revoke", "Clear prior granting of permission for release of your information to this service.")</label> - </div> - #if ($passwordEnabled) <div class="form-element-wrapper"> <button class="form-element form-button" type="submit" name="_eventId_proceed" @@ -83,6 +78,9 @@ #end </form> + + </div> + <div class="column two"> #* // // SP Description & Logo (optional) @@ -94,6 +92,10 @@ // added SP information. // *# + <h2>$encoder.encodeForHTML($serviceName)</h2> + <p> + #springMessageText("idp.login.sploginTo", "You have asked to login to") $encoder.encodeForHTML($serviceName) + </p> #set ($logo = $rpUIContext.getLogo()) #if ($logo) <img src= "$encoder.encodeForHTMLAttribute($logo)" @@ -103,14 +105,5 @@ #if ($desc) $encoder.encodeForHTML($desc) #end - - </div> - <div class="column two"> - <ul class="list list-help"> - #if ($passwordEnabled) - <li class="list-help-item"><a href="#springMessageText("idp.url.password.reset", "#")"><span class="item-marker">›</span> #springMessageText("idp.login.forgotPassword", "Forgot your password?")</a></li> - #end - <li class="list-help-item"><a href="#springMessageText("idp.url.helpdesk", "#")"><span class="item-marker">›</span> #springMessageText("idp.login.needHelp", "Need Help?")</a></li> - </ul> </div> #end |