@brizy/ui
Version:
React elements in Brizy style
1 lines • 4.43 kB
CSS
.brz-ui-image-preview,.brz-ui-modal{pointer-events:none}.brz-ui-image-preview.zoom-appear,.brz-ui-image-preview.zoom-enter,.brz-ui-modal.zoom-appear,.brz-ui-modal.zoom-enter{transform:none;opacity:0;animation-duration:.3s;user-select:none}.brz-ui-image-preview-mask,.brz-ui-modal-mask{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;height:100%;background-color:rgba(0,0,0,.45)}.brz-ui-image-preview-mask-hidden,.brz-ui-modal-mask-hidden{display:none}.brz-ui-image-preview-wrap,.brz-ui-modal-wrap{position:fixed;top:0;right:0;bottom:0;left:0;overflow:auto;outline:0;-webkit-overflow-scrolling:touch}.brz-ui-layout{display:flex;flex:auto;flex-direction:column;min-height:0;background:#f1f1f1}.brz-ui-layout,.brz-ui-layout *{box-sizing:border-box}.brz-ui-layout.brz-ui-layout-has-sider{flex-direction:row}.brz-ui-layout.brz-ui-layout-has-sider>.brz-ui-layout,.brz-ui-layout.brz-ui-layout-has-sider>.brz-ui-layout-content{overflow-x:hidden}.brz-ui-layout-footer,.brz-ui-layout-header{flex:0 0 auto}.brz-ui-layout-header{height:65px;padding:0 var(--brz-ui-frame-content-scrollbar-width,0) 0 0;color:var(--color-dark,#212733);line-height:65px;background:var(--color-white,#fff)}.brz-ui-layout-footer{padding:11px calc(15px + var(--brz-ui-frame-content-scrollbar-width,0px)) 11px 15px;color:var(--color-dark,#212733);font-size:14px;background:var(--brz-ui-global-footer-color,var(--brz-ui-footer-color,var(--color-white,#fff)))}.brz-ui-layout-content{flex:auto;min-height:0}.brz-ui-layout-sider{position:relative;min-width:0;background:var(--color-transparent,transparent);transition:.2s}.brz-ui-layout-sider-children{height:100%;margin-top:-.1px;padding-top:.1px}.brz-ui-layout-sider-has-trigger{padding-bottom:48px}.brz-ui-layout-sider-right{order:1}.brz-ui-layout-sider-trigger{position:fixed;bottom:0;z-index:1;height:48px;color:#fff;line-height:48px;text-align:center;background:#002140;cursor:pointer;transition:.2s}.brz-ui-layout-sider-zero-width>*{overflow:hidden}.brz-ui-layout-sider-zero-width-trigger{position:absolute;top:65px;right:-36px;z-index:1;width:36px;height:42px;color:#fff;font-size:18px;line-height:42px;text-align:center;background:var(--color-transparent,transparent);border-radius:0 3px 3px 0;cursor:pointer;transition:background .3s}.brz-ui-layout-sider-zero-width-trigger::after{position:absolute;top:0;right:0;bottom:0;left:0;background:0 0;transition:.3s;content:''}.brz-ui-layout-sider-zero-width-trigger:hover::after{background:rgba(255,255,255,.1)}.brz-ui-layout-sider-zero-width-trigger-right{left:-36px;border-radius:3px 0 0 3px}.brz-ui-layout-sider-light{background:0 0}.brz-ui-layout-sider-light .brz-ui-layout-sider-trigger,.brz-ui-layout-sider-light .brz-ui-layout-sider-zero-width-trigger{color:var(--color-dark,#212733);background:#fff}.brz-ui-layout-rtl{direction:rtl}.brz-ui-layout__frame.brz-ui-layout{justify-content:center;height:100vh;overflow:hidden;background:var(--brz-ui-global-content-color,var(--brz-ui-content-color,var(--color-gray-lightest,#f1f1f1)))}.brz-ui-layout__frame .brz-ui-layout__frame-sider{overflow:auto;height:100%;background:var(--brz-ui-global-sider-color,var(--brz-ui-sider-color,var(--color-dark,#212733)))}.brz-ui-layout__frame .brz-ui-layout__frame-sider .brz-ui-layout-sider-children{min-height:100%;height:auto;display:flex;flex-wrap:wrap;flex-direction:column}.brz-ui-layout__frame .brz-ui-layout__frame-sider .brz-ui-footer,.brz-ui-layout__frame .brz-ui-layout__frame-sider .brz-ui-sider-button{margin-top:auto}.brz-ui-layout__frame .brz-ui-layout__frame-container{padding-top:30px;position:relative}.brz-ui-layout__frame .brz-ui-layout__frame-content{max-width:950px;background:var(--brz-ui-global-content-color,var(--brz-ui-content-color,var(--color-gray-lightest,#f1f1f1)))}.brz-ui-layout__frame .brz-ui-layout__frame-content--fullWidth{max-width:100%;flex:1 1 100%;width:100%}.brz-ui-layout__frame .brz-ui-layout__frame-content>.brz-ui-layout-content{overflow-x:hidden}.brz-ui-layout__frame .brz-ui-layout__frame-wrap{width:100%;height:100%;display:flex;flex-direction:column;max-width:var(--brz-ui-frame-content-width,980px);align-self:center;padding-left:15px;padding-right:15px;margin-left:auto;margin-right:auto}.brz-ui-layout__frame-sider.brz-ui-layout-sider-collapsed+.brz-ui-layout__frame-content,.brz-ui-layout__frame-sider:not(.brz-ui-layout-sider-collapsed)+.brz-ui-layout__frame-content{overflow:initial}.brz-ui-layout-header{padding:0}