mirror of
https://bitbucket.org/bellord13/kit.git
synced 2026-11-13 19:06:11 +03:00
1 line
3.2 KiB
CSS
1 line
3.2 KiB
CSS
:root{--kit-menu-border-width:4px;--kit-menu-hover-label-size:calc(3 * .1em);--kit-color-menu-content:rgba(33,33,33,.98);--kit-color-menu-item-content-hover:rgba(255,255,255,.1);--kit-color-menu-content-text:#fff;--kit-color-menu-content-text-hover:var(--kit-color-primary-w2,#67b2e4)}.kit-menu{background:var(--kit-color-menu-content);display:none}.kit-menu[data-kit-align-horizontal-align=right]{border-left:var(--kit-menu-border-width) solid var(--kit-color-primary,#3c9cdd);box-shadow:0 0 10px 0 rgba(0,0,0,.2), inset 5px 0 5px -5px var(--kit-color-primary-b2,#2283c3)}.kit-menu[data-kit-align-horizontal-align=left]{border-right:var(--kit-menu-border-width) solid var(--kit-color-primary,#3c9cdd);box-shadow:0 0 10px 0 rgba(0,0,0,.2), inset -5px 0 5px -5px var(--kit-color-primary-b2,#2283c3)}.kit-menu.active,.kit-menu.show{z-index:1000;display:block}.kit-text-debug{pointer-events:none;color:#ddd;background-color:#363636;font-family:monospace;font-size:12px;line-height:1.1em;position:absolute}.kit-menu-item{cursor:pointer;flex-direction:row;align-items:center;min-width:15em;padding-left:.5em;padding-right:.5em;text-decoration:none;display:flex}.kit-menu-item>:not(.kit-menu){margin-left:.5em;margin-right:.5em}.kit-menu-item:hover{background-color:var(--kit-color-menu-item-content-hover)}.kit-menu-item:first-child{border-top:0}.kit-menu>*>.kit-menu{z-index:20}.kit-menu>.kit-menu-item:hover>.kit-menu{z-index:21}.kit-menu-item__label{color:var(--kit-color-menu-content-text);-webkit-user-select:none;-ms-user-select:none;user-select:none;flex:100%;order:500;padding-top:.715em;padding-bottom:.715em;display:block;position:relative}.kit-menu-item__icon{width:1.5em;height:1.5em;color:var(--kit-color-menu-icon,var(--kit-color-icon,#8c8c8c));flex:0 0 1.5em;order:100}.kit-menu-item__icon:empty{display:none}.kit-menu-item__icon picture,.kit-menu-item__icon img,.kit-menu-item__icon svg{fill:currentColor;object-fit:contain;object-position:center;width:100%;max-width:100%;height:100%;max-height:100%;transition:inherit;display:block}.kit-menu-item__label>a{color:var(--kit-color-menu-content-text)}.kit-menu-item__label:hover>a{color:var(--kit-color-menu-content-text-hover)}.kit-menu[data-kit-align-horizontal-align=left] .kit-menu-item:before,.kit-menu[data-kit-align-horizontal-align=right] .kit-menu-item:before{content:"";width:var(--kit-menu-hover-label-size);background:var(--kit-color-primary,#3c9cdd);opacity:0;pointer-events:none;height:calc(100% - .6em);top:.3em;left:0;right:unset;transition:all .3s;position:absolute}.kit-menu[data-kit-align-horizontal-align=left]>.kit-menu-item:before{right:0;left:unset}.kit-menu .kit-menu-item:hover:before{opacity:1}.kit-menu-item__arrow{display:none}.kit-menu-item__arrow:empty{display:none!important}.kit-menu-item>.kit-menu~.kit-menu-item__arrow{box-sizing:border-box;background:0 0;flex:0 0 1.5em;order:1000;width:1.5em;height:1.5em;padding:.3em;display:block}.kit-menu-item__arrow{color:var(--kit-color-menu-icon,var(--kit-color-icon,#8c8c8c))}.kit-menu~.kit-menu-item__arrow picture,.kit-menu~.kit-menu-item__arrow img,.kit-menu~.kit-menu-item__arrow svg{fill:currentColor;object-fit:contain;object-position:center;width:100%;max-width:100%;height:100%;max-height:100%;transition:inherit;display:block} |