mramine364

sudoku-index.html

Aug 30th, 2016
94
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 3.62 KB | None | 0 0
  1. <html>
  2. <head>
  3.     <meta charset="UTF-8">
  4.     <title>Sudoku</title>
  5. </head>
  6. <style>
  7.     table#sudoku{
  8.         border-collapse: collapse;
  9.     }
  10.     .col{
  11.         height: 32px;
  12.         width: 32px;
  13.         border: 1px black solid;
  14.         padding: 0;
  15.         text-align: center;
  16.         font-size: 22px;
  17.         font-family: times,"times new roman",serif;
  18.     }
  19.     .col:nth-child(3n+1){
  20.         border-left-width: 2px;
  21.         border-left-color: #0f0f82;
  22.     }
  23.     .col:last-child{
  24.         border-right-width: 2px;
  25.         border-right-color: #0f0f82;
  26.     }
  27.     .row:nth-child(3n+1) > .col{
  28.         border-top-width: 2px;
  29.         border-top-color: #0f0f82;
  30.     }
  31.     .row:last-child > .col{
  32.         border-bottom-width: 2px;
  33.         border-bottom-color: #0f0f82;
  34.     }
  35.     .inp{
  36.         color: #3263bf;
  37.         padding: 0;
  38.         margin: 0;
  39.         width: inherit;
  40.         height: inherit;
  41.         border: 0;
  42.         text-align: center;
  43.         font-size: 22px;
  44.         font-family: times,"times new roman",serif;
  45.     }
  46.     #note{
  47.         margin: 12px 0 12px 0;
  48.         height: 20px;      
  49.         font-weight: bold;
  50.         font-size: 13pt;
  51.     }
  52.     .not-ok-note{
  53.         color: #ce1e1e;
  54.     }
  55.     .ok-note{
  56.         color: #10238c;
  57.     }
  58. </style>
  59. <body>
  60.     <button id="generate">Generate</button>
  61.     <button id="check">Check solution</button>
  62.     <button id="clear">Clear</button>
  63.    
  64.     <p id="note"></p>
  65.    
  66.     <table id="sudoku">
  67.         <tr class="row">
  68.             <td class="col"></td>
  69.             <td class="col"></td>
  70.             <td class="col"></td>
  71.             <td class="col"></td>
  72.             <td class="col"></td>
  73.             <td class="col"></td>
  74.             <td class="col"></td>
  75.             <td class="col"></td>
  76.             <td class="col"></td>
  77.         </tr>
  78.         <tr class="row">
  79.             <td class="col"></td>
  80.             <td class="col"></td>
  81.             <td class="col"></td>
  82.             <td class="col"></td>
  83.             <td class="col"></td>
  84.             <td class="col"></td>
  85.             <td class="col"></td>
  86.             <td class="col"></td>
  87.             <td class="col"></td>
  88.         </tr>
  89.         <tr class="row">
  90.             <td class="col"></td>
  91.             <td class="col"></td>
  92.             <td class="col"></td>
  93.             <td class="col"></td>
  94.             <td class="col"></td>
  95.             <td class="col"></td>
  96.             <td class="col"></td>
  97.             <td class="col"></td>
  98.             <td class="col"></td>
  99.         </tr>
  100.         <tr class="row">
  101.             <td class="col"></td>
  102.             <td class="col"></td>
  103.             <td class="col"></td>
  104.             <td class="col"></td>
  105.             <td class="col"></td>
  106.             <td class="col"></td>
  107.             <td class="col"></td>
  108.             <td class="col"></td>
  109.             <td class="col"></td>
  110.         </tr>
  111.         <tr class="row">
  112.             <td class="col"></td>
  113.             <td class="col"></td>
  114.             <td class="col"></td>
  115.             <td class="col"></td>
  116.             <td class="col"></td>
  117.             <td class="col"></td>
  118.             <td class="col"></td>
  119.             <td class="col"></td>
  120.             <td class="col"></td>
  121.         </tr>
  122.         <tr class="row">
  123.             <td class="col"></td>
  124.             <td class="col"></td>
  125.             <td class="col"></td>
  126.             <td class="col"></td>
  127.             <td class="col"></td>
  128.             <td class="col"></td>
  129.             <td class="col"></td>
  130.             <td class="col"></td>
  131.             <td class="col"></td>
  132.         </tr>
  133.         <tr class="row">
  134.             <td class="col"></td>
  135.             <td class="col"></td>
  136.             <td class="col"></td>
  137.             <td class="col"></td>
  138.             <td class="col"></td>
  139.             <td class="col"></td>
  140.             <td class="col"></td>
  141.             <td class="col"></td>
  142.             <td class="col"></td>
  143.         </tr>
  144.         <tr class="row">
  145.             <td class="col"></td>
  146.             <td class="col"></td>
  147.             <td class="col"></td>
  148.             <td class="col"></td>
  149.             <td class="col"></td>
  150.             <td class="col"></td>
  151.             <td class="col"></td>
  152.             <td class="col"></td>
  153.             <td class="col"></td>
  154.         </tr>
  155.         <tr class="row">
  156.             <td class="col"></td>
  157.             <td class="col"></td>
  158.             <td class="col"></td>
  159.             <td class="col"></td>
  160.             <td class="col"></td>
  161.             <td class="col"></td>
  162.             <td class="col"></td>
  163.             <td class="col"></td>
  164.             <td class="col"></td>
  165.         </tr>
  166.     </table>
  167.     <script src="sudoku-app.js"></script>
  168. </body>
  169. </html>
Add Comment
Please, Sign In to add comment