11d10 < --main-bg-color-is-coral: coral; 26,30d24 < @keyframes myfade { < from { opacity: 1.0; } < to { opacity: 0.1; } < } < 32d25 < #myipolygon { clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%); } 35d27 < #myisaturate { filter: saturate(150%); } 38,39d29 < #myisepia { filter: sepia(60%); } < #myiopacity { filter: opacity(80%); } 45d34 < #myirem { opacity:0.6; z-index: -2; transform: rotate(rem(120deg, 25deg)); } 55,56c44 < #myiradial-gradient { background-image: radial-gradient(brown, purple, orange); } < #myilight-dark { background-color: light-dark(var(--light-bg), var(--dark-bg)); } :root { color-scheme: light dark; --light-bg: snow; --light-color: black; --dark-bg: black; --dark-color: snow; --main-bg-color-is-coral: coral; } --- > #myilight-dark { background-color: light-dark(var(--light-bg), var(--dark-bg)); } 60,61d47 < #myisin { width: calc(170px * cos(29deg)) !important; height: calc(sin(30deg) * 120px); } < #myitan { width: calc(170px * cos(29deg)) !important; height: calc(100px * tan(45deg)); } 68,69d53 < #myipow { opacity:0.6; z-index: -2; transform: rotate(calc(1turn * pow(1.5, 2))); } < #myirotate { opacity:0.6; z-index: -2; transform: rotate(25deg); } 75,76d58 < /* #myirepeat{ display: grid; grid-template-columns: repeat(2, 60px 1fr); grid-gap: 7px; box-sizing: border-box; } < */ 85,111c67 < #myimod { opacity:0.6; z-index: -2; rotate: mod(120deg, -25deg); } < #myirotate3d { opacity:0.6; z-index: -2; transform: rotate3d(1, 2, 1, 45deg); } < #myirotatex { opacity:0.6; z-index: -2; transform: rotateX(40deg); } < #myirotatey { opacity:0.6; z-index: -2; transform: rotateY(44deg); } < #myirotatez { opacity:0.6; z-index: -2; transform: rotateZ(48deg); } < #myiround { height: round(up, 185px, 25px); } < #myioklab { background-color: oklab(0 40% 20% / 0.5); } < #myioklch { background-color: oklch(60% 0.4 100); } < #myirgb { background-color:rgb(255 0 0 / 0.6); } < #myiperspective { opacity:0.6; z-index: -2; transform-style: preserve-3d; transform: perspective(5cm) rotateX(-15deg) rotateY(30deg); } < #myiscale { transform: scale(0.7, 0.5); } < #myiscalex { transform: scaleX(0.7); } < #myiscaley { transform: scaleY(0.7); } < #myiskew { opacity:0.6; z-index: -2; transform: skew(34deg, 15deg); } < #myiskewx { opacity:0.6; z-index: -2; transform: skewX(34deg); } < #myiskewy { opacity:0.6; z-index: -2; transform: skewY(34deg); } < #myitranslate { transform: translate(150px, 80px); } < #myitranslatex { transform: translateX(150px); } < #myitranslatey { transform: translateY(80px); } < #myisqrt { height: calc(50px * sqrt(9)); } < #myiray { opacity:0.6; z-index: -2; offset-position: top center; offset-path: ray(28deg); } < #myirepeating-conic-gradient { background-image: repeating-conic-gradient(red 10%, yellow 20%); } < #myirepeating-linear-gradient { background-image: repeating-linear-gradient(red, yellow 10%, green 20%); } < #myirepeating-radial-gradient { background-image: repeating-radial-gradient(red, yellow 10%, green 15%); } < #myisteps { @keyframes myfade { from { opacity: 1.0; } to { opacity: 0.1; } } animation: myfade 5s steps(6, jump-both); animation-iteration-count: infinite; } < #myiurl { -webkit-mask-image: url(/Welcome_files/shapeimage_1a.png); mask-image: url(/Welcome_files/shapeimage_1a.png); mask-size: 70%; mask-repeat: no-repeat; } < #myivar { :root { --main-bg-color-is-coral: coral; } background-color: var(--main-bg-color-is-coral); } --- > #myimod { rotate: mod(120deg, -25deg); } 127,128c83 < //if (thisverb.toLowerCase().indexOf('repeat') == 0) { alert('huh:' + thisverb); } < if (thisverb.toLowerCase().indexOf('attr') == 0 || thisverb.toLowerCase().indexOf('lch') == 0 || thisverb.toLowerCase().indexOf('light-dark') == 0 || thisverb.toLowerCase().indexOf('ray') == 0 || thisverb.toLowerCase() == 'repeat' || thisverb.toLowerCase().indexOf('var') == 0 || thisverb.toLowerCase().indexOf('translate') == 0 || thisverb.toLowerCase().indexOf('lab') == 0 || thisverb.toLowerCase().indexOf('rgb') == 0 || thisverb.toLowerCase().indexOf('repeating-') == 0 || thisverb.toLowerCase().indexOf('radial-gradient') == 0 || thisverb.toLowerCase().indexOf('linear-gradient') == 0 || thisverb.toLowerCase().indexOf('colo') == 0 || thisverb.toLowerCase().indexOf('hwb') == 0 || thisverb.toLowerCase().indexOf('hsl') == 0 || thisverb.toLowerCase() == 'repeat' || thisverb.toLowerCase().indexOf('minmax') == 0 || thisverb.toLowerCase().indexOf('fit-content') == 0 || thisverb.toLowerCase().indexOf('counter') == 0 || thisverb.toLowerCase().indexOf('conic') == 0) { --- > if (thisverb.toLowerCase().indexOf('attr') == 0 || thisverb.toLowerCase().indexOf('lch') == 0 || thisverb.toLowerCase().indexOf('light-dark') == 0 || thisverb.toLowerCase().indexOf('lab') == 0 || thisverb.toLowerCase().indexOf('linear-gradient') == 0 || thisverb.toLowerCase().indexOf('colo') == 0 || thisverb.toLowerCase().indexOf('hwb') == 0 || thisverb.toLowerCase().indexOf('hsl') == 0 || thisverb.toLowerCase().indexOf('minmax') == 0 || thisverb.toLowerCase().indexOf('fit-content') == 0 || thisverb.toLowerCase().indexOf('counter') == 0 || thisverb.toLowerCase().indexOf('conic') == 0) { 139c94 < } else if (thisverb.split(':')[0] == 'fit-content' || thisverb.split(':')[0] == 'minmax' || thisverb.split(':')[0] == 'repeat') { --- > } else if (thisverb.split(':')[0] == 'fit-content' || thisverb.split(':')[0] == 'minmax') { 171d125 < document.getElementById('divrepeat').style.visibility='hidden'; 253d206 < document.getElementById('divrepeat').style.display='none'; 255d207 < document.getElementById('divfit-content').style.display='grid'; 259d210 < document.getElementById('divrepeat').style.display='none'; 261d211 < document.getElementById('divminmax').style.display='grid'; 264,269d213 < } else if ((imgs[jimg].id + '~').indexOf('repeat~') != -1) { < document.getElementById('divminmax').style.display='none'; < document.getElementById('divfit-content').style.display='none'; < document.getElementById('divrepeat').style.display='grid'; < document.getElementById('divrepeat').style.visibility='visible'; < setTimeout(function(){ document.getElementById('divfit-content').style.display='grid'; }, 30000); 273c217 < if (thatverb.toLowerCase().indexOf('attr') == 0 || thatverb.toLowerCase().indexOf('colo') == 0 || thatverb.toLowerCase().indexOf('hsl') == 0 || thatverb.toLowerCase().indexOf('lch') == 0 || thatverb.toLowerCase().indexOf('light-dark') == 0 || thatverb.toLowerCase().indexOf('radial-gradient') == 0 || thatverb.toLowerCase().indexOf('linear-gradient') == 0 || thatverb.toLowerCase() == 'repeat' || thatverb.toLowerCase().indexOf('var') == 0 || thatverb.toLowerCase().indexOf('translate') == 0 || thatverb.toLowerCase().indexOf('lab') == 0 || thatverb.toLowerCase().indexOf('rgb') == 0 || thatverb.toLowerCase().indexOf('repeating-') == 0 || thatverb.toLowerCase().indexOf('ray') == 0 || thatverb.toLowerCase().indexOf('hwb') == 0 || thatverb.toLowerCase() == 'repeat' || thatverb.toLowerCase().indexOf('minmax') == 0 || thatverb.toLowerCase().indexOf('fit-content') == 0 || thatverb.toLowerCase().indexOf('counter') == 0 || thatverb.toLowerCase().indexOf('conic') == 0) { --- > if (thatverb.toLowerCase().indexOf('attr') == 0 || thatverb.toLowerCase().indexOf('colo') == 0 || thatverb.toLowerCase().indexOf('hsl') == 0 || thatverb.toLowerCase().indexOf('lch') == 0 || thatverb.toLowerCase().indexOf('light-dark') == 0 || thatverb.toLowerCase().indexOf('linear-gradient') == 0 || thatverb.toLowerCase().indexOf('lab') == 0 || thatverb.toLowerCase().indexOf('hwb') == 0 || thatverb.toLowerCase().indexOf('minmax') == 0 || thatverb.toLowerCase().indexOf('fit-content') == 0 || thatverb.toLowerCase().indexOf('counter') == 0 || thatverb.toLowerCase().indexOf('conic') == 0) { 300c244 < --- > 344,361d287 < background-color: pink; < padding: 5px; < } < < < #divrepeat { < display: grid; < grid-template-columns: repeat(2, 60px 1fr); < grid-gap: 7px; < box-sizing: border-box; < height: 550px; < width: 70%; < background-color: green; < padding: 7px; < visibility:hidden; < } < < #divrepeat > #myirepeat {