-
Notifications
You must be signed in to change notification settings - Fork 0
/
styles.css
165 lines (106 loc) · 3.91 KB
/
styles.css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
/* Bamboo_Dojo, Sabakis theme from bamboo since kaya is so
expensive!*/
/* Stones: Replace "mi_white_stones.svg" and
"mi_black_stones.svg"with an image of the stones you prefer, with a
format of your choice.*/
.goban li.sign_-1 .stone img {
background-image: url('mi_white_stones.svg');
/* Shadow */
-webkit-filter: drop-shadow(.085em .077em 1.7px rgba(0,0,0,.45));
filter: drop-shadow(.085em .077em 1.7px rgba(0,0,0,.45));
}
.goban li.sign_1 .stone img {
background-image: url('mi_black_stones.svg');
/* Shadow */
-webkit-filter: drop-shadow(.085em .077em 1.7px rgba(0,0,0,.45));
filter: drop-shadow(.085em .077em 1.7px rgba(0,0,0,.45));
}
/* Theme goban:
Here you can change the image of the bamboo wood goban.*/
.goban,
.goban .row li .stone span::before,
.goban .row li .stone span::after,
.goban .row li.cross .stone span {
background-color: #ECB55A;
background-image: url('bamboo.svg');
/* uncommenting one of these will give the bamboo more or less
sharpness, try what is best for you. you can uncomment one of them, or
comment both */
background-size: contain
/* background-size: cover */
}
.goban .row li.triangle .stone span::after {
border-bottom-color: #ECB55A;
}
/* Black lines: May you prefer goban lines of the original theme...
comment all this */
.goban .row li {
position: relative;
background: url('inner.svg') center;
}
.goban .row:nth-child(3) li {
background-image: url('side-n.svg');
}
.goban .row:nth-last-child(3) li {
background-image: url('side-s.svg');
}
.goban .row li:first-child {
background-image: url('side-w.svg');
}
.goban .row li:last-child {
background-image: url('side-e.svg');
}
.goban .row:nth-child(3) li:first-child {
background-image: url('corner-nw.svg');
}
.goban .row:nth-child(3) li:last-child {
background-image: url('corner-ne.svg');
}
.goban .row:nth-last-child(3) li:first-child {
background-image: url('corner-sw.svg');
}
.goban .row:nth-last-child(3) li:last-child {
background-image: url('corner-se.svg');
}
/* Hoshis */
.goban .row li.hoshi::after {
background: #000000;
}
/*If you are having issues with hoshis or want them to be bigger,
(un)commenting this section will turn defaults on/off at start up.
hoshis are capricious an behave worse or better depending on the OS,
the resolution, or on their own mood...who knows, I like them to be
smaller, you can tweak this section to accommodate them to your
computer, commenting this makes Sabaki to use the original ones.*/
.goban .row li.hoshi::after {
content: '';
display: block;
top: 55.9%;
left: 55.9%;
width: 5px;
height: 5px;
margin-top: calc(-2.5 - 1px);
margin-left: calc(-2.5 - 1px);
border-radius: 5;
opacity: .7
}
/* Border: I don't like borders, change the px values to bring them
back if you do. */
.goban {
border: 0px solid #000000;
padding: 0px 0px 0px 0px;
}
/* Background: The original background has the superbness of the
elegantly well made simple things, I changed it just for fun, change
here to whatever background you prefer*/
main {
background-image: url(wood_and_bowls.svg);
/* If playing with white sit in the opposite of the table by
uncommenting this.*/
/* transform: rotate(180deg); */
}
/*I know this document might be very little CCSish... anyway if a
developer is interested in reading it for some strange reason,
he/she have the power to do it... I needed to do it like this to be
able to understand what I'm doing.*/