@mantine/core
Version:
React components library focused on usability, accessibility and developer experience
1 lines • 4.84 kB
CSS
@layer mantine {.m-fee9c77{--cp-width-xs:calc(11.25rem*var(--mantine-scale));--cp-width-sm:calc(12.5rem*var(--mantine-scale));--cp-width-md:calc(15rem*var(--mantine-scale));--cp-width-lg:calc(17.5rem*var(--mantine-scale));--cp-width-xl:calc(20rem*var(--mantine-scale));--cp-preview-size-xs:calc(1.625rem*var(--mantine-scale));--cp-preview-size-sm:calc(2.125rem*var(--mantine-scale));--cp-preview-size-md:calc(2.625rem*var(--mantine-scale));--cp-preview-size-lg:calc(3.125rem*var(--mantine-scale));--cp-preview-size-xl:calc(3.375rem*var(--mantine-scale));--cp-thumb-size-xs:calc(0.5rem*var(--mantine-scale));--cp-thumb-size-sm:calc(0.75rem*var(--mantine-scale));--cp-thumb-size-md:calc(1rem*var(--mantine-scale));--cp-thumb-size-lg:calc(1.25rem*var(--mantine-scale));--cp-thumb-size-xl:calc(1.375rem*var(--mantine-scale));--cp-saturation-height-xs:calc(6.25rem*var(--mantine-scale));--cp-saturation-height-sm:calc(6.875rem*var(--mantine-scale));--cp-saturation-height-md:calc(7.5rem*var(--mantine-scale));--cp-saturation-height-lg:calc(8.75rem*var(--mantine-scale));--cp-saturation-height-xl:calc(10rem*var(--mantine-scale));--cp-preview-size:var(--cp-preview-size-sm);--cp-thumb-size:var(--cp-thumb-size-sm);--cp-saturation-height:var(--cp-saturation-height-sm);--cp-width:var(--cp-width-sm);--cp-body-spacing:var(--mantine-spacing-sm);padding:calc(.0625rem*var(--mantine-scale));width:var(--_cp-width,var(--cp-width))}.m-fee9c77[data-full-width]{--_cp-width:100%}.m-9dddfbac{height:var(--cp-preview-size);width:var(--cp-preview-size)}.m-bffecc3e{display:flex;padding-top:calc(var(--cp-body-spacing)/2)}.m-3283bb96{flex:1}.m-3283bb96:not(:only-child){margin-right:var(--mantine-spacing-xs)}.m-40d572ba{border:calc(.125rem*var(--mantine-scale)) solid var(--mantine-color-white);border-radius:var(--_cp-thumb-size);box-shadow:0 0 calc(.0625rem*var(--mantine-scale)) rgba(0,0,0,.6);height:var(--_cp-thumb-size);left:calc(var(--_thumb-x-offset) - var(--_cp-thumb-size)/2);outline:var(--_outline);overflow:hidden;position:absolute;top:calc(var(--_thumb-y-offset) - var(--_cp-thumb-size)/2);width:var(--_cp-thumb-size)}.m-d8ee6fd8{cursor:pointer;flex:0 0 calc(var(--cp-swatch-size) - 0.25rem*var(--mantine-scale));height:unset;margin:calc(.125rem*var(--mantine-scale));min-height:0;min-width:0;padding-bottom:calc(var(--cp-swatch-size) - .25rem*var(--mantine-scale));width:unset}.m-5711e686{display:flex;flex-wrap:wrap;margin-left:calc(-.125rem*var(--mantine-scale));margin-right:calc(-.125rem*var(--mantine-scale));margin-top:calc(.3125rem*var(--mantine-scale))}.m-202a296e{--cp-thumb-size-xs:calc(0.5rem*var(--mantine-scale));--cp-thumb-size-sm:calc(0.75rem*var(--mantine-scale));--cp-thumb-size-md:calc(1rem*var(--mantine-scale));--cp-thumb-size-lg:calc(1.25rem*var(--mantine-scale));--cp-thumb-size-xl:calc(1.375rem*var(--mantine-scale));--_cp-thumb-size:var(--cp-thumb-size,calc(0.75rem*var(--mantine-scale)));-webkit-tap-highlight-color:transparent;border-radius:var(--mantine-radius-sm);height:var(--cp-saturation-height);margin:calc(var(--cp-thumb-size)/2);position:relative}.m-202a296e[data-focus-ring=auto]:focus:focus-visible .m-40d572ba{--_outline:calc(0.125rem*var(--mantine-scale)) solid var(--mantine-color-blue-filled)}.m-202a296e[data-focus-ring=always]:focus .m-40d572ba{--_outline:calc(0.125rem*var(--mantine-scale)) solid var(--mantine-color-blue-filled)}.m-11b3db02{border-radius:var(--mantine-radius-sm);inset:calc(var(--cp-thumb-size)*-1/2 - .0625rem*var(--mantine-scale));position:absolute}.m-d856d47d{--cp-thumb-size-xs:calc(0.5rem*var(--mantine-scale));--cp-thumb-size-sm:calc(0.75rem*var(--mantine-scale));--cp-thumb-size-md:calc(1rem*var(--mantine-scale));--cp-thumb-size-lg:calc(1.25rem*var(--mantine-scale));--cp-thumb-size-xl:calc(1.375rem*var(--mantine-scale));--_cp-thumb-size:var(--cp-thumb-size,calc(0.75rem*var(--mantine-scale)));height:calc(var(--_cp-thumb-size) + .125rem*var(--mantine-scale));margin-left:calc(var(--_cp-thumb-size)/2);margin-right:calc(var(--_cp-thumb-size)/2);outline:none;position:relative}.m-d856d47d+.m-d856d47d{margin-top:calc(.375rem*var(--mantine-scale))}.m-d856d47d[data-focus-ring=auto]:focus:focus-visible .m-40d572ba{--_outline:calc(0.125rem*var(--mantine-scale)) solid var(--mantine-color-blue-filled)}.m-d856d47d[data-focus-ring=always]:focus .m-40d572ba{--_outline:calc(0.125rem*var(--mantine-scale)) solid var(--mantine-color-blue-filled)}[data-mantine-color-scheme=light] .m-d856d47d{--_slider-checkers:var(--mantine-color-gray-3)}[data-mantine-color-scheme=dark] .m-d856d47d{--_slider-checkers:var(--mantine-color-dark-4)}.m-8f327113{border-radius:10000rem;bottom:0;left:calc(var(--_cp-thumb-size)*-1/2 - .0625rem*var(--mantine-scale));position:absolute;right:calc(var(--_cp-thumb-size)*-1/2 - .0625rem*var(--mantine-scale));top:0}}