TrizTech/ohif-viewer
15
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Allowing multiple levels on dropdowns

Browse Source
This commit is contained in:
Bruno Alves de Faria 2017-03-23 15:08:37 -03:00
parent d9e1c9e04e
commit d47bcb9c2a
2 changed files with 71 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
Packages/ohif-core/client/components/bootstrap/dropdown/dropdown.styl
View File

@ -4,7 +4,7 @@
cursor: default
outline: none
ul.dropdown-menu
&>ul.dropdown-menu
display: block
z-index: 1000
transform(scale(0))
@ -35,3 +35,37 @@
&.open ul.dropdown-menu
transform(scale(1))
.dropdown-submenu
position: relative
&>.dropdown-menu
top: 0
left: 100%
margin-top: -6px
margin-left: -1px
-webkit-border-radius: 0 6px 6px 6px
-moz-border-radius: 0 6px 6px 6px
border-radius: 0 6px 6px 6px
&:hover
&>.dropdown-menu
display: block
&>a:after
border-left-color:#FFFFFF
&>a:after
display: block
float: right
content: " "
width: 0
height: 0
border-color: transparent
border-style: solid
border-width: 5px 0 5px 5px
border-left-color: #CCCCCC
margin-top: 5px
margin-right: -10px

65
Packages/ohif-core/client/components/bootstrap/dropdown/form.html
View File

@ -1,33 +1,40 @@
<template name="dropdownForm">
{{#form (extend this mixins='dropdown' class='dropdown' hideValidationBox=true)}}
<ul class="dropdown-menu {{this.options.menuClasses}}">
{{#if UI.contentBlock}}
{{>UI.contentBlock}}
{{else}}
{{#each item in this.items}}
{{#if item.separatorBefore}}
<li role="separator" class="divider"></li>
{{/if}}
<li class="{{#if item.disabled}}disabled{{/if}}">
{{#link item}}
{{#if item.icon}}
<i class="{{item.icon}} {{item.iconClasses}}"></i>
{{/if}}
{{#if item.iconSvgUse}}
<svg class="{{item.iconClasses}}">
<use xlink:href={{absoluteUrl item.iconSvgUse}}></use>
</svg>
{{/if}}
{{#if item.text}}
<span>{{item.text}}</span>
{{/if}}
{{/link}}
</li>
{{#if item.separatorAfter}}
<li role="separator" class="divider"></li>
{{/if}}
{{/each}}
{{/if}}
</ul>
{{>dropdownFormMenu items=this.items classes=this.options.menuClasses}}
{{/form}}
</template>
<template name="dropdownFormMenu">
<ul class="dropdown-menu {{this.classes}}">
{{#if UI.contentBlock}}
{{>UI.contentBlock}}
{{else}}
{{#each item in this.items}}
{{#if item.separatorBefore}}
<li role="separator" class="divider"></li>
{{/if}}
<li class="{{#if item.disabled}}disabled{{/if}} {{#if item.items}}dropdown-submenu{{/if}}">
{{#link item}}
{{#if item.icon}}
<i class="{{item.icon}} {{item.iconClasses}}"></i>
{{/if}}
{{#if item.iconSvgUse}}
<svg class="{{item.iconClasses}}">
<use xlink:href={{absoluteUrl item.iconSvgUse}}></use>
</svg>
{{/if}}
{{#if item.text}}
<span>{{item.text}}</span>
{{/if}}
{{/link}}
{{#if item.items}}
{{>dropdownFormMenu items=item.items}}
{{/if}}
</li>
{{#if item.separatorAfter}}
<li role="separator" class="divider"></li>
{{/if}}
{{/each}}
{{/if}}
</ul>
</template>