Skip to content
Snippets Groups Projects
Commit 57c35e4f authored by Maxime Tissot's avatar Maxime Tissot
Browse files

A bit of CSS

parent 534f869c
No related branches found
No related tags found
No related merge requests found
......@@ -3,7 +3,7 @@ package hsrt.VSundSOA.backendapi;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
@SpringBootApplication //startet das backend
@SpringBootApplication
public class GameAPI {
public static void main(String[] args) {
SpringApplication.run(GameAPI.class, args);
......
@charset "UTF-8";
body{
#margin: auto;
background-color: #2C2F33;
colour: blueviolet;
}
h1{
display: block;
text-align: center;
font-size: 400%;
font-family: Arial;
margin: auto;
color: #7289DA;
}
h2{
display: block;
text-align: center;
font-size: 200%;
font-family: 'Roboto', sans-serif;;
margin: auto;
color: #F6F6F6;
}
.button{
display: block;
background-color: #7289DA;
text-align: center;
font-size: 200%;
font-family: "Lucida Console";
width: 200px;
height: 75px;
cursor: pointer;
box-shadow: #23272A;
margin: 5% auto auto;
border-radius: 8px;
color: #23272A;
}
.input{
display: block;
background-color: #23272A;
font-family: "Lucida Console";
width: 400px;
height: 30px;
color:white;
margin: 5% auto auto;
border-radius: 8px;
}
.Game{
display: grid;
grid-template-columns: 90% 10%;
align-content: center;
}
.Sudoku{
width: 700px;
overflow: hidden;
background: #7918f2;
background: -webkit-linear-gradient(-68deg, #ac32e4 , #4801ff);
background: -o-linear-gradient(-68deg, #ac32e4 , #4801ff);
background: -moz-linear-gradient(-68deg, #ac32e4 , #4801ff);
background: linear-gradient(-68deg, #ac32e4 , #4801ff);
border-radius: 16px;
}
.Sudoku td{
font-size: 60px;
font-family: Montserrat-Regular;
text-align: center;
line-height: 70px;
border: 1px solid #999;
}
.Sudoku td:hover{
background-color: rgba(255,255,255,0.2);
}
.NumberPad{
display: grid;
grid-template-columns: 80px;
}
.PadButton{
height: 80px;
font-size: 50px;
}
\ No newline at end of file
......@@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>Sudoku_With_Friends</title>
<link rel="" href=""/>
<link rel="stylesheet" href="Sudoku.css"/>
</head>
<body>
<div id="options">
......@@ -12,11 +12,11 @@
<input type="text" id="username" class="input" placeholder="Username"/>
<button type="button" id="login" class="button" onclick="loginOnClick()">Connect</button>
</div>
<div id="game">
<table id="Sudoku">
<div class="Game" id="game">
<table class="Sudoku" id="Sudoku">
</table>
</div>
<div id="number-pad" style="display: grid; grid-template-columns: 40px 40px 40px">
<div class="NumberPad" id="number-pad">
</div>
</div>
<script src="Sudoku.js"></script>
</body>
......
......@@ -8,6 +8,7 @@ function createEmptySudokuGrid() {
const table = document.getElementById('Sudoku');
for (let row = 0; row < 9; row++) {
const tr = document.createElement('tr');
tr.className = 'row';
table.appendChild(tr)
for (let cell = 0; cell < 9; cell++) {
const td = document.createElement('td');
......@@ -22,6 +23,7 @@ function createNumberPadButtons() {
const div = document.getElementById('number-pad');
for (let i = 1; i <= 9; i++) {
const input = document.createElement('input');
input.className = 'PadButton';
input.id = `number-pad-${i}`;
input.type = 'button';
input.value = i.toString();
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment