moved drag handle

This commit is contained in:
Torkel Ödegaard 2018-11-06 08:01:00 +01:00
parent c9802c283e
commit b60ebf92b2
4 changed files with 25 additions and 12 deletions

View File

@ -77,6 +77,7 @@ $brand-gradient: linear-gradient(
rgba(255, 68, 0, 0.7) 99%,
rgba(255, 68, 0, 0.7) 100%
);
$page-gradient: linear-gradient(180deg, #222426 10px, rgb(22, 23, 25) 100px);
// Links
@ -110,7 +111,6 @@ $divider-border-color: #555;
// Graphite Target Editor
$tight-form-bg: $dark-3;
$tight-form-func-bg: #333334;
$tight-form-func-highlight-bg: #444445;
@ -128,6 +128,7 @@ $list-item-bg: $card-background;
$list-item-hover-bg: lighten($gray-blue, 2%);
$list-item-link-color: $text-color;
$list-item-shadow: $card-shadow;
$empty-list-cta-bg: $gray-blue;
// Scrollbars
@ -152,8 +153,8 @@ $table-bg-hover: $dark-3;
$btn-primary-bg: #ff6600;
$btn-primary-bg-hl: #bc3e06;
$btn-secondary-bg: $blue-dark;
$btn-secondary-bg-hl: lighten($blue-dark, 5%);
$btn-secondary-bg: $blue-dark;
$btn-success-bg: $green;
$btn-success-bg-hl: darken($green, 6%);

View File

@ -31,6 +31,7 @@ $white: #fff;
// Accent colors
// -------------------------
$blue: #0083b3;
$blue-dark: #005f81;
$blue-light: #00a8e6;
$green: #3aa655;
$red: #d44939;

View File

@ -120,8 +120,8 @@
// Info appears as a neutral blue
.btn-secondary {
@include buttonBackground($btn-secondary-bg, $btn-secondary-bg-hl);
// Inverse appears as dark gray
}
// Inverse appears as dark gray
.btn-inverse {
@include buttonBackground($btn-inverse-bg, $btn-inverse-bg-hl, $btn-inverse-text-color, $btn-inverse-text-shadow);
//background: $card-background;

View File

@ -170,26 +170,37 @@
position: absolute;
height: 2px;
width: 100%;
top: 1px;
padding-left: 32px;
top: -23px;
text-align: center;
height: 1px;
&:hover {
border-bottom: 2px dashed $text-color-faint;
}
}
.panel-editor-resizer__handle {
display: inline-block;
width: 100px;
width: 180px;
position: relative;
background: $input-label-bg;
top: -12px;
border-radius: 2px;
box-shadow: 0 0 8px $black;
height: 8px;
height: 10px;
cursor: grabbing;
background: $dark-4;
top: -8px;
&:hover {
background: linear-gradient(80deg, $blue-dark, lighten($blue-dark, 10%));
.panel-editor-resizer__handle-dots {
display: none;
}
}
}
.panel-editor-resizer__handle-dots {
border-top: 2px dotted $text-color-faint;
border-top: 2px dashed $text-color-faint;
position: relative;
top: 3px;
top: 4px;
}
.panel-editor {