xtreme-ui/dist/components/layout/SiderModal/siderModal.css

Collection of reusable components that can be used in web projects

.xtrSiderModal{width:fit-content;height:100%;min-width:300px;display:flex;flex-direction:column}.xtrSiderModal .header{width:100%;height:100px;display:flex;align-items:center;padding:0 24px;gap:24px}.xtrSiderModal .header .back{border-top-left-radius:0;border-bottom-left-radius:0;display:none}.xtrSiderModal .header .xIcon,.xtrSiderModal .header .title{font-size:x-large;font-variation-settings:"wdth" 75,"wght" 400;color:var(--colorContentPrimary);margin:0;-webkit-user-select:none;user-select:none}.xtrSiderModal .footer{width:100%;height:100px;display:flex;flex-direction:row-reverse;align-items:center;justify-content:space-between;padding:0 24px}.xtrSiderModal .body{flex:1;padding:16px 0;overflow-y:auto;transition:all var(--animDurDefault) var(--cubicBezierPrimary)}@media(max-width:512px){.xtrSiderModal .header{padding:0 24px 0 0}.xtrSiderModal .header .back{display:flex}.xtrSiderModal .body{width:100vw}}