Commit | Line | Data |
---|---|---|
1d184b4c BA |
1 | .container#variantPage |
2 | padding: 0 | |
3 | ||
6a01d4f7 BA |
4 | //.container#variantPage > .row > div |
5 | @media screen and (max-width: 767px) | |
6 | .col-sm-12 | |
7 | padding: 0 | |
8 | ||
9 | @media screen and (max-width: 767px) | |
10 | h4 | |
11 | margin: 0 0 10px 0 | |
12 | p | |
13 | margin-left: 0 | |
14 | margin-right: 0 | |
15 | padding: 0 3px | |
16 | ||
01ca2adc BA |
17 | #pgn-div > a |
18 | display: none | |
19 | ||
20 | #pgn-div > p | |
21 | cursor: pointer | |
22 | ||
e7cfa68d BA |
23 | .warn |
24 | padding: 3px | |
25 | color: red | |
26 | background-color: lightgrey | |
27 | font-weight: bold | |
28 | ||
e64a4eff | 29 | .playing, button.playing:hover |
186516b8 BA |
30 | background-color: #ffcc99 |
31 | ||
e64a4eff | 32 | .seek, button.seek:hover |
186516b8 BA |
33 | background-color: #cc99ff |
34 | ||
1d184b4c BA |
35 | // https://stackoverflow.com/questions/5445491/height-equal-to-dynamic-width-css-fluid-layout |
36 | figure.diagram-container > .diagram | |
37 | display: block | |
38 | width: 45% | |
39 | min-width: 300px | |
40 | max-width: 800px | |
41 | margin-left: auto | |
42 | margin-right: auto | |
43 | ||
bdb1f12d BA |
44 | .topindicator |
45 | position: relative | |
1d184b4c BA |
46 | border: 1px solid brown |
47 | ||
bdb1f12d BA |
48 | .indic-left |
49 | float: left | |
50 | margin: 0 0 10px 20px | |
51 | ||
52 | .indic-right | |
53 | float: right | |
54 | margin: 0 20px 10px 0 | |
55 | ||
1d184b4c BA |
56 | .connected |
57 | background-color: green | |
58 | ||
59 | .disconnected | |
60 | background-color: red | |
61 | ||
3ed62725 BA |
62 | .expert-switch |
63 | padding: 5px 10px | |
64 | ||
65 | .expert-mode, button.expert-mode:hover | |
66 | background-color: #ffcc99 | |
67 | ||
bdb1f12d BA |
68 | .white-turn |
69 | background-color: white | |
70 | ||
71 | .black-turn | |
72 | background-color: black | |
73 | ||
1d184b4c BA |
74 | // TODO: div.board, board9, board10, board11, board12 |
75 | div.board | |
76 | float: left | |
77 | width: 12.5% | |
78 | height: 0 | |
79 | padding-bottom: 12.5% | |
80 | display: inline-block | |
81 | position: relative | |
82 | ||
bdb1f12d BA |
83 | .game |
84 | clear: both | |
85 | ||
3066bb47 BA |
86 | .game .board |
87 | cursor: pointer | |
88 | ||
1d184b4c BA |
89 | #choices |
90 | margin-bottom: 10px | |
91 | ||
92 | #choices | |
93 | margin: 0 auto 0 auto | |
94 | position: relative | |
95 | z-index: 300 | |
96 | overflow-y: inherit | |
97 | background-color: rgba(0,0,0,0) //transparent | |
98 | ||
99 | #choices img | |
100 | cursor: pointer | |
101 | background-color: #e6ee9c | |
102 | ||
103 | #choices img:hover | |
104 | background-color: skyblue | |
105 | ||
106 | img.choice-piece | |
107 | height: 0 | |
108 | width: 90% | |
109 | padding: 5% | |
110 | height: 90% | |
111 | ||
112 | img.piece, img.mark-square, img.choice-piece | |
113 | max-width: 100% | |
114 | height: auto | |
115 | display: block | |
116 | ||
117 | img.mark-square | |
118 | opacity: 0.6 | |
119 | ||
120 | img.ghost | |
121 | position: absolute | |
122 | opacity: 0.4 | |
123 | top: 0 | |
124 | ||
125 | img.piece | |
126 | width: 100% | |
127 | ||
128 | img.mark-square | |
129 | width: 76% | |
130 | position: absolute | |
131 | top: 12% | |
132 | left: 12% | |
133 | opacity: .7 | |
134 | ||
135 | figure.diagram-container > figcaption | |
136 | display: block | |
137 | clear: both | |
138 | padding-top: 5px | |
139 | ||
140 | .light-square | |
141 | background-color: #f0d9b5 | |
142 | .dark-square | |
143 | background-color: #b58863 | |
144 | ||
145 | .highlight | |
e64a4eff BA |
146 | background-color: #00cc66 |
147 | ||
148 | .incheck | |
149 | background-color: #cc3300 | |
1d184b4c BA |
150 | |
151 | .light-square-diag | |
152 | background-color: #e5e5ca | |
153 | .dark-square-diag | |
154 | background-color: #6f8f57 | |
155 | ||
156 | p.boxed | |
157 | background-color: #FFCC66 | |
158 | padding: 5px | |
159 | ||
160 | .stageDelimiter | |
161 | color: purple | |
162 | ||
163 | // To show (new) pieces, and/or there values... | |
164 | figure.showPieces > img | |
165 | width: 50px | |
166 | ||
167 | figure.showPieces > figcaption | |
168 | color: #6C6C6C | |
169 | ||
170 | figure.diagram-container | |
171 | margin: 15px 0 15px 0 | |
172 | text-align: center | |
173 | width: 100% | |
174 | display: block | |
175 | ||
176 | .section-title | |
177 | padding: 0 | |
178 | ||
179 | .section-title > h4 | |
180 | padding: 5px | |
181 | ||
182 | .section-content | |
183 | padding: 5px | |
184 | ||
185 | ol, ul:not(.browser-default) | |
186 | padding-left: 20px | |
187 | ||
188 | ul:not(.browser-default) | |
189 | margin-top: 5px | |
190 | ||
191 | ul:not(.browser-default) > li | |
192 | list-style-type: disc | |
193 | ||
194 | .rulesTitle | |
195 | font-weight: bold | |
196 | cursor: pointer | |
197 | padding: 3px; | |
198 | background-color: lightgrey |