7 changed files with 414 additions and 229 deletions
Split View
Diff Options
-
11server/documents/modules/dropdown.html.eco
-
6server/files/stylesheets/semantic.css
-
2server/partials/header.html.eco
-
428src/definitions/modules/dropdown.less
-
1src/themes/packages/default/collections/form.variables
-
54src/themes/packages/default/modules/dropdown.overrides
-
141src/themes/packages/default/modules/dropdown.variables
@ -1,3 +1,57 @@ |
|||
/******************************* |
|||
Overrides |
|||
*******************************/ |
|||
|
|||
/* Dropdown Carets */ |
|||
@font-face { |
|||
font-family: 'Dropdown'; |
|||
src: |
|||
url(data:application/x-font-ttf;charset=utf-8;base64,AAEAAAALAIAAAwAwT1MvMggjB5AAAAC8AAAAYGNtYXAPfuIIAAABHAAAAExnYXNwAAAAEAAAAWgAAAAIZ2x5Zjo82LgAAAFwAAABVGhlYWQAQ88bAAACxAAAADZoaGVhAwcB6QAAAvwAAAAkaG10eAS4ABIAAAMgAAAAIGxvY2EBNgDeAAADQAAAABJtYXhwAAoAFgAAA1QAAAAgbmFtZVcZpu4AAAN0AAABRXBvc3QAAwAAAAAEvAAAACAAAwIAAZAABQAAAUwBZgAAAEcBTAFmAAAA9QAZAIQAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADw2gHg/+D/4AHgACAAAAABAAAAAAAAAAAAAAAgAAAAAAACAAAAAwAAABQAAwABAAAAFAAEADgAAAAKAAgAAgACAAEAIPDa//3//wAAAAAAIPDX//3//wAB/+MPLQADAAEAAAAAAAAAAAAAAAEAAf//AA8AAQAAAAAAAAAAAAIAADc5AQAAAAABAAAAAAAAAAAAAgAANzkBAAAAAAEAAAAAAAAAAAACAAA3OQEAAAAAAQAAAIABJQElABMAABM0NzY3BTYXFhUUDwEGJwYvASY1AAUGBwEACAUGBoAFCAcGgAUBEgcGBQEBAQcECQYHfwYBAQZ/BwYAAQAAAG4BJQESABMAADc0PwE2MzIfARYVFAcGIyEiJyY1AAWABgcIBYAGBgUI/wAHBgWABwaABQWABgcHBgUFBgcAAAABABIASQC3AW4AEwAANzQ/ATYXNhcWHQEUBwYnBi8BJjUSBoAFCAcFBgYFBwgFgAbbBwZ/BwEBBwQJ/wgEBwEBB38GBgAAAAABAAAASQClAW4AEwAANxE0NzYzMh8BFhUUDwEGIyInJjUABQYHCAWABgaABQgHBgVbAQAIBQYGgAUIBwWABgYFBwAAAAEAAAABAADZuaKOXw889QALAgAAAAAA0ABHWAAAAADQAEdYAAAAAAElAW4AAAAIAAIAAAAAAAAAAQAAAeD/4AAAAgAAAAAAASUAAQAAAAAAAAAAAAAAAAAAAAgAAAAAAAAAAAAAAAABAAAAASUAAAElAAAAtwASALcAAAAAAAAACgAUAB4AQgBkAIgAqgAAAAEAAAAIABQAAQAAAAAAAgAAAAAAAAAAAAAAAAAAAAAAAAAOAK4AAQAAAAAAAQAOAAAAAQAAAAAAAgAOAEcAAQAAAAAAAwAOACQAAQAAAAAABAAOAFUAAQAAAAAABQAWAA4AAQAAAAAABgAHADIAAQAAAAAACgA0AGMAAwABBAkAAQAOAAAAAwABBAkAAgAOAEcAAwABBAkAAwAOACQAAwABBAkABAAOAFUAAwABBAkABQAWAA4AAwABBAkABgAOADkAAwABBAkACgA0AGMAaQBjAG8AbQBvAG8AbgBWAGUAcgBzAGkAbwBuACAAMQAuADAAaQBjAG8AbQBvAG8Abmljb21vb24AaQBjAG8AbQBvAG8AbgBSAGUAZwB1AGwAYQByAGkAYwBvAG0AbwBvAG4ARgBvAG4AdAAgAGcAZQBuAGUAcgBhAHQAZQBkACAAYgB5ACAASQBjAG8ATQBvAG8AbgAuAAAAAAMAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA=) format('truetype'), |
|||
url(data:application/font-woff;charset=utf-8;base64,d09GRk9UVE8AAAVwAAoAAAAABSgAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABDRkYgAAAA9AAAAdkAAAHZLDXE/09TLzIAAALQAAAAYAAAAGAIIweQY21hcAAAAzAAAABMAAAATA9+4ghnYXNwAAADfAAAAAgAAAAIAAAAEGhlYWQAAAOEAAAANgAAADYAQ88baGhlYQAAA7wAAAAkAAAAJAMHAelobXR4AAAD4AAAACAAAAAgBLgAEm1heHAAAAQAAAAABgAAAAYACFAAbmFtZQAABAgAAAFFAAABRVcZpu5wb3N0AAAFUAAAACAAAAAgAAMAAAEABAQAAQEBCGljb21vb24AAQIAAQA6+BwC+BsD+BgEHgoAGVP/i4seCgAZU/+LiwwHi2v4lPh0BR0AAACIDx0AAACNER0AAAAJHQAAAdASAAkBAQgPERMWGyAlKmljb21vb25pY29tb29udTB1MXUyMHVGMEQ3dUYwRDh1RjBEOXVGMERBAAACAYkABgAIAgABAAQABwAKAA0AVgCfAOgBL/yUDvyUDvyUDvuUDvtvi/emFYuQjZCOjo+Pj42Qiwj3lIsFkIuQiY6Hj4iNhouGi4aJh4eHCPsU+xQFiIiGiYaLhouHjYeOCPsU9xQFiI+Jj4uQCA77b4v3FBWLkI2Pjo8I9xT3FAWPjo+NkIuQi5CJjogI9xT7FAWPh42Hi4aLhomHh4eIiIaJhosI+5SLBYaLh42HjoiPiY+LkAgO+92d928Vi5CNkI+OCPcU9xQFjo+QjZCLkIuPiY6Hj4iNhouGCIv7lAWLhomHh4iIh4eJhouGi4aNiI8I+xT3FAWHjomPi5AIDvvdi+YVi/eUBYuQjZCOjo+Pj42Qi5CLkImOhwj3FPsUBY+IjYaLhouGiYeHiAj7FPsUBYiHhomGi4aLh42Hj4iOiY+LkAgO+JQU+JQViwwKAAAAAAMCAAGQAAUAAAFMAWYAAABHAUwBZgAAAPUAGQCEAAAAAAAAAAAAAAAAAAAAARAAAAAAAAAAAAAAAAAAAAAAQAAA8NoB4P/g/+AB4AAgAAAAAQAAAAAAAAAAAAAAIAAAAAAAAgAAAAMAAAAUAAMAAQAAABQABAA4AAAACgAIAAIAAgABACDw2v/9//8AAAAAACDw1//9//8AAf/jDy0AAwABAAAAAAAAAAAAAAABAAH//wAPAAEAAAABAAA5emozXw889QALAgAAAAAA0ABHWAAAAADQAEdYAAAAAAElAW4AAAAIAAIAAAAAAAAAAQAAAeD/4AAAAgAAAAAAASUAAQAAAAAAAAAAAAAAAAAAAAgAAAAAAAAAAAAAAAABAAAAASUAAAElAAAAtwASALcAAAAAUAAACAAAAAAADgCuAAEAAAAAAAEADgAAAAEAAAAAAAIADgBHAAEAAAAAAAMADgAkAAEAAAAAAAQADgBVAAEAAAAAAAUAFgAOAAEAAAAAAAYABwAyAAEAAAAAAAoANABjAAMAAQQJAAEADgAAAAMAAQQJAAIADgBHAAMAAQQJAAMADgAkAAMAAQQJAAQADgBVAAMAAQQJAAUAFgAOAAMAAQQJAAYADgA5AAMAAQQJAAoANABjAGkAYwBvAG0AbwBvAG4AVgBlAHIAcwBpAG8AbgAgADEALgAwAGkAYwBvAG0AbwBvAG5pY29tb29uAGkAYwBvAG0AbwBvAG4AUgBlAGcAdQBsAGEAcgBpAGMAbwBtAG8AbwBuAEYAbwBuAHQAIABnAGUAbgBlAHIAYQB0AGUAZAAgAGIAeQAgAEkAYwBvAE0AbwBvAG4ALgAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA) format('woff') |
|||
; |
|||
font-weight: normal; |
|||
font-style: normal; |
|||
} |
|||
|
|||
.ui.dropdown > .dropdown.icon { |
|||
font-family: 'Dropdown'; |
|||
line-height: 1; |
|||
height: 1em; |
|||
width: 1.23em; |
|||
backface-visibility: hidden; |
|||
font-weight: normal; |
|||
font-style: normal; |
|||
text-align: center; |
|||
} |
|||
|
|||
.ui.dropdown > .dropdown.icon { |
|||
width: auto; |
|||
} |
|||
.ui.dropdown > .dropdown.icon:before { |
|||
content: '\f0d7'; |
|||
} |
|||
|
|||
/* Sub Menu */ |
|||
.ui.dropdown .menu .item .dropdown.icon:before { |
|||
content: '\f0da'/*rtl:'\f0d9'*/; |
|||
} |
|||
|
|||
/* Vertical Menu Dropdown */ |
|||
.ui.vertical.menu .dropdown.item > .dropdown.icon:before { |
|||
content: "\f0da"/*rtl:"\f0d9"*/; |
|||
} |
|||
|
|||
/* Icons for Reference |
|||
.dropdown.down.icon { |
|||
content: "\f0d7"; |
|||
} |
|||
.dropdown.up.icon { |
|||
content: "\f0d8"; |
|||
} |
|||
.dropdown.left.icon { |
|||
content: "\f0d9"; |
|||
} |
|||
.dropdown.icon.icon { |
|||
content: "\f0da"; |
|||
} |
|||
*/ |
@ -1,3 +1,140 @@ |
|||
/******************************* |
|||
Dropdown |
|||
*******************************/ |
|||
Dropdown |
|||
*******************************/ |
|||
|
|||
/*------------------- |
|||
Element |
|||
--------------------*/ |
|||
|
|||
@lineHeight: 1; |
|||
@transition: |
|||
border-radius 0.1s ease, |
|||
width 0.2s ease |
|||
; |
|||
@borderRadius: 0.325em; |
|||
|
|||
/*------------------- |
|||
Content |
|||
--------------------*/ |
|||
|
|||
/* Icon */ |
|||
@dropdownIconMargin: 0em 0em 0em 1em; |
|||
|
|||
@dropdownSubMenuIconFloat: right; |
|||
@dropdownSubMenuIconMargin: 0em 0em 0em 0.5em; |
|||
|
|||
/* Current Text */ |
|||
@textTransition: color 0.2s @defaultEasing; |
|||
|
|||
/* Menu */ |
|||
@menuBackground: #FFFFFF; |
|||
@menuMargin: 0em; |
|||
@menuTop: 100%; |
|||
@menuWrap: nowrap; |
|||
@menuBoxShadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.1); |
|||
@menuBorderRadius: 0em 0em @borderRadius @borderRadius; |
|||
@menuTransition: opacity 0.2s ease; |
|||
@menuZIndex: 11; |
|||
|
|||
/* Menu Item */ |
|||
@itemFontSize: 1rem; |
|||
@itemBorder: none; |
|||
@itemHeight: auto; |
|||
@itemDivider: 1px solid @borderColor; |
|||
@itemColor: @textColor; |
|||
@itemVerticalPadding: 0.85em; |
|||
@itemHorizontalPadding: 1em; |
|||
@itemFontWeight: normal; |
|||
@itemTextAlign: left; |
|||
@itemTextTransform: none; |
|||
@itemBoxShadow: none; |
|||
|
|||
/* Menu Item Icon */ |
|||
@itemIconMargin: 0em 0.75em 0em 0em; |
|||
|
|||
/* Sub Menu */ |
|||
@subMenuTop: 0%; |
|||
@subMenuLeft: 100%; |
|||
@subMenuRight: auto; |
|||
@subMenuMargin: 0em; |
|||
@subMenuBorderRadius: 0em @borderRadius @borderRadius 0em; |
|||
|
|||
/*------------------- |
|||
Types |
|||
--------------------*/ |
|||
|
|||
/* Selection */ |
|||
@selectionBackground: @white; |
|||
@selectionDisplay: inline-block; |
|||
@selectionVerticalPadding: 0.65em; |
|||
@selectionHorizontalPadding: 1em; |
|||
@selectionTextColor: @textColor; |
|||
@selectionBoxShadow: 0px 0px 0px 1px @borderColor; |
|||
@selectionBorderRadius: @borderRadius; |
|||
@selectionIconOpacity: 0.8; |
|||
@selectionIconTransition: opacity 0.2s ease; |
|||
@selectionIconMargin: 0em 0em 0em 1em; |
|||
@selectionMenuMaxHeight: 312px; |
|||
@selectionMenuBoxShadow: 0px 1px 0px 1px #E0E0E0; |
|||
@selectionMenuItemBoxShadow: none; |
|||
|
|||
/* Selection Hover */ |
|||
@selectionHoverBoxShadow: 0px 0px 0px 1px @selectedBorderColor; |
|||
@selectionHoverMenuBoxShadow: 0px 1px 0px 1px #D3D3D3; |
|||
@selectionHoverIconOpacity: 1; |
|||
|
|||
@selectionVisibleConnectingBorder: 0em; |
|||
@selectionActiveIconOpacity: 1; |
|||
|
|||
/* Inline */ |
|||
@inlineIconMargin: 0em 0.5em 0em 0.25em; |
|||
@inlineTextColor: inherit; |
|||
@inlineTextFontWeight: bold; |
|||
@inlineMenuDistance: 0.25em; |
|||
@inlineMenuBorderRadius: @borderRadius; |
|||
|
|||
/*------------------- |
|||
States |
|||
--------------------*/ |
|||
|
|||
/* Default Text */ |
|||
@defaultTextColor: rgba(179, 179, 179, 0.7); |
|||
@defaultTextHoverColor: rgba(140, 140, 140, 0.7); |
|||
|
|||
/* Active Menu Item */ |
|||
@activeItemBackground: @transparentBlack; |
|||
@activeItemZIndex: @menuZIndex + 1; |
|||
@activeItemBoxShadow: none; |
|||
@activeItemFontWeight: bold; |
|||
@activeItemColor: @selectedTextColor; |
|||
|
|||
/* Menu Error */ |
|||
|
|||
|
|||
/*------------------- |
|||
Variations |
|||
--------------------*/ |
|||
|
|||
/* Simple */ |
|||
@simpleTransitionDuration: 0.2s; |
|||
@simpleTransition: opacity @simpleTransitionDuration @defaultEasing; |
|||
|
|||
/* Floating */ |
|||
@floatingMenuDistance: 0.5em; |
|||
@floatingMenuBoxShadow: |
|||
0px 0px 0px 1px rgba(0, 0, 0, 0.2) inset, |
|||
0px 2px 5px 0px rgba(0, 0, 0, 0.15) |
|||
; |
|||
@floatingMenuBorderRadius: @borderRadius; |
|||
|
|||
/* Pointing */ |
|||
@pointingArrowOffset: -0.25em; |
|||
@pointingArrowDistanceFromEdge: 1em; |
|||
|
|||
@pointingArrowBackground: @white; |
|||
@pointingArrowZIndex: 2; |
|||
@pointingArrowBoxShadow: -1px -1px 0px 1px rgba(0, 0, 0, 0.05); |
|||
@pointingArrowSize: 0.5em; |
|||
|
|||
@pointingMenuDistance: 0.75em; |
|||
@pointingMenuBorderRadius: @borderRadius; |
Write
Preview
Loading…
Cancel
Save