init
This commit is contained in:
231
bower_components/uikit/scss/components/nestable.scss
vendored
Normal file
231
bower_components/uikit/scss/components/nestable.scss
vendored
Normal file
@@ -0,0 +1,231 @@
|
||||
// Name: Nestable
|
||||
// Description: Defines styles for nestable lists
|
||||
//
|
||||
// Component: `uk-nestable`
|
||||
//
|
||||
// Sub-objects: `uk-nestable-list`
|
||||
// `uk-nestable-item`
|
||||
// `uk-nestable-handle`
|
||||
// `uk-nestable-moving`
|
||||
// `uk-nestable-toggle`
|
||||
// `uk-nestable-panel`
|
||||
//
|
||||
// Modifier: `uk-nestable-dragged`
|
||||
// `uk-nestable-placeholder`
|
||||
//
|
||||
// States: `uk-parent`
|
||||
// `uk-collapsed`
|
||||
//
|
||||
// Markup:
|
||||
//
|
||||
// <!-- uk-nestable -->
|
||||
// <ul class="uk-nestable" data-uk-nestable>
|
||||
// <li></li>
|
||||
// <li></li>
|
||||
// </ul>
|
||||
//
|
||||
// ========================================================================
|
||||
|
||||
|
||||
// Variables
|
||||
// ========================================================================
|
||||
|
||||
$nestable-padding-left: 40px !default;
|
||||
|
||||
$nestable-item-margin: 10px !default;
|
||||
|
||||
$nestable-dragged-z-index: 1050 !default;
|
||||
|
||||
$nestable-placeholder-border: #ddd !default;
|
||||
|
||||
$nestable-empty-height: 30px !default;
|
||||
|
||||
$nestable-toggle-icon: "\f147" !default;
|
||||
$nestable-toggle-collapsed-icon: "\f196" !default;
|
||||
|
||||
$nestable-panel-padding: 5px !default;
|
||||
$nestable-panel-background: #f5f5f5 !default;
|
||||
|
||||
|
||||
/* ========================================================================
|
||||
Component: Nestable
|
||||
========================================================================== */
|
||||
|
||||
.uk-nestable {
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
@include hook-nestable();
|
||||
}
|
||||
|
||||
/*
|
||||
* Disables the default callout shown when you touch and hold a touch target
|
||||
* Currently only works in Webkit
|
||||
*/
|
||||
|
||||
.uk-nestable a,
|
||||
.uk-nestable img { -webkit-touch-callout: none; }
|
||||
|
||||
|
||||
/* Sub-object `uk-nestable-list`
|
||||
========================================================================== */
|
||||
|
||||
.uk-nestable-list {
|
||||
margin: 0;
|
||||
padding-left: $nestable-padding-left;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
|
||||
/* Sub-modifier `uk-nestable-item`
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* 1. Deactivate browser touch actions in IE11
|
||||
*/
|
||||
|
||||
.uk-nestable-item {
|
||||
/* 1 */
|
||||
touch-action: none;
|
||||
@include hook-nestable-item();
|
||||
}
|
||||
|
||||
.uk-nestable-item + .uk-nestable-item { margin-top: $nestable-item-margin; }
|
||||
|
||||
.uk-nestable-list:not(.uk-nestable-dragged) > .uk-nestable-item:first-child { margin-top: $nestable-item-margin; }
|
||||
|
||||
|
||||
/* Sub-modifier `uk-nestable-dragged`
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* 1. Reset style
|
||||
*/
|
||||
|
||||
.uk-nestable-dragged {
|
||||
position: absolute;
|
||||
z-index: $nestable-dragged-z-index;
|
||||
pointer-events: none;
|
||||
/* 1 */
|
||||
padding-left: 0;
|
||||
@include hook-nestable-dragged();
|
||||
}
|
||||
|
||||
|
||||
/* Sub-modifier `uk-nestable-placeholder`
|
||||
========================================================================== */
|
||||
|
||||
.uk-nestable-placeholder { position: relative; }
|
||||
|
||||
.uk-nestable-placeholder > * { opacity: 0; }
|
||||
|
||||
.uk-nestable-placeholder:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
border: 1px dashed $nestable-placeholder-border;
|
||||
opacity: 1;
|
||||
@include hook-nestable-placeholder();
|
||||
}
|
||||
|
||||
|
||||
/* Empty List
|
||||
========================================================================== */
|
||||
|
||||
.uk-nestable-empty {
|
||||
min-height: $nestable-empty-height;
|
||||
@include hook-nestable-empty();
|
||||
}
|
||||
|
||||
|
||||
/* Sub-object `uk-nestable-handle`
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* Deactivate browser touch actions in IE11
|
||||
*/
|
||||
|
||||
.uk-nestable-handle { touch-action: none; }
|
||||
|
||||
/* Hover */
|
||||
.uk-nestable-handle:hover { cursor: move; }
|
||||
|
||||
|
||||
/* Sub-object `uk-nestable-moving`
|
||||
========================================================================== */
|
||||
|
||||
.uk-nestable-moving,
|
||||
/* Needed if moving over links or buttons */
|
||||
.uk-nestable-moving * { cursor: move; }
|
||||
/* Fixes dragging items over iframes */
|
||||
.uk-nestable-moving iframe { pointer-events: none; }
|
||||
|
||||
|
||||
/* [data-nestable-action='toggle']
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* 1. Makes text unselectable. Happens if double clicked by mistake
|
||||
*/
|
||||
|
||||
[data-nestable-action='toggle'] {
|
||||
cursor: pointer;
|
||||
/* 1 */
|
||||
-moz-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
|
||||
/* Sub-object `.uk-nestable-toggle`
|
||||
========================================================================== */
|
||||
|
||||
.uk-nestable-toggle {
|
||||
display: inline-block;
|
||||
visibility: hidden;
|
||||
@include hook-nestable-toggle();
|
||||
}
|
||||
|
||||
.uk-nestable-toggle:after {
|
||||
content: $nestable-toggle-icon;
|
||||
font-family: FontAwesome;
|
||||
}
|
||||
|
||||
.uk-parent > :not(.uk-nestable-list) .uk-nestable-toggle { visibility: visible; }
|
||||
|
||||
/*
|
||||
* Collapsed
|
||||
*/
|
||||
|
||||
.uk-collapsed .uk-nestable-list { display: none; }
|
||||
|
||||
.uk-collapsed .uk-nestable-toggle:after { content: $nestable-toggle-collapsed-icon; }
|
||||
|
||||
|
||||
/* Sub-object `uk-nestable-panel`
|
||||
========================================================================== */
|
||||
|
||||
.uk-nestable-panel {
|
||||
padding: $nestable-panel-padding;
|
||||
background: $nestable-panel-background;
|
||||
@include hook-nestable-panel();
|
||||
}
|
||||
|
||||
|
||||
// Hooks
|
||||
// ========================================================================
|
||||
|
||||
@include hook-nestable-misc();
|
||||
|
||||
// @mixin hook-nestable(){}
|
||||
// @mixin hook-nestable-item(){}
|
||||
// @mixin hook-nestable-dragged(){}
|
||||
// @mixin hook-nestable-placeholder(){}
|
||||
// @mixin hook-nestable-empty(){}
|
||||
// @mixin hook-nestable-handle(){}
|
||||
// @mixin hook-nestable-toggle(){}
|
||||
// @mixin hook-nestable-panel(){}
|
||||
// @mixin hook-nestable-misc(){}
|
||||
Reference in New Issue
Block a user