사용자
flyant(비교)
| r1550 vs r1551 | ||
|---|---|---|
| 1 | {{{#!if buttonbgcolor = ' | |
| 1 | {{{#!if buttonbgcolor = 'black', hovercolor = '#222', activecolor = 'red', numcolor = '#fff' | |
| 2 | 2 | }}}{{{#!style |
| 3 | 3 | .num-button {display:flex;width:40px;height:40px;border:1px solid red;background:@buttonbgcolor@;cursor:pointer} |
| 4 | 4 | .num-button:hover {background:@hovercolor@} |
| 5 | 5 | .num-button:active {background:@activecolor@} |
| 6 | 6 | |
| 7 | .num-button-0 {display:flex;width:40px;height:40px;border:1px solid red;background:@buttonbgcolor@;cursor:pointer} | |
| 8 | .num-button-0:hover {background:@hovercolor@} | |
| 9 | .num-button-0:active {background:@activecolor@} | |
| 10 | ||
| 11 | .num-button-1 {display:flex;width:40px;height:40px;border:1px solid red;background:@buttonbgcolor@;cursor:pointer} | |
| 12 | .num-button-1:hover {background:@hovercolor@} | |
| 13 | .num-button-1:active {background:@activecolor@} | |
| 14 | ||
| 15 | .num-button-2 {display:flex;width:40px;height:40px;border:1px solid red;background:@buttonbgcolor@;cursor:pointer} | |
| 16 | .num-button-2:hover {background:@hovercolor@} | |
| 17 | .num-button-2:active {background:@activecolor@} | |
| 18 | ||
| 19 | .num-button-3 {display:flex;width:40px;height:40px;border:1px solid red;background:@buttonbgcolor@;cursor:pointer} | |
| 20 | .num-button-3:hover {background:@hovercolor@} | |
| 21 | .num-button-3:active {background:@activecolor@} | |
| 22 | ||
| 23 | .num-button-4 {display:flex;width:40px;height:40px;border:1px solid red;background:@buttonbgcolor@;cursor:pointer} | |
| 24 | .num-button-4:hover {background:@hovercolor@} | |
| 25 | .num-button-4:active {background:@activecolor@} | |
| 26 | ||
| 27 | .num-button-5 {display:flex;width:40px;height:40px;border:1px solid red;background:@buttonbgcolor@;cursor:pointer} | |
| 28 | .num-button-5:hover {background:@hovercolor@} | |
| 29 | .num-button-5:active {background:@activecolor@} | |
| 30 | ||
| 31 | .num-button-6 {display:flex;width:40px;height:40px;border:1px solid red;background:@buttonbgcolor@;cursor:pointer} | |
| 32 | .num-button-6:hover {background:@hovercolor@} | |
| 33 | .num-button-6:active {background:@activecolor@} | |
| 34 | ||
| 35 | .num-button-7 {display:flex;width:40px;height:40px;border:1px solid red;background:@buttonbgcolor@;cursor:pointer} | |
| 36 | .num-button-7:hover {background:@hovercolor@} | |
| 37 | .num-button-7:active {background:@activecolor@} | |
| 38 | ||
| 39 | .num-button-8 {display:flex;width:40px;height:40px;border:1px solid red;background:@buttonbgcolor@;cursor:pointer} | |
| 40 | .num-button-8:hover {background:@hovercolor@} | |
| 41 | .num-button-8:active {background:@activecolor@} | |
| 42 | ||
| 43 | .num-button-9 {display:flex;width:40px;height:40px;border:1px solid red;background:@buttonbgcolor@;cursor:pointer} | |
| 44 | .num-button-9:hover {background:@hovercolor@} | |
| 45 | .num-button-9:active {background:@activecolor@} | |
| 46 | ||
| 47 | 7 | .num-0 {display:inline-block;width:50px;height:80px;border:1px solid gray;background:conic-gradient(red 0%, #000 0)} |
| 48 | 8 | .num-1 {display:inline-block;width:50px;height:80px;border:1px solid gray;background:conic-gradient(orange 10%, #000 0)} |
| 49 | 9 | .num-2 {display:inline-block;width:50px;height:80px;border:1px solid gray;background:conic-gradient(yellow 20%, #000 0)} |
| ... | ... | |
| 73 | 33 | }}}{{{#!wiki class="n9" |
| 74 | 34 | }}} |
| 75 | 35 | |
| 36 | ||
| 37 | {{{#!wiki style="display:inline-block;padding:0 10px;border:1px solid gray" | |
| 76 | 38 | {{{#!if index1 = -1, index2 = 0 |
| 77 | 39 | }}}{{{#!if ++index1, ++index2 |
| 78 | }}} | |
| 79 | {{{#!wiki | |
| 80 | ||
| 40 | }}}{{{#!wiki class="num-group-@index1@" | |
| 81 | 41 | {{{#!wiki class="num-flex" |
| 82 | {{{#!wiki class="num-button | |
| 42 | {{{#!wiki class="num-button" onclick="add-class,num-group-@index1@,num-hide;remove-class,num-group-@index2@,num-hide;add-class,n@index1@,num-0" | |
| 83 | 43 | {{{#!wiki class="num-align" |
| 84 | 1}}}}}}{{{#!wiki class="num-button | |
| 44 | 1}}}}}}{{{#!wiki class="num-button" onclick="add-class,num-group-@index1@,num-hide;remove-class,num-group-@index2@,num-hide;add-class,n@index1@,num-1" | |
| 85 | 45 | {{{#!wiki class="num-align" |
| 86 | 2}}}}}}{{{#!wiki class="num-button | |
| 46 | 2}}}}}}{{{#!wiki class="num-button" onclick="add-class,num-group-@index1@,num-hide;remove-class,num-group-@index2@,num-hide;add-class,n@index1@,num-2" | |
| 87 | 47 | {{{#!wiki class="num-align" |
| 88 | 48 | 3}}}}}}}}}{{{#!wiki class="num-flex" |
| 89 | {{{#!wiki class="num-button | |
| 49 | {{{#!wiki class="num-button" onclick="add-class,num-group-@index1@,num-hide;remove-class,num-group-@index2@,num-hide;add-class,n@index1@,num-3" | |
| 90 | 50 | {{{#!wiki class="num-align" |
| 91 | 4}}}}}}{{{#!wiki class="num-button | |
| 51 | 4}}}}}}{{{#!wiki class="num-button" onclick="add-class,num-group-@index1@,num-hide;remove-class,num-group-@index2@,num-hide;add-class,n@index1@,num-4" | |
| 92 | 52 | {{{#!wiki class="num-align" |
| 93 | 5}}}}}}{{{#!wiki class="num-button | |
| 53 | 5}}}}}}{{{#!wiki class="num-button" onclick="add-class,num-group-@index1@,num-hide;remove-class,num-group-@index2@,num-hide;add-class,n@index1@,num-5" | |
| 94 | 54 | {{{#!wiki class="num-align" |
| 95 | 55 | 6}}}}}}}}}{{{#!wiki class="num-flex" |
| 96 | {{{#!wiki class="num-button | |
| 56 | {{{#!wiki class="num-button" onclick="add-class,num-group-@index1@,num-hide;remove-class,num-group-@index2@,num-hide;add-class,n@index1@,num-6" | |
| 97 | 57 | {{{#!wiki class="num-align" |
| 98 | 7}}}}}}{{{#!wiki class="num-button | |
| 58 | 7}}}}}}{{{#!wiki class="num-button" onclick="add-class,num-group-@index1@,num-hide;remove-class,num-group-@index2@,num-hide;add-class,n@index1@,num-7" | |
| 99 | 59 | {{{#!wiki class="num-align" |
| 100 | 8}}}}}}{{{#!wiki class="num-button | |
| 60 | 8}}}}}}{{{#!wiki class="num-button" onclick="add-class,num-group-@index1@,num-hide;remove-class,num-group-@index2@,num-hide;add-class,n@index1@,num-8" | |
| 101 | 61 | {{{#!wiki class="num-align" |
| 102 | 62 | 9}}}}}}}}}{{{#!wiki class="num-flex" |
| 103 | 63 | {{{#!wiki class="num-align" |
| 104 | {{{#!wiki class="num-button | |
| 64 | {{{#!wiki class="num-button" onclick="add-class,num-group-@index1@,num-hide;remove-class,num-group-@index2@,num-hide;add-class,n@index1@,num-9" | |
| 105 | 65 | {{{#!wiki class="num-align" |
| 106 | 0}}}}}}}}}}}} | |
| 107 | }}}}}} | |
| 66 | 0}}}}}}}}}}}}}}}{{{#!if ++index1, ++index2 | |
| 67 | }}}{{{#!wiki class="num-group-@index1@ num-hide" | |
| 68 | {{{#!wiki class="num-flex" | |
| 69 | {{{#!wiki class="num-button" onclick="add-class,num-group-@index1@,num-hide;remove-class,num-group-@index2@,num-hide;add-class,n@index1@,num-0" | |
| 70 | {{{#!wiki class="num-align" | |
| 71 | 1}}}}}}{{{#!wiki class="num-button" onclick="add-class,num-group-@index1@,num-hide;remove-class,num-group-@index2@,num-hide;add-class,n@index1@,num-1" | |
| 72 | {{{#!wiki class="num-align" | |
| 73 | 2}}}}}}{{{#!wiki class="num-button" onclick="add-class,num-group-@index1@,num-hide;remove-class,num-group-@index2@,num-hide;add-class,n@index1@,num-2" | |
| 74 | {{{#!wiki class="num-align" | |
| 75 | 3}}}}}}}}}{{{#!wiki class="num-flex" | |
| 76 | {{{#!wiki class="num-button" onclick="add-class,num-group-@index1@,num-hide;remove-class,num-group-@index2@,num-hide;add-class,n@index1@,num-3" | |
| 77 | {{{#!wiki class="num-align" | |
| 78 | 4}}}}}}{{{#!wiki class="num-button" onclick="add-class,num-group-@index1@,num-hide;remove-class,num-group-@index2@,num-hide;add-class,n@index1@,num-4" | |
| 79 | {{{#!wiki class="num-align" | |
| 80 | 5}}}}}}{{{#!wiki class="num-button" onclick="add-class,num-group-@index1@,num-hide;remove-class,num-group-@index2@,num-hide;add-class,n@index1@,num-5" | |
| 81 | {{{#!wiki class="num-align" | |
| 82 | 6}}}}}}}}}{{{#!wiki class="num-flex" | |
| 83 | {{{#!wiki class="num-button" onclick="add-class,num-group-@index1@,num-hide;remove-class,num-group-@index2@,num-hide;add-class,n@index1@,num-6" | |
| 84 | {{{#!wiki class="num-align" | |
| 85 | 7}}}}}}{{{#!wiki class="num-button" onclick="add-class,num-group-@index1@,num-hide;remove-class,num-group-@index2@,num-hide;add-class,n@index1@,num-7" | |
| 86 | {{{#!wiki class="num-align" | |
| 87 | 8}}}}}}{{{#!wiki class="num-button" onclick="add-class,num-group-@index1@,num-hide;remove-class,num-group-@index2@,num-hide;add-class,n@index1@,num-8" | |
| 88 | {{{#!wiki class="num-align" | |
| 89 | 9}}}}}}}}}{{{#!wiki class="num-flex" | |
| 90 | {{{#!wiki class="num-align" | |
| 91 | {{{#!wiki class="num-button" onclick="add-class,num-group-@index1@,num-hide;remove-class,num-group-@index2@,num-hide;add-class,n@index1@,num-9" | |
| 92 | {{{#!wiki class="num-align" | |
| 93 | 0}}}}}}}}}}}}}}} | |
| 94 | }}} | |
| 108 | 95 | |
| 109 | 96 | |
| 110 | 97 | |
| ... | ... |