Add some TODOs, some refactoring, first test for a future hexagonal board with canvas
[vchess.git] / public / stylesheets / index.sass
CommitLineData
9a3c9f79
BA
1#header
2 width: 100%
d5973790 3 background: linear-gradient(#e66465, #9198e5)
9a3c9f79
BA
4 height: 77px
5 @media screen and (max-width: 767px)
6 height: 43px
7
8.info-container
9 display: inline-block
10 vertical-align: top
11 padding: 0
12 box-sizing: border-box
13 p
14 display: inline-block
15 padding: 3px
16 border: 1px solid black;
17 margin: 27px 15px 5px 7px
18 @media screen and (max-width: 767px)
19 margin-top: 7px
20
21#mainTitle
22 font-style: italic
23 margin-left: 10px
24 @media screen and (max-width: 767px)
25 margin-left: 5px
26 float: left
d5973790 27 img
9a3c9f79 28 display: inline-block
d5973790 29 height: 30px
d449ae46 30 margin-top: 25px
9a3c9f79 31 @media screen and (max-width: 767px)
d449ae46 32 margin-top: 7px
9a3c9f79
BA
33 p
34 font-weight: bold
35 padding: 0
36 border: none
37 margin-top: 22px
38 font-size: 1.5em
39 @media screen and (max-width: 767px)
40 margin-top: 10px
41 font-size: 1em
42
43#helpMenu
44 float: right
9a3c9f79
BA
45 @media screen and (max-width: 767px)
46 .info-container
47 p
48 margin-right: 5px
d5973790 49
9a3c9f79
BA
50#flagMenu
51 float: right
9a3c9f79
BA
52 margin-right: 10px
53 @media screen and (max-width: 767px)
54 margin-right: 5px
55 img
56 display: inline-block
57 height: 30px
58 padding-top: 27px
59 @media screen and (max-width: 767px)
60 padding-top: 8px
61
62// TODO: box-shadow or box-sizing ? https://stackoverflow.com/a/13517809
3acb852d
BA
63.variant
64 box-sizing: border-box
65 border: 1px solid brown
66 background-color: lightyellow
9a3c9f79
BA
67 &:hover
68 background-color: yellow
3acb852d
BA
69 a
70 color: #663300
9a3c9f79 71 text-decoration: none
3acb852d
BA
72 .boxtitle
73 font-weight: bold
9a3c9f79
BA
74 margin-bottom: 0
75 .description
76 @media screen and (max-width: 767px)
77 margin-top: 0
3acb852d 78
3acb852d 79#readThis
9a3c9f79
BA
80 margin-top: 0
81 color: var(--a-link-color)
92342261 82 text-decoration: underline
92342261 83
3acb852d 84#welcome
9a3c9f79 85 max-width: 767px
3acb852d
BA
86 @media screen and (max-width: 767px)
87 max-width: 100vw
9a3c9f79
BA
88 img
89 width: 75%
90 @media screen and (max-width: 767px)
91 width: 100%
92 max-width: 552px
3acb852d
BA
93 ul
94 list-style-type: none
95 // TODO: bad practice, use table to align things...
96 table.list-table
97 width: 300px
98 margin: 0 auto
ea6bb36e 99 border: 0
3acb852d 100 tbody
ea6bb36e 101 border: 0
3acb852d 102 tr
ea6bb36e 103 border: 0
3acb852d
BA
104 margin: 0
105 padding: 0
106 td
107 padding: 0
108 text-align: left
109 border: 0
110 #disableMsg
3acb852d 111 color: darkred