body {
font-family: Ubuntu, Verdana, sans-serif;
- margin: 0;
- width: 800px;
margin: 0 auto;
+ width: 800px;
font-size: 1.1rem;
}
color: #f1f1f1;
}
+img.logo {
+ width: 200px;
+ position: fixed;
+ display: block;
+ left: 0;
+ overflow-x: hidden;
+ padding: 20px 0 0 0;
+ margin: 0;
+ top: 350px;
+ z-index: 10;
+}
+
+.hide {
+ display: none;
+}
+
+.clear {
+ clear: both;
+ overflow: auto;
+}
+
.main {
margin-left: 200px; /* Same as the width of the sidenav */
padding: 0px 10px;
font-size: 20px;
padding: 10px 20px 10px 20px;
text-decoration: none;
+ cursor: pointer;
}
.btn:hover {
text-decoration: none;
}
+button.block {
+ display: block;
+ margin: 25px auto;
+}
+
table th {
font-weight: bold;
}
+.left, .right {
+ float: left;
+ width: 50%;
+}
+
+.button-container-horizontal, .button-container-vertical {
+ margin: 15px 0;
+ text-align: center;
+}
+.button-container-vertical {
+ float: left;
+}
+/* All children except first: margin: 30px */
+.button-container-horizontal .btn:not(:first-child) {
+ margin-left: 30px;
+}
+.button-container-vertical .btn {
+ display: block;
+ margin-left: 30px;
+}
+.button-container-vertical .btn:not(:first-child) {
+ margin-top: 30px;
+}
+
+button.validate {
+ background-image: linear-gradient(to bottom, #6fa162, #40992e);
+}
+button.validate:hover {
+ background-image: linear-gradient(to bottom, #37cc4e, #40c24f);
+}
+button.cancel {
+ background-image: linear-gradient(to bottom, #d93470, #b82b47);
+}
+button.cancel:hover {
+ background-image: linear-gradient(to bottom, #fc433c, #d93434);
+}
+
/* players div */
#players {
overflow: auto;
+ margin-bottom: 15px;
}
#players p {
text-align: center;
}
-#active, #inactive {
- float: left;
- width: 50%;
-}
-
#inactive table {
opacity: 0.6;
}
background-color: lightyellow;
}
-/* ranking div */
-
-table.ranking {
- border-collapse: collapse;
- width: 500px;
- margin: 0 auto;
- font-size: 1.1rem;
-}
-
-table.ranking td
-{
- border: 1px solid #ddd;
- padding: 10px;
-}
-table.ranking th {
- padding: 1em 10px;
- text-align: left;
-}
-
-table.ranking tr:not(.title) {
- background-color: #aaa;
-}
-table.ranking tr:not(.title):nth-child(even){
- background-color: #ccc;
-}
-table.ranking tr:not(.title):hover, table.ranking tr:not(.title):nth-child(even):hover {
- background-color: lightyellow;
-}
-
-table.ranking th.scoring {
- cursor: pointer;
-}
-
-.active {
- background-color: yellow;
-}
-
/* pairings div */
-button.block {
- display: block;
- margin: 30px auto;
+.warning {
+ color: red;
+ margin-top: 25px;
}
-.button-container {
- margin-top: 30px;
- text-align: center;
+span.link {
+ color: darkblue;
+ cursor: pointer;
}
-button.cancel {
- margin-left: 30px;
- background-image: linear-gradient(to bottom, #d93470, #b82b47);
-}
-button.cancel:hover {
- background-image: linear-gradient(to bottom, #fc433c, #d93434);
+.toto {
+ color: darkgrey;
}
.scored {
.unpaired {
cursor: default;
}
-.scored {
- cursor: default;
-}
.pairing > table {
font-size: 1.1rem;
#scoreInput table th {
padding-bottom: 10px;
}
+
+/* Timer (dimensions given in javascript) */
+
+#timer {
+ position: absolute;
+ z-index: 100;
+ left: 0;
+ top: 0;
+ background-color: white;
+ cursor: pointer;
+ text-align: center;
+}
+
+.timeout {
+ color: darkred;
+}
+
+#timer input {
+ color: darkblue;
+ position: absolute;
+ display: block;
+ left: 0;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ text-align: center;
+}
+
+img.close-cross {
+ display: block;
+ position: absolute;
+ top: 0;
+ right: 0;
+ width: 30px;
+}
+
+/* ranking div */
+
+#ranking {
+ margin-bottom: 15px;
+ overflow: auto;
+}
+
+table.ranking {
+ border-collapse: collapse;
+ width: 500px;
+ margin: 0 auto;
+ font-size: 1.1rem;
+ display: block;
+ float: left;
+}
+
+table.ranking td
+{
+ border: 1px solid #ddd;
+ padding: 10px;
+}
+table.ranking th {
+ padding: 1em 10px;
+ text-align: left;
+}
+
+table.ranking tr:not(.title) {
+ background-color: #aaa;
+}
+table.ranking tr:not(.title):nth-child(even){
+ background-color: #ccc;
+}
+table.ranking tr:not(.title):hover, table.ranking tr:not(.title):nth-child(even):hover {
+ background-color: lightyellow;
+}