Fixes KEYCLOAK-7535 - reupdate resource html

This commit is contained in:
zhutaoredhat 2018-06-29 18:23:15 +08:00 committed by Pedro Igor
parent d0a824dde4
commit b80b480769
6 changed files with 222 additions and 288 deletions

View file

@ -325,7 +325,7 @@ share=Share
resource=Resource
application=Application
date=Date
sharewith=Share with
sharedwith=Shared with
owner=Owner
accessPermissions=Access Permissions
permissionRequests=Permission Requests

View file

@ -8,7 +8,7 @@
<div class="col-sm-12 card-pf resources-list">
<div class="resources-header">
<span class="fa fa-file"></span>
<h1><strong>Alice Family</strong></h1>
<h1>Alice Family</h1>
<div class="resources-actions">
<button class="btn btn-primary"><span class="fa fa-share"></span> {{'share' | translate}}</button>
<div class="dropdown pull-right dropdown-kebab-pf">
@ -29,7 +29,7 @@
<div class="card-pf-body row">
<div class="m-t">
<div id="pf-list-var3" class="list-group list-view-pf list-view-resources list-view-detail">
<div class="list-group-item pfng-list-heading list-view-pf-stacked list-view-pf-top-align">
<div class="list-group-item pfng-list-heading list-view-pf-stacked list-view-pf-top-align margin-bottom-none">
<div class="list-view-pf-actions list-view-master-actions">
<button class="btn btn-default"> {{'approveAll' | translate}}</button>
<div class="dropdown pull-right dropdown-kebab-pf">
@ -42,23 +42,19 @@
</div>
</div>
<div class="list-view-pf-main-info">
<div class="list-view-pf-body">
<div class="list-view-pf-description">
<div class="list-group-item-heading">
{{'sharewith' | translate}} 3 {{'people' | translate}}
<div class="list-view-pf-body row">
<div class="list-group-item-heading col-md-4">
{{'sharedwith' | translate}} 3 {{'people' | translate}}
</div>
</div>
<div class="list-view-pf-additional-info">
<div class="list-view-pf-additional-info-item list-view-pf-additional-info-item-lg">
<div class="col-md-4 list-head-label">
{{'accessPermissions' | translate}}
</div>
<div class="list-view-pf-additional-info-item list-view-pf-additional-info-item-lg">
<div class="col-md-4 list-head-label">
{{'permissionRequests' | translate}}
</div>
</div>
</div>
</div>
</div>
<div class="list-group-item list-view-pf-stacked list-view-pf-top-align">
<div class="list-view-pf-actions">
@ -73,19 +69,15 @@
</div>
</div>
<div class="list-view-pf-main-info">
<div class="list-view-pf-body">
<div class="list-view-pf-description">
<div class="list-group-item-heading">
<div class="user-list-avatar"><span class="fa fa-user"></span></div>
Martin Liu
<div class="list-view-pf-body row">
<div class="list-group-item-heading col-md-4">
Tom Liu
<small>jhonsmith@paternfly.com</small>
</div>
</div>
<div class="list-view-pf-additional-info">
<div class="list-view-pf-additional-info-item list-view-pf-additional-info-item-lg">
<div class="col-md-4">
Read, Battery, Test-date, Status
</div>
<div class="list-view-pf-additional-info-item list-view-pf-additional-info-item-lg permission-requests-labels ">
<div class="col-md-4 permission-requests-labels ">
<ul class="list-inline">
<li>
<span class="label label-info">
@ -110,7 +102,6 @@
</div>
</div>
</div>
</div>
<div class="list-group-item list-view-pf-stacked list-view-pf-top-align">
<div class="list-view-pf-actions">
@ -125,73 +116,61 @@
</div>
</div>
<div class="list-view-pf-main-info">
<div class="list-view-pf-body">
<div class="list-view-pf-description">
<div class="list-group-item-heading">
<div class="user-list-avatar"><span class="fa fa-user"></span></div>
<div class="list-view-pf-body row">
<div class="list-group-item-heading col-md-4">
Martin Liu
<small>mar@paternfly.com</small>
</div>
<div class="col-md-4">
Read, Battery, Test-date
</div>
<div class="col-md-4 permission-requests-labels ">
<ul class="list-inline">
<li>
<span class="label label-info">
Status
<a href="#"><span class="pficon pficon-close"></span></a>
</span>
</li>
<li>
<span class="label label-info">
Time
<a href="#"><span class="pficon pficon-close"></span></a>
</span>
</li>
<li>
<span class="label label-info">
Beta
<a href="#"><span class="pficon pficon-close"></span></a>
</span>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="list-group-item list-view-pf-stacked list-view-pf-top-align">
<div class="list-view-pf-actions">
<div class="dropdown pull-right dropdown-kebab-pf">
<button class="btn btn-link dropdown-toggle" type="button" id="dropdownKebabRight3" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
<span class="fa fa-ellipsis-v"></span>
</button>
<ul class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownKebabRight3">
<li><a href="#"> {{'remove' | translate}}</a></li>
</ul>
</div>
</div>
<div class="list-view-pf-main-info">
<div class="list-view-pf-body row">
<div class="list-group-item-heading col-md-4">
Jhon Smith
<small>jhonsmith@paternfly.com</small>
</div>
<div class="col-md-4">
Read, Battery
</div>
<div class="list-view-pf-additional-info">
<div class="list-view-pf-additional-info-item list-view-pf-additional-info-item-lg">
Read, Battery, Test-date
</div>
<div class="list-view-pf-additional-info-item list-view-pf-additional-info-item-lg permission-requests-labels ">
<ul class="list-inline">
<li>
<span class="label label-info">
Status
<a href="#"><span class="pficon pficon-close"></span></a>
</span>
</li>
<li>
<span class="label label-info">
Time
<a href="#"><span class="pficon pficon-close"></span></a>
</span>
</li>
<li>
<span class="label label-info">
Beta
<a href="#"><span class="pficon pficon-close"></span></a>
</span>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="list-group-item list-view-pf-stacked list-view-pf-top-align">
<div class="list-view-pf-actions">
<!-- <button class="btn btn-default">Approve</button> -->
<div class="dropdown pull-right dropdown-kebab-pf">
<button class="btn btn-link dropdown-toggle" type="button" id="dropdownKebabRight3" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
<span class="fa fa-ellipsis-v"></span>
</button>
<ul class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownKebabRight3">
<li><a href="#"> {{'remove' | translate}}</a></li>
<li><a href="#"> {{'edit' | translate}}</a></li>
</ul>
</div>
</div>
<div class="list-view-pf-main-info">
<div class="list-view-pf-body">
<div class="list-view-pf-description">
<div class="list-group-item-heading">
<div class="user-list-avatar"><span class="fa fa-user"></span></div>
Jhon Wong
<small>jhonsmith@paternfly.com</small>
</div>
</div>
<div class="list-view-pf-additional-info">
<div class="list-view-pf-additional-info-item list-view-pf-additional-info-item-lg">
Read, Battery, Test-date
</div>
<div class="list-view-pf-additional-info-item list-view-pf-additional-info-item-lg permission-requests-labels ">
</div>
<div class="col-md-4 permission-requests-labels ">
</div>
</div>
</div>

