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