pascal.lafourcade
/
swish
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

formes site

Browse Source
Golfier
frperalde 4 years ago
parent 5543757c8d
commit c1453b3412
2 changed files with 162 additions and 0 deletions
Show Stats Download Patch File Download Diff File

80
SwichGIT/Doc/Etudes formes/index.html
Unescape View File

@ -0,0 +1,80 @@
<!DOCTYPE html>
<html>
<head lang="fr">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>SwishGame</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<!-- Forme : rond-->
<div class="containform">
<div class="anneau">
<div class="rondinterieur inté"></div>
</div>
</div>
<div class="containform">
<div class="rond"></div>
</div>
<div class="containform2">
<div class="rond2"></div>
</div>
<div class="containform">
<div class="rond"></div>
</div>
<div class="containform2">
<div class="anneau2"></div>
</div>
<!--
<div class="containform">
<div class="carre">
<div class="carreinterieur inté"></div>
</div>
</div>
<div class="containform">
<div class="pcarre"></div>
</div>
<div class="containform">
<div class="triangle">
<div class="trianglerinterieur"></div>
</div>
</div>
<div class="containform">
<div class="ptriangle"></div>
</div>
<div class="containform">
<div class="triangletrapezeinte"></div>
<div class="trapezeinte"></div>
<div class="triangletrapeze"></div>
<div class="trapeze"></div>
</div>
<div class="containform">
<div class="triangletrapezep"></div>
<div class="trapezep"></div>
</div>
<div class="containform">
<div class="losangephaut"></div>
<div class="losangepbas"></div>
<div class="losangephauti"></div>
<div class="losangepbasi"></div>
</div>
<div class="containform">
<div class="losangephautc"></div>
<div class="losangepbasc"></div>
-->
</body>
</html>

82
SwichGIT/Doc/Etudes formes/style.css
Unescape View File

@ -0,0 +1,82 @@
:root{
--x : 6vw;
--d : calc(var(--x)/2);
--e : calc(var(--x)/4);
}
.containform {
height: var(--x);
width: var(--x);
display: table-cell;
vertical-align: middle;
}
.anneau {
background-color: #FFD100;
border-radius: var(--x);
height: var(--x);
width: var(--x);
display: table-cell;
vertical-align: middle;
}
.anneau2 {
background-color: white;
border-radius: var(--x);
height: var(--x);
width: var(--x);
display: table-cell;
vertical-align: middle;
}
.rondinterieur {
background-color: white;
height: var(--d);
width: var(--d);
display: table;
margin: 0 auto;
border-radius: var(--d);
}
.rond {
display: table;
margin: 0 auto;
background-color: #FFD100;
height: var(--d);
width: var(--d);
border-radius: var(--d);
}
.containform2{
height: var(--x);
width: var(--x);
display: table-cell;
vertical-align: middle;
background-color: #FFD100;
}
.rond2 {
display: table;
margin: 0 auto;
background-color: white;
height: var(--d);
width: var(--d);
border-radius: var(--d);
}
Write Preview
Loading…
Cancel
Save