forked from s444413/Padel-Tournaments-System
187 lines
5.2 KiB
HTML
187 lines
5.2 KiB
HTML
<html>
|
|
|
|
<head>
|
|
<title>Todo App</title>
|
|
<link href='https://fonts.googleapis.com/css?family=Lato:300,400,700' rel='stylesheet' type='text/css'>
|
|
<link rel="stylesheet" href="style.css" type="text/css" media="screen" charset="utf-8">
|
|
</head>
|
|
|
|
<body>
|
|
<header>
|
|
<p> Padel</p>
|
|
<a href="#">Wiadomości</a>
|
|
<a href="#">Kalendarz turniejów</a>
|
|
<a href="#">Ranking</a>
|
|
<a href="#">Wyniki</a>
|
|
<a href="#">Kontakt</a>
|
|
<span class="dot">JM</span>
|
|
</header>
|
|
<div class="container">
|
|
<div class="tournametns_add">
|
|
<style scoped>
|
|
ul {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
li * {
|
|
float: left;
|
|
}
|
|
|
|
li,
|
|
h3 {
|
|
clear: both;
|
|
list-style: none;
|
|
}
|
|
|
|
input,
|
|
button {
|
|
outline: none;
|
|
}
|
|
|
|
button.edit {
|
|
padding: 10;
|
|
}
|
|
|
|
button.delete {
|
|
padding: 10;
|
|
}
|
|
|
|
button {
|
|
background: none;
|
|
border: 0px;
|
|
color: #888;
|
|
font-size: 15px;
|
|
width: 60px;
|
|
font-family: Lato, sans-serif;
|
|
cursor: pointer;
|
|
}
|
|
|
|
button:hover {
|
|
color: #333;
|
|
}
|
|
|
|
h3,
|
|
label[for='new-task'] {
|
|
color: gray;
|
|
font-weight: 700;
|
|
font-size: 15px;
|
|
border-bottom: 2px solid #333;
|
|
padding: 30px 0 10px;
|
|
margin: 0;
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
input[type="text"] {
|
|
margin: 0;
|
|
font-size: 18px;
|
|
line-height: 18px;
|
|
height: 18px;
|
|
padding: 10px;
|
|
border: 1px solid #ddd;
|
|
background: #fff;
|
|
border-radius: 6px;
|
|
font-family: Lato, sans-serif;
|
|
color: #888;
|
|
}
|
|
|
|
input[type="text"]:focus {
|
|
color: #333;
|
|
}
|
|
|
|
/* Nowy turniej */
|
|
label[for='new-task'] {
|
|
display: block;
|
|
margin: 0 0 20px;
|
|
}
|
|
|
|
input#new-task {
|
|
float: left;
|
|
width: 318px;
|
|
}
|
|
|
|
p>button:hover {
|
|
color: #0FC57C;
|
|
}
|
|
|
|
/*lista turniejów*/
|
|
li {
|
|
overflow: hidden;
|
|
padding: 20px 0;
|
|
border-bottom: 1px solid lightblue;
|
|
}
|
|
|
|
li>input[type="checkbox"] {
|
|
margin: 0 10px;
|
|
position: relative;
|
|
top: 15px;
|
|
}
|
|
|
|
li>label {
|
|
font-size: 18px;
|
|
line-height: 40px;
|
|
width: 237px;
|
|
padding: 0 0 0 11px;
|
|
}
|
|
|
|
li>input[type="text"] {
|
|
width: 226px;
|
|
}
|
|
|
|
li>.delete:hover {
|
|
color: #CF2323;
|
|
}
|
|
|
|
ul li input[type=text] {
|
|
display: none;
|
|
}
|
|
|
|
ul li.editMode input[type=text] {
|
|
display: block;
|
|
}
|
|
|
|
ul li.editMode label {
|
|
display: none;
|
|
}
|
|
</style>
|
|
<p>
|
|
<label for="new-task">Dodawanie turnieju</label>
|
|
<input id="new-task" type="text">
|
|
<button>Dodaj</button>
|
|
</p>
|
|
|
|
<h3>Turnieje</h3>
|
|
<ul id="incomplete-tasks">
|
|
<li>
|
|
<input type="checkbox">
|
|
<label>Turniej w Rzeszowie</label>
|
|
<input type="text">
|
|
<button class="edit">Edytuj</button>
|
|
<button class="delete">Usuń</button>
|
|
</li>
|
|
<li class="editMode">
|
|
<input type="checkbox">
|
|
<label>Turniej w Łodzi</label>
|
|
<input type="text" value="Turniej w">
|
|
<button class="edit">Edytuj</button>
|
|
<button class="delete">Usuń</button>
|
|
</li>
|
|
</ul>
|
|
|
|
<h3>Rankingowe</h3>
|
|
<ul id="completed-tasks">
|
|
<li>
|
|
<input type="checkbox" checked="">
|
|
<label>Turniej w Warszawie</label>
|
|
<input type="text">
|
|
<button class="edit">Edycja</button>
|
|
<button class="delete">Usuń</button>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
|
|
<script type="text/javascript" src="myscript.js"></script>
|
|
|
|
</html> |