visreg-test
Version:
A visual regression testing solution that offers an easy setup with simple yet powerful customisation options, wrapped up in a convenient CLI runner to make assessing and accepting/rejecting diffs a breeze.
211 lines (210 loc) • 6.57 kB
CSS
@layer priority1, priority2, priority3, priority4, priority5;
@layer priority1{
.x1j1m3cn{border:1px solid rgba(0,0,0,.3)}
.x1jhw1fz{border:1px solid rgba(143,175,144,.6)}
.x4j6pqh{border:1px solid rgba(143,175,144,.8)}
.xdsth7f{border:1px solid rgba(211,74,80,.6)}
.x12yojqo{border:1px solid rgba(211,74,80,.8)}
.x19bbpc0{margin:0 auto}
.x1ghz6dp{margin:0}
.x1dko22b{margin:4rem}
.x1717udv{padding:0}
.x1uz70x1{padding:1rem}
.xr6jg0x{padding:2rem}
.xhlvvcx{padding:3rem}
@media (max-width: 1100px){.x1hi5cpm.x1hi5cpm{padding:1rem}}
}
@layer priority2{
.x116uinm{border-radius:.5rem}
.x1yt6v20{border-radius:.75rem}
.x3fmiap{border-radius:1rem}
.xgqjv89{border-top:1px solid rgba(0,0,0,.1)}
.x98rzlu{flex:1}
.xvh977a{gap:.25rem}
.x13z6uf9{gap:.5rem}
.xru8eyw{gap:1.5rem}
.x8fetqu{gap:1rem}
.xtacmkj{gap:2.5rem}
.x1h4iudz{gap:2rem}
.x1keyc1r{gap:3rem}
.xj5jcj5{gap:4rem}
.xfdnsyk{gap:6rem}
.xkpqfin{gap:7rem}
.xcdj2wh{gap:8rem}
.x10im51j{margin-block:0}
.xq6kz29{margin-block:1rem}
.xjdnhkh{margin-block:2rem}
.xdq1jza{margin-inline:2rem}
.xysyzu8{overflow:auto}
.xb3r6kr{overflow:hidden}
.x1algulf{overflow:scroll}
.xw4edqq{padding-inline:2rem}
.xdr7xzh{transition:background-color .3s}
.xnz68lp{transition:box-shadow .2s}
.xt0b8zv:hover{text-decoration:underline}
}
@layer priority3{
.x6s0dn4{align-items:center}
.x1iobw2b{align-items:space-between}
.x7a106z{align-items:start}
.xamitd3{align-self:center}
.x15u8j5n{background-color:#0B2027}
.xrd6bfg{background-color:rgb(243,247,243)}
.xkszdks{background-color:rgba(0,0,0,.08)}
.x1si8nl4{background-color:rgba(0,0,0,.1)}
.x679uo6{background-color:rgba(0,0,0,.8)}
.x1kqqj72{background-color:rgba(243,255,243,.08)}
.xjr33mu{background-color:rgba(250,236,237,1)}
.x1gzqxud{background-color:rgba(255,255,255,1)}
.xgo7cir{background-color:rgba(255,94,109,.08)}
.xay31cy{color:#272727}
.xkjj9wm{color:#FCF7F8}
.x1pvy4qg{color:rgba(0,0,0,.5)}
.x4prdry{column-gap:.5rem}
.x1izhsip{column-gap:1rem}
.xfdd877{column-gap:2rem}
.x1nml6z7{column-gap:3rem}
.xrnao7d{column-gap:4rem}
.x1bj50qz{column-gap:6rem}
.x1stgu56{column-gap:7rem}
.xd7wrqc{column-gap:8rem}
.xt0e3qv{cursor:default}
.x1ypdohk{cursor:pointer}
.x1huxd7x{cursor:zoom-in}
.x78zum5{display:flex}
.xifi7vn{filter:grayscale(1)}
.x4pfjvb{flex-basis:50%}
.xdt5ytf{flex-direction:column}
.x15zctf7{flex-direction:row-reverse}
.x1c4vz4f{flex-grow:0}
.x1iyjqo2{flex-grow:1}
.xs83m0k{flex-shrink:1}
.xv5jcfn{flex-shrink:5}
.xozqiw3{flex-wrap:nowrap}
.x1a02dak{flex-wrap:wrap}
.x1ey7xld{font-family:monospace}
.x1hbgfe{font-family:Ubunto Mono,monospace}
.x1nrrp6k{font-size:.9rem}
.xl56j7k{justify-content:center}
.x1qughib{justify-content:space-between}
.x3ct3a4{list-style-type:none}
.x1o7ex33{mix-blend-mode:exclusion}
.xbyyjgo{opacity:.5}
.x1hc1fzr{opacity:1}
.x10l6tqk{position:absolute}
.xixxii4{position:fixed}
.x1n2onr6{position:relative}
.x7wzq59{position:sticky}
.x1fc8kun{row-gap:.5rem}
.x1w6r25c{row-gap:1rem}
.x1d474pu{row-gap:2rem}
.xms273k{row-gap:3.5rem}
.xol2ywe{row-gap:3rem}
.x3tbmvi{row-gap:4rem}
.x1kn4z2w{row-gap:6rem}
.xee5y26{row-gap:7rem}
.xmmwdll{row-gap:8rem}
.x2b8uid{text-align:center}
.xlyipyv{text-overflow:ellipsis}
.xn80e1m{text-transform:capitalize}
.xuxw1ft{white-space:nowrap}
.x1vjfegm{z-index:1}
.xfo81ep{z-index:1000}
.xhtitgo{z-index:2}
.x1t76vzg:hover{background-color:#F2EBE8}
.xqy91qy:hover{background-color:rgba(0,0,0,.1)}
.x1mt8xg5:hover{box-shadow:rgba(0,0,0,.6) 0 7px 10px -3px}
.x144v4sp:hover{color:inherit}
@media (max-width: 1100px){.x8s1n9.x8s1n9{align-items:space-between}}
@media (max-width: 1000px){.xqxqsmd.xqxqsmd{column-gap:3rem}}
@media (max-width: 1200px){.xxxrgnv.xxxrgnv{column-gap:4rem}}
@media (max-width: 1100px){.xvrz5hk.xvrz5hk{flex-wrap:wrap}}
@media (max-width: 600px){.x1p72n19.x1p72n19{font-size:.5rem}}
@media (max-width: 900px){.x137fcuh.x137fcuh{font-size:.7rem}}
@media (max-width: 1100px){.x1l8dr4e.x1l8dr4e{justify-content:center}}
@media (max-width: 1000px){.x1ozisvq.x1ozisvq{justify-content:flex-start}}
@media (max-width: 1100px){.xq7uclu.xq7uclu{row-gap:3rem}}
}
@layer priority4{
.x5yr21d{height:100%}
.x18dl8mb{height:150px}
.x1xa6b72{height:700px}
.x1l5p03z{height:70vh}
.xt7dq6l{height:auto}
.xdmi676{height:max-content}
.x65caj5{height:min-content}
.xu96u03{left:0}
.x101gtxs{left:var(--left,revert)}
.x1eq25fj{margin-bottom:1.25rem}
.x1nhhxel{margin-bottom:1.5rem}
.xyi6m4r{margin-bottom:1rem}
.x1t84w78{margin-bottom:2rem}
.x1e1gh9h{margin-bottom:3rem}
.x1unp1qu{margin-bottom:4rem}
.x1dx3y42{margin-bottom:5rem}
.xxyw1jk{margin-left:-0.5rem}
.x8x9d4c{margin-left:auto}
.x1t5w0y4{margin-right:1rem}
.x9hhk39{margin-right:4rem}
.x1mjqqkp{margin-top:.5rem}
.x1c4vshn{margin-top:1.5rem}
.xj1urod{margin-top:1rem}
.x1cl2iem{margin-top:2rem}
.xfo0wrl{margin-top:4rem}
.xjs400a{max-height:-webkit-fill-available}
.xuyqlj2{max-height:300px}
.x179dxpb{max-height:80vh}
.x14roueg{max-height:auto}
.x1h9lsz5{max-width:-webkit-fill-available}
.x193iq5w{max-width:100%}
.x16xn7b0{max-width:100vw}
.x1wmrhtn{max-width:1100px}
.xptc4dh{max-width:1300px}
.x1cmgiil{max-width:1400px}
.x1racy4e{max-width:220px}
.xw5ewwj{max-width:300px}
.xic84rp{max-width:650px}
.x1ap80js{max-width:800px}
.x1lhqv5k{max-width:auto}
.xg6iff7{min-height:100vh}
.xeuugli{min-width:0}
.xlm99nl{min-width:240px}
.x18n5i07{min-width:300px}
.x17upfok{min-width:320px}
.xyipzdc{min-width:375px}
.xivswk8{min-width:570px}
.xw2csxc{overflow-x:auto}
.x14aock7{overflow-x:scroll}
.x1odjw0f{overflow-y:auto}
.x1rife3k{overflow-y:scroll}
.x18d9i69{padding-bottom:0}
.x17r0vjz{padding-bottom:2rem}
.x1uhho1l{padding-left:0}
.x128v7jw{padding-top:2rem}
.xoojcgd{top:-1rem}
.x13vifvy{top:0}
.xm3se36{top:2rem}
.xrzbxsz{top:var(--top,revert)}
.x1t0p1hu{width:-webkit-fill-available}
.xon8g8e{width:100%;width:moz-available;width:-webkit-fill-available}
.xh8yej3{width:100%}
.x1g6vzv9{width:170px}
.x1i1rx1s{width:1px}
.x1l2rt3b{width:400px}
.x1wzwfaw{width:570px}
.x14atkfc{width:auto}
.xeq5yr9{width:fit-content}
.xezivpi{width:max-content}
.xnq0rdo{width:min-content}
@media (max-width: 1000px){.x1xaesix.x1xaesix{margin-bottom:3rem}}
@media (min-width: 1101px){.xrg6zdq.xrg6zdq{margin-bottom:auto}}
@media (min-width: 1101px){.x1647r5k.x1647r5k{margin-top:17%}}
@media (max-width: 1100px){.x1iv7cg1.x1iv7cg1{max-height:40vh}}
@media (max-width: 1536px){.xyrnjrh.xyrnjrh{max-height:auto}}
@media (min-width: 1536px){.x186xdz9.x186xdz9{max-height:auto}}
@media (max-width: 1100px){.x1g7fwix.x1g7fwix{max-height:auto}}
@media (max-width: 1100px){.x1jrz3i5.x1jrz3i5{max-height:unset}}
}
@layer priority5{
.x15ozc13::before{display:none}
}