View file

@ -9,26 +9,22 @@
</ul>
<div class="m-t">
<div id="pf-list-var3" class="list-group list-view-pf list-view-resources">
<div class="list-group-item pfng-list-heading list-view-pf-stacked list-view-pf-top-align">
<div class="list-group-item pfng-list-heading list-head-labels list-view-pf-stacked list-view-pf-top-align">
<div class="list-view-pf-actions">
</div>
<div class="list-view-pf-main-info">
<div class="list-view-pf-body">
<div class="list-view-pf-description">
<div class="list-group-item-heading">
<div class="list-view-pf-body row">
<div class="col-md-4">
{{'resource' | translate}}
</div>
</div>
<div class="list-view-pf-additional-info">
<div class="list-view-pf-additional-info-item">
<div class="col-md-3">
{{'application' | translate}}
</div>
<div class="list-view-pf-additional-info-item">
<div class="col-md-3">
{{'date' | translate}}
</div>
<div class="list-view-pf-additional-info-item">
{{'sharewith' | translate}}
</div>
<div class="col-md-2">
{{'sharedwith' | translate}}
</div>
</div>
</div>
@ -47,22 +43,18 @@
</div>
</div>
<div class="list-view-pf-main-info">
<div class="list-view-pf-body">
<div class="list-view-pf-description">
<div class="list-group-item-heading">
<div class="list-view-pf-body row">
<div class="col-md-4 list-group-item-heading">
<span class="fa fa-file"></span> <a href="#">Alice Family</a>
</div>
</div>
<div class="list-view-pf-additional-info">
<div class="list-view-pf-additional-info-item">
<div class="col-md-3">
<a href="#">photoz-rest-api</a>
</div>
<div class="list-view-pf-additional-info-item">
12:00 AM
</div>
<div class="list-view-pf-additional-info-item">
<a href="#">5 persons</a>
<div class="col-md-3">
2018/05/15 16:32
</div>
<div class="col-md-2">
<label class="resource-list-label">{{'sharedwith' | translate}}</label> <a href="#"> 3 {{'people' | translate}}</a>
</div>
</div>
</div>
@ -81,22 +73,18 @@
</div>
</div>
<div class="list-view-pf-main-info">
<div class="list-view-pf-body">
<div class="list-view-pf-description">
<div class="list-group-item-heading">
<span class="fa fa-file"></span> <a href="#">Patternfly design document update</a>
<div class="list-view-pf-body row">
<div class="col-md-4 list-group-item-heading">
<span class="fa fa-file"></span> <a href="#">Patternfly 4</a>
</div>
</div>
<div class="list-view-pf-additional-info">
<div class="list-view-pf-additional-info-item">
<div class="col-md-3">
<a href="#">photoz-rest</a>
</div>
<div class="list-view-pf-additional-info-item">
12:00 AM
</div>
<div class="list-view-pf-additional-info-item">
<a href="#">5 persons</a>
<div class="col-md-3">
2018/05/15 12:32
</div>
<div class="col-md-2">
<label class="resource-list-label">{{'sharedwith' | translate}}</label> <a href="#"> 12 {{'people' | translate}}</a>
</div>
</div>
</div>
@ -115,22 +103,18 @@
</div>
</div>
<div class="list-view-pf-main-info">
<div class="list-view-pf-body">
<div class="list-view-pf-description">
<div class="list-group-item-heading">
<span class="fa fa-file"></span> <a href="#">Patternfly design document</a>
<div class="list-view-pf-body row">
<div class="col-md-4 list-group-item-heading">
<span class="fa fa-file"></span> <a href="#">Patternfly document update</a>
</div>
</div>
<div class="list-view-pf-additional-info">
<div class="list-view-pf-additional-info-item ">
<div class="col-md-3">
<a href="#">photoz-rest-api</a>
</div>
<div class="list-view-pf-additional-info-item ">
12:00 AM
</div>
<div class="list-view-pf-additional-info-item">
<a href="#">5 persons</a>
<div class="col-md-3">
2018/05/10 11:32
</div>
<div class="col-md-2">
<label class="resource-list-label">{{'sharedwith' | translate}}</label> <a href="#"> 8 {{'people' | translate}}</a>
</div>
</div>
</div>

