mirror of https://github.com/Chocobozzz/PeerTube
Design confirm dialog
parent
0727cab0df
commit
59aa1e5e75
|
@ -6,14 +6,14 @@
|
||||||
<button type="button" class="close" aria-label="Close" (click)="cancel()">
|
<button type="button" class="close" aria-label="Close" (click)="cancel()">
|
||||||
<span aria-hidden="true">×</span>
|
<span aria-hidden="true">×</span>
|
||||||
</button>
|
</button>
|
||||||
<h4 class="modal-title">{{ title }}</h4>
|
<h4 class="title-page title-page-single">{{ title }}</h4>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="modal-body" [innerHtml]="message"></div>
|
<div class="modal-body" [innerHtml]="message"></div>
|
||||||
|
|
||||||
<div class="modal-footer">
|
<div class="modal-footer">
|
||||||
<button type="button" class="btn btn-default" data-dismiss="modal" (click)="cancel()">Cancel</button>
|
<button type="button" class="grey-button" data-dismiss="modal" (click)="cancel()">Cancel</button>
|
||||||
<button type="button" class="btn btn-primary" (click)="confirm()">Confirm</button>
|
<button type="button" class="orange-button" (click)="confirm()">Confirm</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -11,7 +11,8 @@ export interface ConfigChangedEvent {
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'my-confirm',
|
selector: 'my-confirm',
|
||||||
templateUrl: './confirm.component.html'
|
templateUrl: './confirm.component.html',
|
||||||
|
styles: [ '.button { padding: 0 13px; }' ]
|
||||||
})
|
})
|
||||||
export class ConfirmComponent implements OnInit {
|
export class ConfirmComponent implements OnInit {
|
||||||
@ViewChild('confirmModal') confirmModal: ModalDirective
|
@ViewChild('confirmModal') confirmModal: ModalDirective
|
||||||
|
|
|
@ -42,22 +42,6 @@ label {
|
||||||
.main-col {
|
.main-col {
|
||||||
margin-left: $menu-width;
|
margin-left: $menu-width;
|
||||||
|
|
||||||
.title-page {
|
|
||||||
color: #000;
|
|
||||||
font-size: 16px;
|
|
||||||
display: inline-block;
|
|
||||||
margin-right: 55px;
|
|
||||||
font-weight: $font-semibold;
|
|
||||||
@include disable-default-a-behaviour;
|
|
||||||
|
|
||||||
&.active, &.title-page-single {
|
|
||||||
border-bottom: 2px solid $orange-color;
|
|
||||||
font-weight: $font-bold;
|
|
||||||
margin-top: 30px;
|
|
||||||
margin-bottom: 25px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.margin-content {
|
.margin-content {
|
||||||
margin-left: $not-expanded-horizontal-margins;
|
margin-left: $not-expanded-horizontal-margins;
|
||||||
margin-right: $not-expanded-horizontal-margins;
|
margin-right: $not-expanded-horizontal-margins;
|
||||||
|
@ -88,6 +72,22 @@ label {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.title-page {
|
||||||
|
color: #000;
|
||||||
|
font-size: 16px;
|
||||||
|
display: inline-block;
|
||||||
|
margin-right: 55px;
|
||||||
|
font-weight: $font-semibold;
|
||||||
|
@include disable-default-a-behaviour;
|
||||||
|
|
||||||
|
&.active, &.title-page-single {
|
||||||
|
border-bottom: 2px solid $orange-color;
|
||||||
|
font-weight: $font-bold;
|
||||||
|
margin-top: 30px;
|
||||||
|
margin-bottom: 25px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// On small screen, menu is absolute and displayed over the page
|
// On small screen, menu is absolute and displayed over the page
|
||||||
@media screen and (max-width: 500px) {
|
@media screen and (max-width: 500px) {
|
||||||
.title-menu-left {
|
.title-menu-left {
|
||||||
|
|
Loading…
Reference in New Issue