@knapsack/app
Version:
Build Design Systems on top of knapsack, by Basalt
1 lines • 3.07 kB
CSS
.menu{display:-webkit-box;display:-ms-flexbox;display:flex;border:1px solid rgba(34,36,38,.15);-webkit-box-shadow:0 1px 2px 0 rgba(34,36,38,.15);box-shadow:0 1px 2px 0 rgba(34,36,38,.15);border-radius:.28571429rem;margin-bottom:var(--space-m)}.menu .item{position:relative;vertical-align:middle;line-height:1;text-decoration:none;-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;background:0 0;padding:.92857143em 1.14285714em;text-transform:none;color:rgba(0,0,0,.87);font-weight:400;-webkit-transition:background .1s ease,color .1s ease,-webkit-box-shadow .1s ease;transition:background .1s ease,color .1s ease,-webkit-box-shadow .1s ease;transition:background .1s ease,box-shadow .1s ease,color .1s ease;transition:background .1s ease,box-shadow .1s ease,color .1s ease,-webkit-box-shadow .1s ease}.menu .item:hover{cursor:pointer}.menu .item:after{visibility:hidden;position:absolute;content:"";top:100%;left:50%;-webkit-transform:translateX(-50%) translateY(-50%) rotate(45deg);transform:translateX(-50%) translateY(-50%) rotate(45deg);background:0 0;margin:.5px 0 0;width:.57142857em;height:.57142857em;border:1px solid #d4d4d5;border-top:none;border-left:none;z-index:2;-webkit-transition:background .1s ease;transition:background .1s ease}.menu .item:first-child{border-radius:.28571429rem 0 0 .28571429rem}.menu .item.active{background:rgba(0,0,0,.05);color:rgba(0,0,0,.95);font-weight:400;-webkit-box-shadow:none;box-shadow:none}.menu .item.active:after{background-color:#f2f2f2;visibility:visible}.ks-inline-edit__controls{line-height:1rem;vertical-align:middle;padding-left:var(--space-xs);display:none}.ks-inline-edit--visible .ks-inline-edit__text{vertical-align:middle}.ks-inline-edit--visible .ks-inline-edit__controls{display:inline-block}.ks-inline-edit--editing .ks-inline-edit__text{border-bottom:solid var(--space-xxxs) var(--c-active);outline:none}.ks-inline-edit--editing .ks-inline-edit__controls{display:inline-block}.ks-inline-edit--editing .ks-inline-edit__controls button+button{margin-left:var(--space-xxs)}.ks-inline-edit--no-wrap{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;max-width:100%}.ks-inline-edit--no-wrap .ks-inline-edit__text{-ms-flex-negative:1;flex-shrink:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.ks-inline-edit--no-wrap .ks-inline-edit__controls{min-width:var(--space-l);white-space:nowrap}.ks-page-header{padding:var(--space-xl) var(--space-xl) var(--space-l);border-bottom:1px solid var(--c-frame)}.ks-page-header--flush{padding:0;border-bottom:none}.ks-page-header--constrained .ks-page-header__content-wrap{max-width:var(--content-page-width);margin:0 auto}.ks-page-header__section{color:var(--c-text-subdued);margin-bottom:var(--space-xs)}.ks-page-header__title{margin-top:0}.ks-page-header__description{margin-top:var(--space-xs);max-width:var(--content-page-width)}.ks-settings{padding:var(--space-xl)}