/
radialMenu.min.css
2 lines (2 loc) · 9.24 KB
/
radialMenu.min.css
1
2
/* Mozilla Public License, v. 2.0, http://mozilla.org/MPL/2.0/. */
:root{--radius:4em;--radial-delay:0.1s;--radial-speed:0.1s;--icon-size:25px;--font-size:1;--background-color:transparent;--color:#000;--ml:calc(var(--radius) / 2 + 1rem);--mr:calc(var(--radius) / 2 + 1rem)}.radial{display:inline-block;position:relative;vertical-align:middle;height:var(--icon-size)!important}.radialPivot{display:flex;align-items:center;justify-content:center;position:relative;z-index:10;left:0;top:0;margin-left:0;margin-right:0;width:var(--icon-size)!important;height:var(--icon-size)!important;transition:all var(--radial-speed) ease-in}.radialPivot{line-height:calc(var(--icon-size) * var(--font-size))!important;background-color:var(--background-color);color:var(--color)}.radialPivot>*{font-size:calc(var(--icon-size) * var(--font-size) * 1)!important}label.radialPivot{cursor:pointer}.radial.list.clear .radialPivot,.radial.menu.clear input[type=checkbox]:checked~.radialPivot{margin-left:var(--ml);margin-right:var(--mr)}.radial.list.clearLeft .radialPivot,.radial.menu.clearLeft input[type=checkbox]:checked~.radialPivot{margin-left:var(--ml)}.radial.list.clearRight .radialPivot,.radial.menu.clearRight input[type=checkbox]:checked~.radialPivot{margin-right:var(--mr)}.radial input[type=checkbox]{display:inline-block;position:absolute;top:0;left:0;z-index:9;width:1px!important;height:1px!important;opacity:0}.radialList{display:inline-block;position:relative;width:var(--icon-size)!important;height:var(--icon-size)!important;z-index:8;padding:0;visibility:hidden;list-style-type:none;margin-top:0;margin-bottom:0;margin-left:0;margin-right:0;transition:all var(--radial-speed) ease-in;--center:calc(0.5 * var(--icon-size) - 1px);left:0;top:calc(-2 * var(--center))}.radial.list.clear .radialList,.radial.menu.clear input[type=checkbox]:checked~.radialList{margin-left:var(--ml);margin-right:var(--mr)}.radial.list.clearLeft .radialList,.radial.menu.clearLeft input[type=checkbox]:checked~.radialList{margin-left:var(--ml)}.radial.list.clearRight .radialList,.radial.menu.clearRight input[type=checkbox]:checked~.radialList{margin-right:var(--mr)}.radialList>*{display:inline-block;position:absolute;display:flex;align-items:center;justify-content:center;top:0;left:0;width:var(--icon-size);height:var(--icon-size);margin:0;padding:0;visibility:hidden;transition:all var(--radial-speed) ease-in;z-index:12}.radial.list .radialList>*,input[type=checkbox]:checked~.radialList>*{font-size:calc(var(--icon-size) * var(--font-size) * 0.66)!important;line-height:calc(var(--icon-size) * var(--font-size))!important;background-color:var(--background-color);color:var(--color);left:calc(var(--radius) * var(--left) + (var(--center) - var(--icon-size) / 2));top:calc(var(--radius) * var(--top) + (var(--center) - var(--icon-size) / 2));opacity:1;visibility:visible}input[type=checkbox]:checked~.radialList>*{-webkit-transition-delay:calc(var(--radial-delay) * var(--delay));-moz-transition-delay:calc(var(--radial-delay) * var(--delay));transition-delay:calc(var(--radial-delay) * var(--delay))}.displace{position:absolute;width:calc(var(--radius) * 1);top:calc(0.25rem + var(--radius) * var(--top));left:calc(var(--radius) * var(--left));white-space:nowrap;display:flex;font-size:calc(var(--icon-size) * var(--font-size) * 0.66)!important;line-height:calc(var(--icon-size) * var(--font-size))!important;background-color:transparent;color:#000;border-radius:none}.icon{border-radius:50%}.border{border:solid var(--color) 1px}.radial a{text-decoration:none;color:inherit}.icon:hover{filter:invert(20%)}.icon:active{filter:contrast(0)}.sronly{clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;width:1px;margin:-1px;overflow:hidden;padding:0;position:absolute}.clock>*:nth-of-type(1){--top:-1;--left:0;--delay:0}.clock>*:nth-of-type(2){--top:-.866;--left:.50;--delay:1}.clock>*:nth-of-type(3){--top:-.50;--left:.866;--delay:2}.clock>*:nth-of-type(4){--top:0;--left:1;--delay:3}.clock>*:nth-of-type(5){--top:.50;--left:.866;--delay:4}.clock>*:nth-of-type(6){--top:.866;--left:.50;--delay:5}.clock>*:nth-of-type(7){--top:1;--left:0;--delay:6}.clock>*:nth-of-type(8){--top:.866;--left:-.50;--delay:7}.clock>*:nth-of-type(9){--top:.50;--left:-.866;--delay:8}.clock>*:nth-of-type(10){--top:0;--left:-1;--delay:9}.clock>*:nth-of-type(11){--top:-.50;--left:-.866;--delay:10}.clock>*:nth-of-type(12){--top:-.866;--left:-.50;--delay:11}.p0,.clock0{--top:-1.000!important;--left:0.000!important}.p1,.clock1{--top:-0.866!important;--left:0.500!important}.p2,.clock2{--top:-0.500!important;--left:0.866!important}.p3,.clock3{--top:0.000!important;--left:1.000!important}.p4,.clock4{--top:0.500!important;--left:0.866!important}.p5,.clock5{--top:0.866!important;--left:0.500!important}.p6,.clock6{--top:1.000!important;--left:0.000!important}.p7,.clock7{--top:0.866!important;--left:-0.500!important}.p8,.clock8{--top:0.500!important;--left:-0.866!important}.p9,.clock9{--top:0.000!important;--left:-1.000!important}.p10,.clock10{--top:-0.500!important;--left:-0.866!important}.p11,.clock11{--top:-0.866!important;--left:-0.500!important}.p12,.clock12{--top:-1.000!important;--left:0.000!important}.compass>*:nth-of-type(1){--top:-1;--left:0;--delay:0}.compass>*:nth-of-type(2){--top:-.924;--left:.383;--delay:1}.compass>*:nth-of-type(3){--top:-.707;--left:.707;--delay:2}.compass>*:nth-of-type(4){--top:-.383;--left:.924;--delay:3}.compass>*:nth-of-type(5){--top:0;--left:1;--delay:4}.compass>*:nth-of-type(6){--top:.383;--left:.924;--delay:5}.compass>*:nth-of-type(7){--top:.707;--left:.707;--delay:6}.compass>*:nth-of-type(8){--top:.924;--left:.383;--delay:7}.compass>*:nth-of-type(9){--top:1;--left:0;--delay:8}.compass>*:nth-of-type(10){--top:.924;--left:-.383;--delay:9}.compass>*:nth-of-type(11){--top:.707;--left:-.707;--delay:10}.compass>*:nth-of-type(12){--top:.383;--left:-.924;--delay:11}.compass>*:nth-of-type(13){--top:0;--left:-1;--delay:12}.compass>*:nth-of-type(14){--top:-.383;--left:-.924;--delay:13}.compass>*:nth-of-type(15){--top:-.707;--left:-.707;--delay:14}.compass>*:nth-of-type(16){--top:-.924;--left:-.383;--delay:15}.pN,.compass0,.compass16{--top:-1.000!important;--left:0.000!important}.pNNE,.compass1{--top:-0.924!important;--left:0.383!important}.pNE,.compass2{--top:-0.707!important;--left:0.707!important}.pENE,.compass3{--top:-0.383!important;--left:0.924!important}.pE,.compass4{--top:0.000!important;--left:1.000!important}.pESE,.compass5{--top:0.383!important;--left:0.924!important}.pSE,.compass6{--top:0.707!important;--left:0.707!important}.pSSE,.compass7{--top:0.924!important;--left:0.383!important}.pS,.compass8{--top:1.000!important;--left:0.000!important}.pSSW,.compass9{--top:0.924!important;--left:-0.383!important}.pSW,.compass10{--top:0.707!important;--left:-0.707!important}.pWSW,.compass11{--top:0.383!important;--left:-0.924!important}.pW,.compass12{--top:0.000!important;--left:-1.000!important}.pWNW,.compass13{--top:-0.383!important;--left:-0.924!important}.pNW,.compass14{--top:-0.707!important;--left:-0.707!important}.pNNW,.compass15{--top:-0.924!important;--left:-0.383!important}.size0{--icon-size:0.75rem!important}.size1{--icon-size:1.00rem!important}.size2{--icon-size:1.25rem!important}.size3{--icon-size:1.50rem!important}.size4{--icon-size:1.75rem!important}.size5{--icon-size:2.00rem!important}.size6{--icon-size:2.25rem!important}.size7{--icon-size:2.50rem!important}.size8{--icon-size:2.75rem!important}.size9{--icon-size:3.00rem!important}.radius1{--radius:1rem!important}.radius15{--radius:1.5rem!important}.radius2{--radius:2rem!important}.radius3{--radius:3rem!important}.radius4{--radius:4rem!important}.radius5{--radius:5rem!important}.radius6{--radius:6rem!important}.radius7{--radius:7rem!important}.radius8{--radius:8rem!important}.radius9{--radius:9rem!important}.radius10{--radius:10rem!important}.f0{--font-size:.5}.f1{--font-size:.66}.f2{--font-size:.75}.f3{--font-size:1}.f4{--font-size:1.25}.f5{--font-size:1.33}.f6{--font-size:1.5}.tl{text-align:left;justify-content:flex-start}.tc{text-align:center;justify-content:center}.tr{text-align:right;justify-content:flex-end}.d1{--delay:0!important}.d2{--delay:1!important}.d3{--delay:2!important}.d4{--delay:3!important}.d5{--delay:4!important}.d6{--delay:5!important}.d7{--delay:6!important}.d8{--delay:7!important}.d9{--delay:8!important}.d10{--delay:9!important}.d11{--delay:10!important}.d12{--delay:11!important}.d13{--delay:12!important}.d14{--delay:13!important}.d15{--delay:14!important}.d16{--delay:15!important}.delay0{--radial-delay:0.0s!important}.delay05{--radial-delay:0.05s!important}.delay1{--radial-delay:0.1s!important}.delay2{--radial-delay:0.2s!important}.delay3{--radial-delay:0.3s!important}.delay4{--radial-delay:0.4s!important}.delay5{--radial-delay:0.5s!important}.delay6{--radial-delay:0.6s!important}.delay7{--radial-delay:0.7s!important}.delay8{--radial-delay:0.8s!important}.delay9{--radial-delay:0.9s!important}.delay10{--radial-delay:1.0s!important}.speed0{--radial-speed:0.0s!important}.speed05{--radial-speed:0.05s!important}.speed1{--radial-speed:0.1s!important}.speed2{--radial-speed:0.2s!important}.speed3{--radial-speed:0.3s!important}.speed4{--radial-speed:0.4s!important}.speed5{--radial-speed:0.5s!important}.speed6{--radial-speed:0.6s!important}.speed7{--radial-speed:0.7s!important}.speed8{--radial-speed:0.8s!important}.speed9{--radial-speed:0.9s!important}.speed10{--radial-speed:1.0s!important}