diff --git a/game.php b/game.php index 83ee949..19e5529 100644 --- a/game.php +++ b/game.php @@ -26,16 +26,6 @@ <tr> <?php for ($column = 0; $column < 9; $column++) { - switch($row%3) { - case 0: $classRegionRow = "regionTop"; break; - case 1: $classRegionRow = "regionMiddle"; break; - case 2: $classRegionRow = "regionBottom"; break; - } - switch($column%3) { - case 0: $classRegionColumn = "regionLeft"; break; - case 1: $classRegionColumn = "regionCenter"; break; - case 2: $classRegionColumn = "regionRight"; break; - } $value = $gridStr[9*$row+$column]; if ($value == "?") { $value = ""; @@ -43,7 +33,7 @@ } else { $disabled = " disabled"; } - echo " <td class='$classRegionRow $classRegionColumn'><input type='text' inputmode='numeric' minlength=0 maxlength=1 value='$value'$disabled/></td>\n"; + echo " <td><input type='text' inputmode='numeric' minlength=0 maxlength=1 value='$value'$disabled/></td>\n"; } ?> </tr> diff --git a/style.css b/style.css index 237a1c2..95a1c47 100644 --- a/style.css +++ b/style.css @@ -16,83 +16,69 @@ div { table { border-spacing: 0; + border: 1px solid black; + border-radius: 6px; } td, tr { padding: 0; } -table tr:first-child td:first-child { - border-top-left-radius: 6px; +tr:first-child td:first-child { + border-top-left-radius: 5px; } -table tr:first-child td:first-child > input { +tr:first-child td:first-child input { border-top-left-radius: 4px; } -table tr:first-child td { - border-top: 2px solid black; +tr:first-child td:last-child { + border-top-right-radius: 5px; } -table tr:first-child td:last-child { - border-top-right-radius: 6px; -} - -table tr:first-child td:last-child > input { +tr:first-child td:last-child input { border-top-right-radius: 4px; } -table tr td:first-child { - border-left: 2px solid black; +tr:last-child td:first-child { + border-bottom-left-radius: 5px; } -table tr td:last-child { - border-right: 2px solid black; -} - -table tr:last-child td:first-child { - border-bottom-left-radius: 6px; -} - -table tr:last-child td:first-child > input { +tr:last-child td:first-child > input { border-bottom-left-radius: 4px; } -table tr:last-child td { - border-bottom: 2px solid black; +tr:last-child td:last-child { + border-bottom-right-radius: 5px; } -table tr:last-child td:last-child { - border-bottom-right-radius: 6px; -} - -table tr:last-child td:last-child > input { +tr:last-child td:last-child input { border-bottom-right-radius: 4px; } -.regionTop { +tr:nth-child(3n+1) td { border-top: 1px solid black; } -.regionMiddle { +tr:nth-child(3n+2) td { border-top: 1px solid grey; border-bottom: 1px solid grey; } -.regionBottom { +tr:nth-child(3n) td { border-bottom: 1px solid black; } -.regionLeft { +td:nth-child(3n+1) { border-left: 1px solid black; } -.regionCenter { +td:nth-child(3n+2) { border-left: 1px solid grey; border-right: 1px solid grey; } -.regionRight { +td:nth-child(3n+3) { border-right: 1px solid black; }