View file

@ -8,7 +8,7 @@
<div class="col-sm-12 card-pf resources-list">
<div class="resources-header">
<span class="fa fa-file"></span>
<h1><strong>Alice Family</strong></h1>
<h1>Alice Family</h1>
<div class="resources-info">
<span>Access management</span>
<span><label>{{'application' | translate}}:</label> <a href="#">photoz-rest-api</a> </span>
@ -18,30 +18,26 @@
<div class="card-pf-body row">
<div class="m-t">
<div id="pf-list-var3" class="list-group list-view-pf list-view-resources list-view-detail">
<div class="list-group-item pfng-list-heading list-view-pf-stacked list-view-pf-top-align">
<div class="list-group-item pfng-list-heading list-head-labels list-view-pf-stacked list-view-pf-top-align">
<div class="list-view-pf-actions list-view-space">
</div>
<div class="list-view-pf-main-info">
<div class="list-view-pf-body">
<div class="list-view-pf-description">
<div class="list-group-item-heading">
<div class="list-view-pf-body row">
<div class="list-group-item-heading col-md-4">
{{'sharedwithMe' | translate}}
</div>
</div>
<div class="list-view-pf-additional-info">
<div class="list-view-pf-additional-info-item">
<div class="col-md-3">
{{'accessPermissions' | translate}}
</div>
<div class="list-view-pf-additional-info-item">
<div class="col-md-3">
{{'permissionRequests' | translate}}
</div>
<div class="list-view-pf-additional-info-item">
<div class="col-md-2">
{{'Status' | translate}}
</div>
</div>
</div>
</div>
</div>
<div class="list-group-item list-view-pf-stacked list-view-pf-top-align">
<div class="list-view-pf-actions list-view-pf-status">
@ -55,20 +51,16 @@
</div>
</div>
<div class="list-view-pf-main-info">
<div class="list-view-pf-body">
<div class="list-view-pf-description">
<div class="list-group-item-heading">
<div class="user-list-avatar"><span class="fa fa-user"></span></div>
<div class="list-view-pf-body row">
<div class="list-group-item-heading col-md-4">
Martin Liu (you)
<small>jhonsmith@paternfly.com</small>
</div>
</div>
<div class="list-view-pf-additional-info">
<div class="list-view-pf-additional-info-item">
<div class="list-view-pf-additional-info-item col-md-3 no-paddding-re">
Read, Battery, Test-date, Status
</div>
<div class="list-view-pf-additional-info-item permission-requests-labels my-requests-labels">
<ul class="list-inline">
<div class="col-md-3 permission-requests-labels my-requests-labels no-paddding-re">
<ul class="list-inline m-b-s">
<li>
<span class="label label-info">
Status
@ -86,7 +78,7 @@
</li>
</ul>
</div>
<div class="list-view-pf-additional-info-item">
<div class="col-md-2 no-paddding-re">
<span class="label label-warning">{{'waitingforApproval' | translate}}</span>
</div>
</div>
@ -96,4 +88,3 @@
</div>
</div>
</div>
</div>

