more board

This commit is contained in:
Alexander Munch-Hansen 2018-05-18 17:53:57 +02:00
parent 82b3835d28
commit 073041dfde
2 changed files with 45 additions and 61 deletions

28
func.js
View File

@ -1,16 +1,36 @@
$(function () { $(function () {
var red = "#E83D04"
var white = "#E8E077"
var brown = "#4C2E00"
color = red;
// Build pins // Build pins
for (var i = 1; i < 25; i++) {
if (i < 13) {
for (var i = 0; i < 26; i++) {
if (i < 13 && 0 < i) {
var pos = 'bottom'; var pos = 'bottom';
} else { } else if (i > 12 && i < 25) {
var pos = 'top'; var pos = 'top';
} else {
var pos = 'bar';
} }
var div = $("<div />").addClass("pin").addClass("pin-"+pos).attr('id', 'pin-'+i);
if (i == 0 || i == 25) {
color = brown;
} else if (color == red) {
color = white;
} else {
color = red;
}
var div = $("<div style='background-color:"+color+"'/>").addClass("pin").addClass("pin-"+pos).attr('id', 'pin-'+i);
var checkers_div = $("<div />").addClass("checkers").attr('id', 'checkers-'+i); var checkers_div = $("<div />").addClass("checkers").attr('id', 'checkers-'+i);
var checkers_list = $("<ul />").addClass("checkers_list").attr('id', 'checkers_list-'+i); var checkers_list = $("<ul />").addClass("checkers_list").attr('id', 'checkers_list-'+i);

View File

@ -28,146 +28,110 @@ body {
padding-top:50px; padding-top:50px;
} }
#pin-0 {
grid-column-start = 7;
grid-row-start = 1;
}
#pin-25 {
grid-column-start = 7;
grid-row-start = 2;
}
#pin-1 { #pin-1 {
grid-column-start: 12; grid-column-start: 13;
grid-row-start: 2; grid-row-start: 2;
grid-row-end: 3;
} }
#pin-2 { #pin-2 {
grid-column-start: 11; grid-column-start: 12;
grid-row-start: 2; grid-row-start: 2;
grid-row-end: 3;
} }
#pin-3 { #pin-3 {
grid-column-start: 10; grid-column-start: 11;
grid-row-start: 2; grid-row-start: 2;
grid-row-end: 3;
} }
#pin-4 { #pin-4 {
grid-column-start: 9; grid-column-start: 10;
grid-row-start: 2; grid-row-start: 2;
grid-row-end: 3;
} }
#pin-5 { #pin-5 {
grid-column-start: 8; grid-column-start: 9;
grid-row-start: 2; grid-row-start: 2;
grid-row-end: 3;
} }
#pin-6 { #pin-6 {
grid-column-start: 7; grid-column-start: 8;
grid-row-start: 2; grid-row-start: 2;
grid-row-end: 3;
} }
#pin-7 { #pin-7 {
grid-column-start: 6; grid-column-start: 6;
grid-row-start: 2; grid-row-start: 2;
grid-row-end: 3;
} }
#pin-8 { #pin-8 {
grid-column-start: 5; grid-column-start: 5;
grid-row-start: 2; grid-row-start: 2;
grid-row-end: 3;
} }
#pin-9 { #pin-9 {
grid-column-start: 4; grid-column-start: 4;
grid-row-start: 2; grid-row-start: 2;
grid-row-end: 3;
} }
#pin-10 { #pin-10 {
grid-column-start: 3; grid-column-start: 3;
grid-row-start: 2; grid-row-start: 2;
grid-row-end: 3;
} }
#pin-11 { #pin-11 {
grid-column-start: 2; grid-column-start: 2;
grid-row-start: 2; grid-row-start: 2;
grid-row-end: 3;
} }
#pin-12 { #pin-12 {
grid-column-start: 1; grid-column-start: 1;
grid-row-start: 2; grid-row-start: 2;
grid-row-end: 3;
} }
#pin-13 { #pin-13 {
grid-column-start: 1; grid-column-start: 1;
grid-row-start: 1; grid-row-start: 1;
grid-row-end: 2;
} }
#pin-14 { #pin-14 {
grid-column-start: 2; grid-column-start: 2;
grid-row-start: 1; grid-row-start: 1;
grid-row-end: 2;
} }
#pin-15 { #pin-15 {
grid-column-start: 3; grid-column-start: 3;
grid-row-start: 1; grid-row-start: 1;
grid-row-end: 2;
} }
#pin-16 { #pin-16 {
grid-column-start: 4; grid-column-start: 4;
grid-row-start: 1; grid-row-start: 1;
grid-row-end: 2;
} }
#pin-17 { #pin-17 {
grid-column-start: 5; grid-column-start: 5;
grid-row-start: 1; grid-row-start: 1;
grid-row-end: 2;
} }
#pin-18 { #pin-18 {
grid-column-start: 6; grid-column-start: 6;
grid-row-start: 1; grid-row-start: 1;
grid-row-end: 2;
} }
#pin-19 { #pin-19 {
grid-column-start: 7; grid-column-start: 8;
grid-row-start: 1; grid-row-start: 1;
grid-row-end: 2;
} }
#pin-20 { #pin-20 {
grid-column-start: 8; grid-column-start: 9;
grid-row-start: 1; grid-row-start: 1;
grid-row-end: 2;
} }
#pin-21 { #pin-21 {
grid-column-start: 9; grid-column-start: 10;
grid-row-start: 1; grid-row-start: 1;
grid-row-end: 2;
} }
#pin-22 { #pin-22 {
grid-column-start: 10; grid-column-start: 11;
grid-row-start: 1; grid-row-start: 1;
grid-row-end: 2;
} }
#pin-23 { #pin-23 {
grid-column-start: 11; grid-column-start: 12;
grid-row-start: 1; grid-row-start: 1;
grid-row-end: 2;
} }
#pin-24 { #pin-24 {
grid-column-start: 12; grid-column-start: 13;
grid-row-start: 1; grid-row-start: 1;
grid-row-end: 2;
} }