flyonui/components/diff/object.js

The easiest, free and open-source Tailwind CSS component library with semantic classes.

export default {".diff":{"position":"relative","display":"grid","width":"100%","overflow":"hidden","container-type":"inline-size","grid-template-columns":"auto 1fr"},".diff-resizer":{"top":"calc(1/2 * 100%)","z-index":1,"height":"calc(0.25rem * 1.5)","width":"25rem","max-width":"calc(100cqi - 1rem)","min-width":"calc(0.25rem * 4)","--tw-translate-x":"0.335rem","translate":["var(--tw-translate-x) var(--tw-translate-y)","var(--tw-translate-x) var(--tw-translate-y)"],"--tw-translate-y":"calc(0.18rem * -1)","--tw-scale-y":"400%","scale":"var(--tw-scale-x) var(--tw-scale-y)","resize":"horizontal","overflow":"hidden","opacity":"0%","clip-path":"inset(calc(100% - 0.75rem) 0 0 calc(100% - 0.75rem))"},".diff-resizer, .diff-item-1, .diff-item-2":{"position":"relative","grid-column-start":"1","grid-row-start":"1"},".diff-item-1:after":{"pointer-events":"none","position":"absolute","inset-inline-end":"1px","top":"calc(1/2 * 100%)","bottom":"calc(0.25rem * 0)","z-index":1,"width":"calc(0.25rem * 5)","height":"calc(0.25rem * 5)","rotate":"45deg","border-style":"var(--tw-border-style)","border-width":"2px","border-color":"var(--color-base-100)","background-color":"color-mix(in oklab, var(--color-primary) 40%, transparent)","--tw-shadow":"0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1))","box-shadow":"var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)","--tw-shadow-color":"color-mix(in oklab, color-mix(in oklab, var(--color-base-300) 20%, transparent) var(--tw-shadow-alpha), transparent)","outline-style":"var(--tw-outline-style)","outline-width":"1px","outline-offset":"calc(2px * -1)","outline-color":"color-mix(in oklab, var(--color-base-content) 5%, transparent)","--tw-backdrop-blur":"blur(8px)","webkit-backdrop-filter":"var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)","backdrop-filter":["var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)","blur(8px)"],"--tw-content":"''","content":"var(--tw-content)","translate":"50% -50%"},".diff-item-2":{"overflow":"hidden","border-inline-end-style":"var(--tw-border-style)","border-inline-end-width":"2px","border-color":"var(--color-base-100)"},".diff-item-1 > *, .diff-item-2 > *":{"pointer-events":"none","position":"absolute","inset-inline-start":"calc(0.25rem * 0)","top":"calc(0.25rem * 0)","bottom":"calc(0.25rem * 0)","height":"100%","width":"100cqi","max-width":"none","object-fit":"cover","object-position":"center"},"[dir=\"rtl\"] .diff-resizer":{"transform-origin":"0 100%","translate":"-0.29rem 0.37rem","clip-path":"inset(calc(100% - 0.75rem) calc(100% - 0.75rem) 0 0)"},"[dir=\"rtl\"] .diff-item-1:after":{"right":"auto","left":"1px","translate":"-50% -50%"},"[dir=\"rtl\"] .diff-item-1 > *, [dir=\"rtl\"] .diff-item-2 > *":{"left":"auto","right":"0"}};