View file

@ -9,30 +9,26 @@
</ul>
<div class="m-t">
<div id="pf-list-var3" class="list-group list-view-pf list-view-resources list-view-shared">
<div class="list-group-item pfng-list-heading list-view-pf-stacked list-view-pf-top-align">
<div class="list-group-item pfng-list-heading list-head-labels list-view-pf-stacked list-view-pf-top-align">
<div class="list-view-pf-actions">
</div>
<div class="list-view-pf-main-info">
<div class="list-view-pf-body">
<div class="list-view-pf-description">
<div class="list-group-item-heading">
<div class="list-view-pf-body row">
<div class="list-group-item-heading col-md-4">
{{'resource' | translate}}
</div>
</div>
<div class="list-view-pf-additional-info">
<div class="list-view-pf-additional-info-item">
<div class="col-md-2">
{{'owner' | translate}}
</div>
<div class="list-view-pf-additional-info-item">
<div class="col-md-2">
{{'application' | translate}}
</div>
<div class="list-view-pf-additional-info-item">
<div class="col-md-4 list-responsive-padding">
{{'myPermissions' | translate}}
</div>
</div>
</div>
</div>
</div>
<div class="list-group-item list-view-pf-stacked list-view-pf-top-align">
<div class="list-view-pf-actions">
@ -46,26 +42,22 @@
</div>
</div>
<div class="list-view-pf-main-info">
<div class="list-view-pf-body">
<div class="list-view-pf-description">
<div class="list-group-item-heading">
<div class="list-view-pf-body row">
<div class="list-group-item-heading col-md-4">
<span class="fa fa-file"></span> <a href="#">Open camera</a>
</div>
</div>
<div class="list-view-pf-additional-info">
<div class="list-view-pf-additional-info-item">
<div class="col-md-2">
Chirst Ma
</div>
<div class="list-view-pf-additional-info-item">
<div class="col-md-2">
<a href="#">photoz-rest-api</a>
</div>
<div class="list-view-pf-additional-info-item">
<div class="col-md-4 list-responsive-padding">
Read, Battery, Test-date, Status, Delete
</div>
</div>
</div>
</div>
</div>
<div class="list-group-item list-view-pf-stacked list-view-pf-top-align">
<div class="list-view-pf-actions">
@ -79,26 +71,22 @@
</div>
</div>
<div class="list-view-pf-main-info">
<div class="list-view-pf-body">
<div class="list-view-pf-description">
<div class="list-group-item-heading">
<div class="list-view-pf-body row">
<div class="list-group-item-heading col-md-4">
<span class="fa fa-file"></span> <a href="#">Open company server</a>
</div>
</div>
<div class="list-view-pf-additional-info">
<div class="list-view-pf-additional-info-item">
<div class="col-md-2">
tzhu
</div>
<div class="list-view-pf-additional-info-item">
<div class="col-md-2">
<a href="#">photoz-rest</a>
</div>
<div class="list-view-pf-additional-info-item">
<div class="col-md-4 list-responsive-padding">
Read, Battery
</div>
</div>
</div>
</div>
</div>
<div class="list-group-item list-view-pf-stacked list-view-pf-top-align">
<div class="list-view-pf-actions">
@ -112,22 +100,18 @@
</div>
</div>
<div class="list-view-pf-main-info">
<div class="list-view-pf-body">
<div class="list-view-pf-description">
<div class="list-group-item-heading">
<div class="list-view-pf-body row">
<div class="list-group-item-heading col-md-4">
<span class="fa fa-file"></span> <a href="#">Personal info of Tom Li</a>
</div>
</div>
<div class="list-view-pf-additional-info">
<div class="list-view-pf-additional-info-item ">
<div class="col-md-2">
lijun
</div>
<div class="list-view-pf-additional-info-item ">
<div class="col-md-2">
<a href="#">photoz-rest-api</a>
</div>
<div class="list-view-pf-additional-info-item">
Email, Phone, Address, Avatar, Username…
</div>
<div class="col-md-4 list-responsive-padding">
Email, Phone, Address, Avatar, Username
</div>
</div>
</div>

