Skip to content
Snippets Groups Projects
Commit 81da5f78 authored by renater.salaun's avatar renater.salaun
Browse files

O.Lumineau : using flexbox for test accounts presentation.

Show account details boxes now using modal window intergation


git-svn-id: https://svn.geant.net/GEANT/edugain_testidp_account_manager/trunk@84 047e039d-479c-447e-8a29-aa6bf4a09bab
parent b1d99fb6
Branches
Tags
No related merge requests found
...@@ -209,24 +209,45 @@ button:hover, .button:hover{ ...@@ -209,24 +209,45 @@ button:hover, .button:hover{
/* Accounts profile page*/ /* Accounts profile page*/
.accounts_profile{ .accounts_profile{
box-sizing:border-box; box-sizing:border-box;
min-width: 30%;
display: flex;
flex-flow: row wrap;
justify-content: space-between;
align-items: stretch;
} }
/* .accounts_profile > div {
.accounts_profile ol{ flex: 1 0 20em;
width: 100%; display: block; /* IE fix */
margin-top:2rem; margin-right:1em;
margin-left:0;
} }
.accounts_profile li{
margin-top:1rem;
margin-bottom:1rem;
}
*/
.accounts_profile table{
.accounts_profile div table{
width:100%; width:100%;
margin-top:2rem; margin-top:2rem;
table-layout: fixed;
word-wrap: break-word;
}
.accounts_profile div table tr th:nth-child(1){
width:40%;
} }
.accounts_profile div table tr:nth-child(3) div{
display:flex;
margin:0;
padding:0;
height:10em;
overflow-y:scroll;
}
.accounts_profile div table tr:nth-child(3) div p{
margin:auto;
display: block; /* IE fix */
font-size: 0.875rem;
line-height: 1.125;
}
.show_account_details{ .show_account_details{
margin-bottom:0; margin-bottom:0;
padding:0.5rem 1rem; padding:0.5rem 1rem;
......
<h3>Test Accounts</h3>
<script type="text/javascript"> <script type="text/javascript">
jQuery(document).ready(function($){ jQuery(document).ready(function($){
...@@ -26,37 +24,58 @@ jQuery(document).ready(function($){ ...@@ -26,37 +24,58 @@ jQuery(document).ready(function($){
<div class="row"> <div class="row">
<h2>Test Accounts</h2>
<div class="alert-box success radius"> <div class="alert-box success radius">
<strong>Success:</strong> Your identity as administrator of the Service Provider with entityID <strong>[% sp_entityid %]</strong> could successfully be validated! <strong>Success:</strong> Your identity as administrator of the Service Provider with entityID <strong>[% sp_entityid %]</strong> could successfully be validated!
</div> </div>
<h4>The following test accounts with different profiles were created for you:</h4> <h3>The following test accounts with different profiles were created for you:</h3>
<div class="accounts_profile"> <div class="accounts_profile">
[% FOREACH account IN test_accounts %] [% FOREACH account IN test_accounts %]
[% PROCESS "${account.get('account_profile')}.tt2" %] [% PROCESS "${account.get('account_profile')}.tt2" %]
<div>
<table> <table>
<caption>Account profile: [% account_profile.type %]</caption> <caption>Account profile: [% account_profile.type %]</caption>
<tr> <tr>
<th>user name:</th><td> user[% account.get('id') %]</td> <th>user name:</th><td> user[% account.get('id') %]</td>
</tr> </tr>
<tr> <tr>
<th>user password:</th><td>[% account.get('user_password') %]</td> <th>user password:</th><td>[% account.get('user_password') %]</td>
</tr> </tr>
<tr> <tr>
<th>comment:</th><td>[% account_profile.comment %]</td> <th>comment:</th><td><div><p>[% account_profile.comment %]</p></div></td>
</tr> </tr>
<tr> <tr>
<td colspan=2 class="align-center" ><button class="show_account_details" id="show_account_details_[% account.get('id') %]">show account details</button></td> <td colspan=2 class="align-center" ><button data-reveal-id="account_details_[% account.get('id') %]" class="show_account_details" id="show_account_details_[% account.get('id') %]">show account details</button></td>
</tr> </tr>
</table> </table>
</div>
<div class="account_details" id="account_details_[% account.get('id') %]"> <div class="accounts_profile reveal-modal" data-reveal id="account_details_[% account.get('id') %]"> <!-- old version : class="account_details"-->
Below is the list of user attributes associated to this test account. After a successfull authentication process these attributes are transmited <h3>List of user attributes associated</h3>
via the SAML protocol from the Test Identity Provider to your Service Provider. <p>Below is the list of user attributes associated to this test account. After a successfull authentication process these attributes are transmited
via the SAML protocol from the Test Identity Provider to your Service Provider.</p>
<div>
<table>
<caption>List of user attributes</caption>
[% FOREACH attribute IN account_profile.pairs -%]
[% NEXT IF attribute.key.match('^(type|comment)$') %]
[% IF attribute.value.isa('SCALAR') -%]
<tr>
<th>[% attribute.key %]:</th><td> [% attribute.value %]</td>
</tr>
[% ELSE -%]
<tr>
<th>[% attribute.key %]:</th><td> [% attribute.value.join(",") %]</td>
</tr>
[% END %]
[% END %]
</table>
</div>
<!--
<ul> <ul>
[% FOREACH attribute IN account_profile.pairs -%] [% FOREACH attribute IN account_profile.pairs -%]
[% NEXT IF attribute.key.match('^(type|comment)$') %] [% NEXT IF attribute.key.match('^(type|comment)$') %]
...@@ -67,8 +86,9 @@ jQuery(document).ready(function($){ ...@@ -67,8 +86,9 @@ jQuery(document).ready(function($){
[% END %] [% END %]
[% END %] [% END %]
</ul> </ul>
-->
If you a customized test account with additionnal user attributes, you should contact <a href="mailto:[% conf.support_email %]">[% conf.support_email %]</a>. <div class="alert-box info radius">If you a customized test account with additionnal user attributes, you should contact <a href="mailto:[% conf.support_email %]">[% conf.support_email %]</a>.</div>
<a class="close-reveal-modal">&#215;</a>
</div> </div>
</dl> </dl>
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment