uhk/agent
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Move styles in keypress-tab.component from html to scss.

Browse Source
This commit is contained in:
József Farkas
2016-08-08 21:48:22 +02:00
parent b0b76fe1c2
commit ffce89023c
2 changed files with 28 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/components/popover/tab/keypress/keypress-tab.component.html
View File

@@ -1,12 +1,12 @@
<div class="scancode-options" style="margin-bottom:10px; margin-top:2px"> <div class="scancode-options">
<b class="setting-label" style="position:relative; top:2px;">Scancode:</b> <b class="setting-label">Scancode:</b>
<select2 #scanCodeSelect [data]="scanCodeGroups" [selectedValue]="scanCode.toString()" (valueChanged)="onScancodeChange($event)" <select2 #scanCodeSelect [data]="scanCodeGroups" [selectedValue]="scanCode.toString()" (valueChanged)="onScancodeChange($event)"
[templateResult]="scanCodeTemplateResult" [width]="200"></select2> [templateResult]="scanCodeTemplateResult" [width]="200"></select2>
<capture-keystroke-button></capture-keystroke-button> <capture-keystroke-button></capture-keystroke-button>
</div> </div>
<div class="scancode-options"> <div class="modifier-options">
<b class="setting-label" style="position:relative; top:-9px; margin-right:4px;">Modifiers:</b> <b class="setting-label">Modifiers:</b>
<div class="btn-toolbar modifiers" style="display:inline-block"> <div class="btn-toolbar modifiers">
<div class="btn-group btn-group-sm modifiers__left"> <div class="btn-group btn-group-sm modifiers__left">
<button type="button" class="btn btn-default" *ngFor="let modifier of leftModifiers; let index = index" [class.btn-primary]="leftModifierSelects[index]" <button type="button" class="btn btn-default" *ngFor="let modifier of leftModifiers; let index = index" [class.btn-primary]="leftModifierSelects[index]"
(click)="toggleModifier(false, index)"> (click)="toggleModifier(false, index)">
@@ -22,7 +22,7 @@
</div> </div>
</div> </div>
<div class="long-press-container"> <div class="long-press-container">
<b class="setting-label" style="position:relative;">Long press action:</b> <b class="setting-label">Long press action:</b>
<select2 #longPressSelect [data]="longPressGroups" [selectedValue]="selectedLongPressIndex.toString()" (valueChanged)="onLongpressChange($event)" <select2 #longPressSelect [data]="longPressGroups" [selectedValue]="selectedLongPressIndex.toString()" (valueChanged)="onLongpressChange($event)"
[width]="140"></select2> [width]="140"></select2>
<icon name="question-circle" title="This action happens when the key is being held along with another key."></icon> <icon name="question-circle" title="This action happens when the key is being held along with another key."></icon>

23
src/components/popover/tab/keypress/keypress-tab.component.scss
View File

@@ -2,11 +2,32 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.scancode-options {
margin-bottom: 10px;
margin-top: 2px;
> b {
position: relative;
top: 2px;
}
}
.modifier-options {
> b {
position: relative;
top: -9px;
margin-right: 4px;
}
.btn-toolbar {
display: inline-block;
}
}
.long-press-container { .long-press-container {
display: flex; display: flex;
margin-top: 3rem; margin-top: 3rem;
b { > b {
margin-right: 0.6em; margin-right: 0.6em;
align-items: center; align-items: center;
display: flex; display: flex;