[Whiteboard] Cosmetic changes on homepage and update logo

parent f3e6e60a
*{
margin: 0;
box-sizing: border-box;
font-family: sans-serif;
font-family: 'Lato', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
body{
......@@ -10,17 +10,22 @@ body{
}
header{
background-color: #1A7A5A;
background-color: #1B7A5A;
padding: 5px;
padding-top: 10px;
text-align: center;
}
header h1{
display: inline;
.logo{
display: block;
margin-top: 1em;
margin-left: auto;
margin-right: auto;
width: 8em;
}
header img{
height: 2em;
width: auto;
header h1{
display: inline;
}
.warning{
......@@ -31,13 +36,15 @@ header img{
padding: 10px;
color: #FF0000;
border-radius: 10px;
width: 70%;
width: 40%;
border: solid red 1px;
text-align: center;
}
.createForm{
width: 90%;
display: block;
margin: auto;
width: 40%;
text-align: center;
}
......@@ -50,18 +57,26 @@ input[type="text"]{
margin: 5px;
border: none;
border-radius: 5px;
width: 80%;
width: 100%;
height: 3em;
}
.randomName, input[type="submit"]{
display: inline-block;
width: 40%;
margin-right: 5%;
margin-left: 5%;
.create {
display: flex;
width: 100%
}
.child {
flex: 50%;
padding-right: 10px;
}
#randomName, input[type="submit"]{
padding: 20px;
margin: 20px;
color: white;
background-color: #00AFEF;
padding: 20px;
width: 100%;
border: none;
border-radius: 10px;
transition: 0.5s;
......@@ -72,8 +87,9 @@ input[type="submit"]:hover, .randomName:hover{
background-color: #00BFFF;
}
h2{
h1{
padding: 20px;
text-align: center;
padding-left: 40px;
}
......@@ -82,16 +98,6 @@ a{
text-decoration: none;
}
.helpLink a{
display: inline-block;
padding: 5px;
font-weight: bold;
background-color: #00AFEF;
border-radius: 5px;
transition: 0.5s;
margin: 5px;
}
.helpLink a:hover{
background-color: #00BFFF;
}
......@@ -110,7 +116,12 @@ p{
margin: auto;
}
footer a{
#footer {
text-align: center;
}
#footer a {
color: #C0C0C0;
text-decoration: underline;
margin: 0 10px;
}
......@@ -6,35 +6,40 @@
</head>
<body>
<header>
<img src="picasoft.svg" alt="Logo de Picasoft" />
<h1>Whiteboard de Picasoft</h1>
<link rel="stylesheet" type="text/css" href="default.css" />
</header>
<img class="logo" src="picasoft-logo-whiteboard.png" alt="Logo de Picasoft" />
<div class="warning">
<p>
Attention, le contenu des tableaux est réinitialisé chaque nuit (à minuit) !
</p>
</div>
<h2>Créer un tableau</h2>
<h1>Créer un tableau</h1>
<div class="createForm">
<form action="https://board.picasoft.net/app/" method="GET">
<label for="name">Nom du tableau : </label><br />
<label for="name">Nom du tableau</label><br />
<input type="text" id="id" name="whiteboardid" /><br />
<label for="username">Nom d'utilisateur (optionnel) : </label><br />
<label for="username"><i>Nom d'utilisateur (optionnel)</i></label><br />
<input type="text" id="username" name="username" /><br />
<input type="submit" /><!--
--><p class="randomName">
<a href="https://board.picasoft.net/app/?randomid=true">Au hasard !</a>
</p>
<div class="create">
<div class="child">
<input type="submit" />
</div class="child">
<div class="child" id="randomName">
<a href="https://board.picasoft.net/app/?randomid=true">Au hasard !</a>
</div>
</div>
</form>
</div>
<p class="helpLink">
<a href="#help">Montrer l'aide</a>
<p id="footer">
<a href="#help">Montrer l'aide</a>
<a class="child" href="https://picasoft.net/co/cgu.html">CGU</a>
</p>
<div id="help">
<h2>Quelques raccourcis usuels</h2>
<table>
......@@ -276,11 +281,5 @@
</tbody>
</table>
</div>
<footer>
<p>
<a href="https://picasoft.net/co/cgu.html">CGU</a>
</p>
</footer>
</body>
</html>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment