Start separating settings sections into components
This commit is contained in:
parent
c0a9bb5c48
commit
12d8b2b1cb
@ -2,73 +2,7 @@
|
||||
|
||||
<div class="settings">
|
||||
<div class="half-page">
|
||||
<section>
|
||||
<h2>User Settings</h2>
|
||||
|
||||
<div class="half">
|
||||
<h3>Change Password</h3>
|
||||
|
||||
<label for="currentPassword" class="hidden">Current Password</label>
|
||||
<input type="password" id="currentPassword" placeholder="Current Password">
|
||||
|
||||
<label for="newPassword" class="hidden">Current Password</label>
|
||||
<input type="password" id="newPassword" placeholder="New Password">
|
||||
|
||||
<label for="verifyPassword" class="hidden">Current Password</label>
|
||||
<input type="password" id="verifyPassword" placeholder="Verify New Password">
|
||||
|
||||
<button>Change Password</button>
|
||||
<button class="flat">Reset</button>
|
||||
|
||||
<h3 class="tall">All Boards Options</h3>
|
||||
<label>
|
||||
Select default board:
|
||||
<select class="autosize">
|
||||
<option>None</option>
|
||||
</select>
|
||||
</label>
|
||||
<label>
|
||||
New tasks appear at column
|
||||
<select class="autosize">
|
||||
<option>bottom</option>
|
||||
<option>top</option>
|
||||
</select>
|
||||
</label>
|
||||
<label>
|
||||
Display tasks side-by-side in colums?
|
||||
<input type="checkbox">
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="half">
|
||||
<h3>Change Username</h3>
|
||||
|
||||
<label for="username" class="hidden">New Username</label>
|
||||
<input type="text" id="username" placeholder="New Username">
|
||||
|
||||
<button>Change Username</button>
|
||||
<button class="flat">Reset</button>
|
||||
|
||||
<h3 class="tall">Change Email</h3>
|
||||
|
||||
<label for="email" class="hidden">New Email</label>
|
||||
<input type="text" id="email" placeholder="New Email">
|
||||
|
||||
<button>Change Email</button>
|
||||
<button class="flat">Reset</button>
|
||||
|
||||
<div class="hold-bottom">
|
||||
<label>
|
||||
Show animations?
|
||||
<input type="checkbox" checked>
|
||||
</label>
|
||||
<label>
|
||||
Show Assignee on task cards?
|
||||
<input type="checkbox" checked>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<tb-user-settings></tb-user-settings>
|
||||
|
||||
<section>
|
||||
<h2>User Administration</h2>
|
||||
|
@ -1,11 +1,12 @@
|
||||
import { Component } from '@angular/core';
|
||||
|
||||
import { TopNav } from '../shared/index';
|
||||
import { UserSettings } from './user-settings/user-settings.component';
|
||||
|
||||
@Component({
|
||||
selector: 'tb-settings',
|
||||
templateUrl: 'app/settings/settings.component.html',
|
||||
directives: [ TopNav ]
|
||||
directives: [ TopNav, UserSettings ]
|
||||
})
|
||||
export class Settings {
|
||||
}
|
||||
|
68
src/app/settings/user-settings/user-settings.component.html
Normal file
68
src/app/settings/user-settings/user-settings.component.html
Normal file
@ -0,0 +1,68 @@
|
||||
<section>
|
||||
<h2>User Settings</h2>
|
||||
|
||||
<div class="half">
|
||||
<h3>Change Password</h3>
|
||||
|
||||
<label for="currentPassword" class="hidden">Current Password</label>
|
||||
<input type="password" id="currentPassword" placeholder="Current Password">
|
||||
|
||||
<label for="newPassword" class="hidden">Current Password</label>
|
||||
<input type="password" id="newPassword" placeholder="New Password">
|
||||
|
||||
<label for="verifyPassword" class="hidden">Current Password</label>
|
||||
<input type="password" id="verifyPassword" placeholder="Verify New Password">
|
||||
|
||||
<button>Change Password</button>
|
||||
<button class="flat">Reset</button>
|
||||
|
||||
<h3 class="tall">All Boards Options</h3>
|
||||
<label>
|
||||
Select default board:
|
||||
<select class="autosize">
|
||||
<option>None</option>
|
||||
</select>
|
||||
</label>
|
||||
<label>
|
||||
New tasks appear at column
|
||||
<select class="autosize">
|
||||
<option>bottom</option>
|
||||
<option>top</option>
|
||||
</select>
|
||||
</label>
|
||||
<label>
|
||||
Display tasks side-by-side in colums?
|
||||
<input type="checkbox">
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="half">
|
||||
<h3>Change Username</h3>
|
||||
|
||||
<label for="username" class="hidden">New Username</label>
|
||||
<input type="text" id="username" placeholder="New Username">
|
||||
|
||||
<button>Change Username</button>
|
||||
<button class="flat">Reset</button>
|
||||
|
||||
<h3 class="tall">Change Email</h3>
|
||||
|
||||
<label for="email" class="hidden">New Email</label>
|
||||
<input type="text" id="email" placeholder="New Email">
|
||||
|
||||
<button>Change Email</button>
|
||||
<button class="flat">Reset</button>
|
||||
|
||||
<div class="hold-bottom">
|
||||
<label>
|
||||
Show animations?
|
||||
<input type="checkbox" checked>
|
||||
</label>
|
||||
<label>
|
||||
Show Assignee on task cards?
|
||||
<input type="checkbox" checked>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
@ -0,0 +1,9 @@
|
||||
import { Component } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'tb-user-settings',
|
||||
templateUrl: 'app/settings/user-settings/user-settings.component.html'
|
||||
})
|
||||
export class UserSettings {
|
||||
}
|
||||
|
Reference in New Issue
Block a user