Commit 8690849bc505ac8e8581406b4993aebb453aecfb
Committed by
Michel Felipe

1 parent
a61cb0f5
Exists in
master
and in
7 other branches
correções sugeridas no merge request !39
Showing
7 changed files
with
62 additions
and
28 deletions
Show diff stats
src/app/admin/layout-edit/designModeToggler.component.ts
... | ... | @@ -6,18 +6,34 @@ import {AuthService, AuthEvents} from '../../login'; |
6 | 6 | selector: 'noosfero-design-toggler', |
7 | 7 | templateUrl: 'app/admin/layout-edit/designModeToggler.html' |
8 | 8 | }) |
9 | -@Inject(DesignModeService, AuthService) | |
9 | +@Inject(DesignModeService) | |
10 | 10 | export class DesignModeTogglerComponent { |
11 | 11 | |
12 | - icon: string = " <i class='glyphicon glyphicon-wrench'></i> "; | |
12 | + @Input() iconClass: string = ''; | |
13 | + @Input() knobLabel: string = ''; | |
14 | + @Input() offLabel: string = ''; | |
15 | + @Input() onLabel: string = ''; | |
13 | 16 | |
14 | - constructor(private designModeService: DesignModeService, private authService: AuthService) { | |
17 | + private _inDesignMode: boolean = false; | |
18 | + | |
19 | + constructor(private designModeService: DesignModeService, private authService: AuthService, private $sce: ng.ISCEService) { | |
15 | 20 | this.authService.subscribe(AuthEvents[AuthEvents.logoutSuccess], () => { |
16 | 21 | this.designModeService.destroy(); |
17 | 22 | }); |
18 | 23 | } |
19 | 24 | |
20 | - private _inDesignMode: boolean = false; | |
25 | + get icon(): string { | |
26 | + if (this.iconClass && this.iconClass.trim().length > 0 ) { | |
27 | + return '<i class=\'design-toggle-icon ' + this.iconClass + '\'></i>'; | |
28 | + } | |
29 | + else { | |
30 | + return ''; | |
31 | + } | |
32 | + } | |
33 | + | |
34 | + getKnobLabel(): string { | |
35 | + return this.$sce.trustAsHtml(this.icon + this.knobLabel); | |
36 | + } | |
21 | 37 | |
22 | 38 | get inDesignMode(): boolean { |
23 | 39 | return this.designModeService.isInDesignMode(); |
... | ... | @@ -26,4 +42,4 @@ export class DesignModeTogglerComponent { |
26 | 42 | set inDesignMode(value: boolean) { |
27 | 43 | this.designModeService.setInDesignMode(value); |
28 | 44 | }; |
29 | 45 | -} |
46 | +} | |
30 | 47 | \ No newline at end of file | ... | ... |
src/app/admin/layout-edit/designModeToggler.html
1 | 1 | <toggle-switch |
2 | 2 | html="true" |
3 | 3 | ng-model="ctrl.inDesignMode" |
4 | - on-label="{{'designMode.toggle.ON' | translate}}" | |
5 | - off-label="{{'designMode.toggle.OFF' | translate}}" | |
4 | + on-label="{{ctrl.onLabel}}" | |
5 | + off-label="{{ctrl.offLabel}}" | |
6 | 6 | class="switch-small" |
7 | - knob-label="{{ ctrl.icon + ('designMode.label' | translate) }}"> | |
7 | + knob-label="{{ ctrl.getKnobLabel() }}"> | |
8 | 8 | </toggle-switch> |
9 | 9 | \ No newline at end of file | ... | ... |
... | ... | @@ -0,0 +1,23 @@ |
1 | +ul.nav > li.toggler-container { | |
2 | + position: relative; | |
3 | + padding-top: 12px; | |
4 | +} | |
5 | + | |
6 | +body.noosfero-design-on { | |
7 | + | |
8 | + div.content-wrapper { | |
9 | + opacity: 0.5; | |
10 | + } | |
11 | +} | |
12 | + | |
13 | + | |
14 | + | |
15 | +noosfero-design-toggler .ats-switch .knob i { | |
16 | + color: #999999; | |
17 | +} | |
18 | + | |
19 | + | |
20 | +.design-toggle-icon { | |
21 | + margin-left: 3px; | |
22 | + margin-right: 3px; | |
23 | +} | |
0 | 24 | \ No newline at end of file | ... | ... |
src/app/layout/scss/_layout.scss
... | ... | @@ -34,17 +34,4 @@ |
34 | 34 | .main-box-body { |
35 | 35 | padding: 0 20px 20px 20px; |
36 | 36 | } |
37 | -} | |
38 | - | |
39 | -ul.nav > li.toggler-container { | |
40 | - position: relative; | |
41 | - padding-top: 12px; | |
42 | -} | |
43 | - | |
44 | -.noosfero-main-toolbar { | |
45 | - padding: 5px; | |
46 | - @include make-row(); | |
47 | - margin-left: 0px; | |
48 | - margin-right: 0px; | |
49 | - background-color: #edecec; | |
50 | -} | |
37 | +} | |
51 | 38 | \ No newline at end of file | ... | ... |
src/app/layout/scss/skins/_whbl.scss
... | ... | @@ -291,11 +291,7 @@ $whbl-font-color: #16191c; |
291 | 291 | background-color: #fff; |
292 | 292 | } |
293 | 293 | |
294 | - noosfero-design-toggler .ats-switch .knob i { | |
295 | - color: #999999; | |
296 | - } | |
297 | - | |
298 | - .ats-switch .knob { | |
294 | + .ats-switch .knob { | |
299 | 295 | padding-right: 15px; |
300 | 296 | } |
301 | 297 | ... | ... |
src/app/profile/toolbar.html
1 | 1 | <div class="noosfero-main-toolbar" permission="vm.profile.permissions" permission-action="allow_edit"> |
2 | - <noosfero-design-toggler class="pull-right"></noosfero-design-toggler> | |
2 | + <noosfero-design-toggler | |
3 | + [icon-class]="'glyphicon glyphicon-wrench'" | |
4 | + [knob-label]="'designMode.label' | translate" | |
5 | + [on-label]="'designMode.toggle.ON' | translate" | |
6 | + [off-label]="'designMode.toggle.OFF' | translate" | |
7 | + class="pull-right"></noosfero-design-toggler> | |
3 | 8 | |
4 | 9 | </div> |
5 | 10 | \ No newline at end of file | ... | ... |