@sms-frontend/components
Version:
SMS Design React UI Library.
1 lines • 3.34 kB
CSS
.sms-icon-hover.sms-collapse-item-icon-hover::before{width:16px;height:16px}.sms-icon-hover.sms-collapse-item-icon-hover:hover::before{background-color:var(--color-fill-2)}.sms-collapse{overflow:hidden;border-radius:var(--border-radius-medium);border:1px solid var(--color-neutral-3);line-height:1.5715}.sms-collapse-item{border-bottom:1px solid var(--color-neutral-3);-webkit-box-sizing:border-box;box-sizing:border-box}.sms-collapse-item-active>.sms-collapse-item-header{background-color:var(--color-bg-2);border-color:var(--color-neutral-3);-webkit-transition:border-color 0s ease 0s;transition:border-color 0s ease 0s}.sms-collapse-item-active>.sms-collapse-item-header .sms-collapse-item-header-title{font-weight:500}.sms-collapse-item-header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;padding-top:8px;padding-bottom:8px;background-color:var(--color-bg-2);border-bottom:1px solid transparent;color:var(--color-text-1);cursor:pointer;font-size:14px;overflow:hidden;line-height:24px;-webkit-transition:border-color 0s ease .19s;transition:border-color 0s ease .19s}.sms-collapse-item-header-left{padding-left:32px;padding-right:13px}.sms-collapse-item-header-right{padding-left:13px;padding-right:32px}.sms-collapse-item-header-disabled{cursor:not-allowed;color:var(--color-text-4);background-color:var(--color-bg-2)}.sms-collapse-item-header-disabled .sms-collapse-item-header-icon{color:var(--color-text-4)}.sms-collapse-item-header-title{display:inline}.sms-collapse-item-header-extra{float:right}.sms-collapse-item .sms-collapse-item-icon-hover{position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);left:13px;text-align:center}.sms-collapse-item .sms-collapse-item-icon-hover-right{right:13px;left:unset}.sms-collapse-item .sms-collapse-item-icon-hover-right>.sms-collapse-item-header-icon-down{-webkit-transform:rotate(-90deg);transform:rotate(-90deg)}.sms-collapse-item-header-icon{color:var(--color-neutral-7);font-size:14px;-webkit-transition:-webkit-transform .2s cubic-bezier(.34,.69,.1,1);transition:-webkit-transform .2s cubic-bezier(.34,.69,.1,1);transition:transform .2s cubic-bezier(.34,.69,.1,1);transition:transform .2s cubic-bezier(.34,.69,.1,1),-webkit-transform .2s cubic-bezier(.34,.69,.1,1);vertical-align:middle;position:relative;display:block}.sms-collapse-item-header-icon-down{-webkit-transform:rotate(90deg);transform:rotate(90deg)}.sms-collapse-item-content{display:none;overflow:hidden;position:relative;color:var(--color-text-1);background-color:var(--color-fill-1);font-size:14px;-webkit-transition:height .2s cubic-bezier(.34,.69,.1,1);transition:height .2s cubic-bezier(.34,.69,.1,1)}.sms-collapse-item-content-expanded{display:block;height:auto}.sms-collapse-item-content-box{padding:8px 13px 8px 34px}.sms-collapse-item.sms-collapse-item-disabled>.sms-collapse-item-content{color:var(--color-text-1)}.sms-collapse-item-no-icon>.sms-collapse-item-header{padding-left:13px;padding-right:13px}.sms-collapse-item:last-of-type{border-bottom:none}.sms-collapse.sms-collapse-borderless{border:none}.sms-collapse::after{display:table;content:'';clear:both}