Apply more general classes on pane title elements.

This commit is contained in:
Arpad Csanyi
2016-03-14 16:52:54 +01:00
parent 4d18b7a460
commit bc0db45e6c
3 changed files with 15 additions and 25 deletions

View File

@@ -29,7 +29,7 @@
<div class="row">
<h1 class="col-xs-12 pane-title">
<i class="fa fa-keyboard-o"></i>
<span class="keymap__name" contenteditable="true">QWERTY</span> keymap (<span class="keymap__abbrev" contenteditable="true">QTY</span>)
<span class="keymap__name pane-title__name" contenteditable="true">QWERTY</span> keymap (<span class="keymap__abbrev pane-title__abbrev" contenteditable="true">QTY</span>)
<i class="fa fa-star-o fa-star keymap__is-default"></i>
</h1>
</div>
@@ -67,7 +67,7 @@
<div class="row">
<h1 class="col-xs-12 pane-title">
<i class="fa fa-play"></i>
<span class="macro__name" contenteditable="true">Macro1</span> <i class="fa"></i>
<span class="macro__name pane-title__name" contenteditable="true">Macro1</span> <i class="fa"></i>
</h1>
</div>
<div class="row">
@@ -175,6 +175,7 @@
</ul>
{{/if}}
{{#if actions}}
<!-- Most probably this "actions" section will be removed. -->
<ul class="sidebar__actions--list">
{{#each actions}}
<li class="sidebar__action--item">

2
app.js
View File

@@ -7,7 +7,7 @@ $(function() {
// ========================
// Keymap related settings.
// ========================
$('.keymap__name, .keymap__abbrev, .macro__name').on('mouseover', function() {
$('.pane-title__name, .pane-title__abbrev').on('mouseover', function() {
$(this).addClass('active');
}).on('mouseout', function() {
if (!$(this).is(':focus')) {

View File

@@ -112,30 +112,19 @@ li {
.pane-title {
margin-bottom: 1em;
}
.macro__name.active,
.keymap__name.active,
.keymap__abbrev.active {
box-shadow: 0 0 0px 1px #ccc, 0 0 5px 0px #ccc;
border-color: transparent;
}
&__name,
&__abbrev {
border: none;
border-bottom: 2px dotted #999;
padding: 0 .5rem;
margin: 0 .25rem;
.macro__name,
.keymap__name,
.keymap__abbrev {
border: none;
border-bottom: 2px dotted #999;
}
.macro__name,
.macro__name.active,
.keymap__name,
.keymap__name.active,
.keymap__abbrev,
.keymap__abbrev.active {
padding: 0 .5rem;
margin: 0 .25rem;
&.active {
box-shadow: 0 0 0px 1px #ccc, 0 0 5px 0px #ccc;
border-color: transparent;
}
}
}
.keymap__is-default.fa-star {