1
0
Fork 0
mirror of https://github.com/documize/community.git synced 2025-08-08 15:05:28 +02:00

global settings UX

This commit is contained in:
Harvey Kandola 2016-06-30 16:02:45 -07:00
parent e34ea468b2
commit e173bccf52
11 changed files with 109 additions and 79 deletions

View file

@ -1,43 +1,45 @@
<div class="input-form">
<form>
<div class="heading">
<div class="title">{{folders.length}} shared {{label}}</div>
<div class="tip">View and change shared space ownership</div>
</div>
<div class="input-control">
<table class="basic-table">
<thead>
<tr>
<th class="bordered">Space</th>
<th class="bordered">Participants</th>
</tr>
</thead>
<tbody>
{{#each folders as |folder|}}
<tr>
<td class="bordered">
{{#link-to 'folders.folder' folder.id folder.slug}}{{folder.name}}{{/link-to}}
</td>
<td class="bordered">
{{#each folder.sharedWith as |person|}}
{{#if person.isEveryone}}
Everyone
{{else}}
<div class="global-folder-settings">
<div class="input-form form-borderless">
<form>
<div class="heading">
<div class="title">{{folders.length}} shared {{label}}</div>
<div class="tip">View and change shared space ownership</div>
</div>
<div class="input-control">
<table class="basic-table">
<thead>
<tr>
<th class="bordered">Space</th>
<th class="bordered">Participants</th>
</tr>
</thead>
<tbody>
{{#each folders as |folder|}}
<tr>
<td class="bordered">
{{#link-to 'folders.folder' folder.id folder.slug class="alt"}}{{folder.name}}{{/link-to}}
</td>
<td class="bordered">
{{#each folder.sharedWith as |person|}}
{{#if person.isEveryone}}
Everyone
{{else}}
{{#if person.isOwner}}
<span class="bold">{{person.firstname}} {{person.lastname}} (owner)</span>
{{else}}
{{person.firstname}} {{person.lastname}}
<a class="action-link" {{action "changeOwner" folder.id person.userId}}>make owner</a>
{{/if}}
{{/if}}
<br/>
{{/each}}
</td>
</tr>
{{/each}}
</tbody>
</table>
</div>
</form>
</div>
{{#if person.isOwner}}
<span class="bold">{{person.firstname}} {{person.lastname}} (owner)</span>
{{else}}
{{person.firstname}} {{person.lastname}}
<a class="action-link" {{action "changeOwner" folder.id person.userId}}>make owner</a>
{{/if}}
{{/if}}
<br/>
{{/each}}
</td>
</tr>
{{/each}}
</tbody>
</table>
</div>
</form>
</div>
</div>

View file

@ -1,4 +1,4 @@
<div class="input-form">
<div class="input-form form-borderless">
<form>
<div class="heading">
<div class="title">General Settings</div>
@ -26,4 +26,4 @@
<div class="regular-button button-blue" {{ action 'save' }}>save</div>
</div>
</form>
</div>
</div>

View file

@ -1,18 +1,30 @@
{{#header/page-navigation settingsMode=true}}
{{header/message-box message="Manage this Documize instance"}}
{{/header/page-navigation}}
{{#layout/zone-container}}
{{#layout/page-container}}
{{#layout/page-sidebar}}
<div class="sidebar-menu">
<ul class="options">
{{#link-to 'customize.general' activeClass='selected' class="option" tagName="li"}}General{{/link-to}}
{{#link-to 'customize.folders' activeClass='selected' class="option" tagName="li"}}Spaces{{/link-to}}
{{#link-to 'customize.users' activeClass='selected' class="option" tagName="li"}}Users{{/link-to}}
</ul>
</div>
{{/layout/page-sidebar}}
{{#layout/page-content}}
{{outlet}}
{{/layout/page-content}}
{{/layout/page-container}}
{{layout/zone-navigation}}
{{#layout/zone-header title="Documize Settings" message="General options, space management, user management"}}
<div class="pull-right">
{{#link-to 'folders.folder' folder.id folder.slug}}
<div class="regular-button button-white">
<i class="material-icons">arrow_back</i>
<div class="name">space</div>
</div>
{{/link-to}}
</div>
{{/layout/zone-header}}
{{#layout/zone-sidebar}}
<div class="sidebar-menu">
<ul class="options">
{{#link-to 'customize.general' activeClass='selected' class="option" tagName="li"}}General{{/link-to}}
{{#link-to 'customize.folders' activeClass='selected' class="option" tagName="li"}}Spaces{{/link-to}}
{{#link-to 'customize.users' activeClass='selected' class="option" tagName="li"}}Users{{/link-to}}
</ul>
</div>
{{/layout/zone-sidebar}}
{{#layout/zone-content}}
{{outlet}}
{{/layout/zone-content}}
{{/layout/zone-container}}

View file

@ -1,4 +1,4 @@
<div class="input-form">
<div class="input-form form-borderless">
<form>
<div class="heading">
<div class="title">Add User</div>
@ -20,4 +20,4 @@
</form>
</div>
<div class="clearfix" /> {{settings/user-list users=model onDelete=(action "onDelete") onSave=(action "onSave") onPassword=(action "onPassword")}}
<div class="clearfix" /> {{settings/user-list users=model onDelete=(action "onDelete") onSave=(action "onSave") onPassword=(action "onPassword")}}

View file

@ -52,6 +52,17 @@ a {
}
}
a.alt {
color: $color-blue;
text-decoration: none;
cursor: pointer;
a:hover, a:focus {
text-decoration: underline;
}
}
$i: 150;
@while $i > 0 {
.margin-#{$i} { margin: #{$i}px; }

View file

@ -28,6 +28,7 @@ $color-stroke: #e1e1e1;
$color-tooltip: #a1a1a1;
$color-toast: #4c4c4c;
$color-checkbox: #115a97;
$color-chip: #98A2AB;
$color-chip: #dff0f9;

View file

@ -1,17 +1,7 @@
.page-container {
.zone-container {
min-height: 500px; //ensure dropdowns render in viewport
}
.copyright {
margin-top: 50px;
text-align: center;
> a {
font-size: 0.8rem;
color: $color-gray;
}
}
.zone-navigation {
background-color: $color-primary;
color: $color-white;
@ -144,3 +134,13 @@
padding: 30px 40px 30px 40px;
float: left;
}
.copyright {
margin-top: 50px;
text-align: center;
> a {
font-size: 0.8rem;
color: $color-gray;
}
}

View file

@ -85,7 +85,7 @@
width: 10px;
margin: 0;
padding: 0;
color: $color-blue;
color: $color-checkbox;
}
}

View file

@ -1,3 +1,7 @@
.global-folder-settings {
}
.user-list {
margin: 30px 0;
@ -21,7 +25,7 @@
}
.checkbox {
color: $color-link;
color: $color-checkbox;
cursor: pointer;
}
}

View file

@ -1,4 +1,4 @@
<div class="page-container">
<div class="zone-container">
<div class="container-fluid">
<div class="row">
{{yield}}

View file

@ -1,6 +1,6 @@
<div class="user-list">
<div class="heading">{{users.length}} users</div>
<table class="basic-table no-table-border">
<table class="basic-table">
<thead>
<tr>
<th class="border-bottom border-top">Firstname</th>
@ -130,4 +130,4 @@
</div>
</div>
<div class="clearfix"></div>
</div>
</div>