View file

@ -327,9 +327,6 @@ p.description {
.list-view-pf .list-group-item {
border-bottom: 1px solid #ededed;
}
.list-view-resources .list-view-pf-additional-info-item {
width: 30%;
}
.list-view-resources .list-view-pf-additional-info-item .pficon {
margin-right: 0;
color: #fff;
@ -342,7 +339,7 @@ p.description {
.pfng-list-heading .list-view-pf-main-info {
padding-top: 10px;
padding-bottom: 10px;
font-weight: bold;
font-weight: 600;
font-size: 13px;
}
.list-view-resources .list-view-pf-actions {
@ -351,7 +348,7 @@ p.description {
}
.pfng-list-heading .list-view-pf-additional-info {
font-size: 12px;
font-weight: bold;
font-weight: 600;
}
.list-view-resources .list-view-pf-description {
width: 35%;
@ -383,6 +380,7 @@ p.description {
}
.list-view-resources .content-view-pf-pagination {
border: none;
background-color: #fff;
}
.resources-header {
margin-bottom: 20px;
@ -407,20 +405,12 @@ p.description {
.resources-actions button {
margin-right: 10px;
}
.user-list-avatar {
width: 36px;
height: 36px;
border-radius: 36px;
background-color: #1E97D6;
color: #fff;
float: left;
text-align: center;
line-height: 36px;
margin-right: 10px;
}
.list-view-master-actions {
margin-top: 6px;
}
.permission-requests-labels ul {
margin-bottom: 0;
}
.permission-requests-labels li {
margin-bottom: 5px;
margin-top: 5px;
@ -431,26 +421,22 @@ p.description {
padding-right: 15px;
border-radius: 20px;
}
.permission-requests-labels .pficon-close {
color:#fff;
}
.my-requests-labels .label-info {
background-color: #15B692;
}
.modal-title span {
font-weight: normal;
}
.bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
width: 100%;
}
.resource-share-content {
margin-top: 20px;
}
.resources-list .nav-tabs {
margin-left: 20px;
}
.resources-list .card-pf-body {
padding-bottom: 0;
}
.resources-list .content-view-pf-pagination {
margin-top: 20px;
margin-bottom: -20px;
}
.breadcrumb {
@ -459,14 +445,37 @@ p.description {
.resource-list-label {
display: none;
}
.resources-list .card-pf-body {
padding: 0;
}
@media (max-width: 767px) {
.no-paddding-re {
padding: 0;
}
.permission-requests-labels .m-b-s {
margin-bottom: 10px;
}
.no-paddding-re .label-warning {
margin-top: 10px;
}
.resource-list-label {
display:block;
display: inline-block;
margin-bottom: 0;
margin-right: 5px;
}
.list-responsive-padding {
padding-left: 20px;
overflow: auto;
}
.list-view-pf .list-group-item {
padding-bottom: 10px;
}
.pfng-list-heading.list-group-item {
padding-bottom: 0px;
}
.list-view-resources .list-view-pf-stacked .list-group-item-heading {
font-size: 16px;
margin-bottom: 10px;
}
.list-view-pf-stacked .list-group-item-heading {
margin-right: 10px;
@ -476,9 +485,6 @@ p.description {
display: block;
width: 100%;
}
.resources-info span:first-child{
margin-bottom: 10px;
}
.resources-info span label {
margin-bottom: 0;
}
@ -499,7 +505,6 @@ p.description {
padding: 10px 0;
}
.card-linked-account .list-view-pf-additional-info {
width: 100%;
margin-top: 20px;
}
.card-pf-application h2 a {
@ -535,21 +540,12 @@ p.description {
.resources-list .card-pf-body {
padding: 0;
}
.list-view-resources .list-view-pf-additional-info-item {
width: 100%;
}
.list-view-resources .list-view-pf-additional-info-item-lg {
width: 100%;
}
.list-view-resources .list-view-pf-description {
width: 100%;
}
.list-view-shared .list-view-pf-description {
width: 100%;
}
.resources-list .nav-tabs {
margin-top: 10px;
}
.margin-bottom-none{
padding-bottom: 0;
}
}
/* authenticator style */