•  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
r1773 vs r1774
1
{{{#!if ButtonSize = '50px', ButtonBdLightColor = '#ddd', ButtonBgLightColor = '#fff', ButtonArrowLightColor = '#212529', ButtonBgLightHoverColor ='#f5f5f5', ButtonBdLightActiveColor = '#0263b8', ButtonBgLightActiveColor = '#0275d8', ButtonArrowLightActiveColor = '#fff', ButtonShadowColor = '#0005'
2
}}}{{{#!if ButtonBdDarkColor = '#383b40', ButtonBgDarkColor = '#1c1d1f', ButtonArrowDarkColor = '#e0e0e0', ButtonBgDarkHoverColor ='#2d2f34', ButtonBdDarkActiveColor = '#bd7f14', ButtonBgDarkActiveColor = '#ec9f19', ButtonArrowDarkActiveColor = '#212529'
3
}}}
14
{{{#!style
2
.g-test {width:50px;height:50px;border-radius:50%;background:radial-gradient(transparent, red)}
5
.bb-button-r {width:@ButtonSize@;height:@ButtonSize@;border-radius:50%;border:1px solid @ButtonBdLightColor@;box-shadow:3px 3px 10px @ButtonShadowColor@;background:conic-gradient(from 45deg at 10% 50%, transparent 90deg, @ButtonBgLightColor@ 0), conic-gradient(from 225deg at 62% 50%, @ButtonBgLightColor@ 90deg, transparent 0), conic-gradient(from 225deg at 73% 50%, @ButtonArrowLightColor@ 90deg, @ButtonBgLightColor@ 0)}
36
4
.gg-test {width:50px;height:50px;border-radius:50%;background:linear-gradient(#00f, transparent)}
7
.bb-button-r:hover {background:conic-gradient(from 45deg at 10% 50%, transparent 90deg, @ButtonBgLightHoverColor@ 0), conic-gradient(from 225deg at 62% 50%, @ButtonBgLightHoverColor@ 90deg, transparent 0), conic-gradient(from 225deg at 73% 50%, @ButtonArrowLightColor@ 90deg, @ButtonBgLightHoverColor@ 0)}
58
6
}}}
9
.bb-button-r:active {border:1px solid @ButtonBdLightActiveColor@;background:conic-gradient(from 45deg at 10% 50%, transparent 90deg, @ButtonBgLightActiveColor@ 0), conic-gradient(from 225deg at 62% 50%, @ButtonBgLightActiveColor@ 90deg, transparent 0), conic-gradient(from 225deg at 73% 50%, @ButtonArrowLightActiveColor@ 90deg, @ButtonBgLightActiveColor@ 0)}
710
811
9
{{{#!wiki class="g-test"
10
{{{#!wiki class="gg-test"
11
}}}}}}
1212
13
{{{#!wiki style="width:50px;height:50px;border-radius:50%;border:1px solid #f00;background:linear-gradient(#00f, transparent), radial-gradient(#f00, transparent)"
14
}}}
1513
16
17
18
19
{{{#!style
20
.bb-button {width:50px;height:50px;border-radius:50%;border:1px solid #ddd;box-shadow:3px 3px 10px #0005;background:conic-gradient(from 45deg at 10% 50%, transparent 90deg, #fff 0), conic-gradient(from 225deg at 62% 50%, #fff 90deg, transparent 0), conic-gradient(from 225deg at 73% 50%, #212529 90deg, #fff 0)}
21
22
.bb-button:hover {background:conic-gradient(from 45deg at 10% 50%, transparent 90deg, #f5f5f5 0), conic-gradient(from 225deg at 62% 50%, #f5f5f5 90deg, transparent 0), conic-gradient(from 225deg at 73% 50%, #212529 90deg, #f5f5f5 0)}
23
24
.bb-button:active {border:1px solid #0263b8;background:conic-gradient(from 45deg at 10% 50%, transparent 90deg, #0275d8 0), conic-gradient(from 225deg at 62% 50%, #0275d8 90deg, transparent 0), conic-gradient(from 225deg at 73% 50%, #fff 90deg, #0275d8 0)}
25
2614
@theseed-dark-mode {
27
.bb-button {border:1px solid #383b40;background:conic-gradient(from 45deg at 10% 50%, transparent 90deg, #1c1d1f 0), conic-gradient(from 225deg at 62% 50%, #1c1d1f 90deg, transparent 0), conic-gradient(from 225deg at 73% 50%, #e0e0e0 90deg, #1c1d1f 0)}
15
.bb-button-r {border:1px solid @ButtonBdDarkColor@;background:conic-gradient(from 45deg at 10% 50%, transparent 90deg, @ButtonBgDarkColor@ 0), conic-gradient(from 225deg at 62% 50%, @ButtonBgDarkColor@ 90deg, transparent 0), conic-gradient(from 225deg at 73% 50%, @ButtonArrowDarkColor@ 90deg, @ButtonBgDarkColor@ 0)}
2816
29
.bb-button:hover {background:conic-gradient(from 45deg at 10% 50%, transparent 90deg, #2d2f34 0), conic-gradient(from 225deg at 62% 50%, #2d2f34 90deg, transparent 0), conic-gradient(from 225deg at 73% 50%, #e0e0e0 90deg, #2d2f34 0)}
17
.bb-button-r:hover {background:conic-gradient(from 45deg at 10% 50%, transparent 90deg, @ButtonBgDarkHoverColor@ 0), conic-gradient(from 225deg at 62% 50%, @ButtonBgDarkHoverColor@ 90deg, transparent 0), conic-gradient(from 225deg at 73% 50%, @ButtonArrowDarkColor@ 90deg, @ButtonBgDarkHoverColor@ 0)}
3018
31
.bb-button:active {border:1px solid #bd7f14;background:conic-gradient(from 45deg at 10% 50%, transparent 90deg, #ec9f19 0), conic-gradient(from 225deg at 62% 50%, #ec9f19 90deg, transparent 0), conic-gradient(from 225deg at 73% 50%, #212529 90deg, #ec9f19 0)}
19
.bb-button-r:active {border:1px solid @ButtonBdDarkActiveColor@;background:conic-gradient(from 45deg at 10% 50%, transparent 90deg, @ButtonBgDarkActiveColor@ 0), conic-gradient(from 225deg at 62% 50%,@ButtonBgDarkActiveColor@ 90deg, transparent 0), conic-gradient(from 225deg at 73% 50%, @ButtonArrowDarkActiveColor@ 90deg, @ButtonBgDarkActiveColor@ 0)}
3220
3321
.bb-hide {display:none}
3422
}
......
3624
3725
}}}
3826
39
{{{#!wiki class="bb-button" onclick="add-class,bb-img02,bb-hide;remove-class,bb-img01,bb-hide"
27
{{{#!wiki class="bb-button-l" onclick="add-class,bb-img02,bb-hide;remove-class,bb-img01,bb-hide"
4028
}}}
4129
4230
{{{#!wiki class="bb-img01"
4331
|| ㅇㅇ ||}}}{{{#!wiki class="bb-img02 bb-hide"
4432
|| ㅅㅅ ||}}}
4533
46
{{{#!wiki class="bb-button" onclick="add-class,bb-img01,bb-hide;remove-class,bb-img02,bb-hide"
34
{{{#!wiki class="bb-button-r" onclick="add-class,bb-img01,bb-hide;remove-class,bb-img02,bb-hide"
4735
}}}
4836
4937
......