Copy in admin edited and added Yes/No to switches to amke it Android Style and UX oriented

stable
Xavier Julián 2014-08-28 14:07:10 +02:00
parent d41113505a
commit 864b9af7ee
6 changed files with 37 additions and 8 deletions

View File

@ -46,7 +46,7 @@ class MembershipsController extends mixOf(taiga.Controller, taiga.PageMixin, tai
constructor: (@scope, @rootscope, @repo, @confirm, @rs, @params, @q, @location, @appTitle) -> constructor: (@scope, @rootscope, @repo, @confirm, @rs, @params, @q, @location, @appTitle) ->
_.bindAll(@) _.bindAll(@)
@scope.sectionName = "Memberships" #i18n @scope.sectionName = "Manage Members" #i18n
@scope.project = {} @scope.project = {}
@scope.filters = {} @scope.filters = {}

View File

@ -47,7 +47,7 @@ class RolesController extends mixOf(taiga.Controller, taiga.PageMixin, taiga.Fil
constructor: (@scope, @rootscope, @repo, @confirm, @rs, @params, @q, @location, @appTitle) -> constructor: (@scope, @rootscope, @repo, @confirm, @rs, @params, @q, @location, @appTitle) ->
_.bindAll(@) _.bindAll(@)
@scope.sectionName = "Roles" #i18n @scope.sectionName = "Permissions" #i18n
@scope.project = {} @scope.project = {}
promise = @.loadInitialData() promise = @.loadInitialData()
@ -208,6 +208,8 @@ RolePermissionsDirective = ($rootscope, $repo, $confirm) ->
<div class="check"> <div class="check">
<input type="checkbox" <% if(permission.active) { %>checked="checked"<% } %>/> <input type="checkbox" <% if(permission.active) { %>checked="checked"<% } %>/>
<div></div> <div></div>
<span class="check-text check-yes">Yes</span>
<span class="check-text check-no">No</span>
</div> </div>
</div> </div>
<% }) %> <% }) %>

View File

@ -22,9 +22,11 @@ block content
span ({{ role.members_count }} members with this role) span ({{ role.members_count }} members with this role)
div.general-category div.general-category
| Can do estimations? | When enabled, members assigned to this role will be able to estimate the point value for user stories
div.check div.check
input(type="checkbox", ng-model="role.computable", ng-change="ctrl.setComputable()") input(type="checkbox", ng-model="role.computable", ng-change="ctrl.setComputable()")
div div
span.check-text.check-yes Yes
span.check-text.check-no No
div(tg-role-permissions, ng-model="role") div(tg-role-permissions, ng-model="role")

View File

@ -14,9 +14,9 @@ section.admin-menu
span.icon.icon-arrow-right span.icon.icon-arrow-right
li#adminmenu-memberships li#adminmenu-memberships
a(href="" tg-nav="project-admin-memberships:project=project.slug") a(href="" tg-nav="project-admin-memberships:project=project.slug")
span.title Memberships span.title Manage members
span.icon.icon-arrow-right span.icon.icon-arrow-right
li#adminmenu-roles li#adminmenu-roles
a(href="" tg-nav="project-admin-roles:project=project.slug") a(href="" tg-nav="project-admin-roles:project=project.slug")
span.title Roles span.title Roles & Permissions
span.icon.icon-arrow-right span.icon.icon-arrow-right

View File

@ -1,6 +1,6 @@
section.admin-submenu section.admin-submenu
header header
h1 Project Values h1 Custom Atrributes
nav nav
ul ul

View File

@ -3,6 +3,7 @@
@extend %large; @extend %large;
@extend %title; @extend %title;
background-color: $whitish; background-color: $whitish;
color: $grayer;
padding: .5rem 1rem; padding: .5rem 1rem;
span { span {
@extend %medium; @extend %medium;
@ -20,10 +21,10 @@
} }
} }
.check { .check {
background-color: #cfcfcf; background-color: darken($whitish, 10%);
border-radius: 2px; border-radius: 2px;
cursor: pointer; cursor: pointer;
height: 25px; height: 1.5rem;
overflow: hidden; overflow: hidden;
position: relative; position: relative;
width: 65px; width: 65px;
@ -35,12 +36,28 @@
position: absolute; position: absolute;
top: -10px; top: -10px;
width: 500px; width: 500px;
z-index: 999;
+ div { + div {
@include transition (all .2s linear); @include transition (all .2s linear);
background-color: $button-gray; background-color: $button-gray;
height: 25px; height: 25px;
width: 50%; width: 50%;
} }
~ .check-text {
//@include transition(opacity .3s linear);
@extend %small;
color: $white;
position: absolute;
top: .1rem;
}
~ .check-yes {
opacity: 0;
right: .5rem;
}
~ .check-no {
left: .5rem;
opacity: .6;
}
} }
input[type=checkbox]:checked { input[type=checkbox]:checked {
+ div { + div {
@ -48,6 +65,14 @@
background-color: #74a218; background-color: #74a218;
margin-left: 50%; margin-left: 50%;
} }
~ .check-yes {
opacity: .6;
right: .4rem;
}
~ .check-no {
left: .4rem;
opacity: 0;
}
} }
} }
} }