le css que j'avais oublié, LOL
This commit is contained in:
parent
ca1f6d0088
commit
6044074f6c
1 changed files with 186 additions and 0 deletions
186
style.css
Normal file
186
style.css
Normal file
|
@ -0,0 +1,186 @@
|
||||||
|
|
||||||
|
/* * { */
|
||||||
|
/* border: 1px solid black; */
|
||||||
|
/* } */
|
||||||
|
|
||||||
|
.highlight {
|
||||||
|
border: 1px solid red;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes spin {
|
||||||
|
from {
|
||||||
|
transform: rotate(0deg);
|
||||||
|
}
|
||||||
|
to {
|
||||||
|
transform: rotate(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes bounce {
|
||||||
|
0% {
|
||||||
|
transform: scale(1);
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
transform: scale(1.2);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
transform: scale(1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.bounce-repeat:hover {
|
||||||
|
animation-name: bounce;
|
||||||
|
animation-duration: 0.3s;
|
||||||
|
animation-iteration-count: infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
#Title {
|
||||||
|
font-family: Arial;
|
||||||
|
font-size: 80px;
|
||||||
|
color:red;
|
||||||
|
}
|
||||||
|
|
||||||
|
#denonciation > h3 {
|
||||||
|
color: red;
|
||||||
|
}
|
||||||
|
|
||||||
|
#denonciation {
|
||||||
|
padding-bottom: 100px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.to-middle {
|
||||||
|
display:table;
|
||||||
|
margin-left:auto;
|
||||||
|
margin-right:auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fun:hover {
|
||||||
|
background-color: green;
|
||||||
|
animation-name: spin;
|
||||||
|
animation-duration: 2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.be-big {
|
||||||
|
line-height: 100px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#logo {
|
||||||
|
width:300px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#logo:hover {
|
||||||
|
width:400px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.side-to-side {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 50px;
|
||||||
|
/* padding-left: 50px; */
|
||||||
|
/* padding-right: 50px; */
|
||||||
|
}
|
||||||
|
|
||||||
|
.side-to-side-small {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
strong {
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
|
||||||
|
.right-sidebar {
|
||||||
|
float: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
thead {
|
||||||
|
font-size: 40px;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer {
|
||||||
|
text-align: center;
|
||||||
|
background-color: lightgray;
|
||||||
|
left:0px;
|
||||||
|
width:100vw;
|
||||||
|
position: fixed;
|
||||||
|
bottom:0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#css-image {
|
||||||
|
float: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
#css-image > div {
|
||||||
|
/* background-color:red; */
|
||||||
|
}
|
||||||
|
|
||||||
|
.insideColor {
|
||||||
|
background-color: red;
|
||||||
|
}
|
||||||
|
.half-circle-container {
|
||||||
|
background-color:white;
|
||||||
|
height: 70px;
|
||||||
|
padding:0px;
|
||||||
|
margin:0px;
|
||||||
|
}
|
||||||
|
.half-circle {
|
||||||
|
|
||||||
|
display:inline-block;
|
||||||
|
border-radius: 50px 50px 0px 0px;
|
||||||
|
width: 100px;
|
||||||
|
height: 70px;
|
||||||
|
margin: 0px;
|
||||||
|
padding: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.triangle {
|
||||||
|
width: 0px;
|
||||||
|
height:0px;
|
||||||
|
background-color:transparent;
|
||||||
|
border-left: 100px solid transparent;
|
||||||
|
border-right: 100px solid transparent;
|
||||||
|
border-top: 200px solid red;
|
||||||
|
}
|
||||||
|
|
||||||
|
#y_rotation {
|
||||||
|
z-index: 1;
|
||||||
|
margin-right: auto;
|
||||||
|
margin-left:auto;
|
||||||
|
width: 300px;
|
||||||
|
/* padding-left: 50%; */
|
||||||
|
/* transform: translateX(-50%) translateY(-30px); */
|
||||||
|
/* width: 300px; */
|
||||||
|
}
|
||||||
|
|
||||||
|
.y_slider {
|
||||||
|
position:absolute;
|
||||||
|
/* transform: translateX(50%); */
|
||||||
|
bottom: 20px;
|
||||||
|
transform: translateX(50%);
|
||||||
|
}
|
||||||
|
|
||||||
|
#x_rotation {
|
||||||
|
z-index: 1;
|
||||||
|
width: 300px;
|
||||||
|
/* width: 300px; */
|
||||||
|
}
|
||||||
|
|
||||||
|
.x_slider {
|
||||||
|
position:absolute;
|
||||||
|
transform: rotate(90deg) translateX(-87%);
|
||||||
|
right: -80px;
|
||||||
|
/* margin-top: 50%; */
|
||||||
|
}
|
||||||
|
|
||||||
|
.glCanvas {
|
||||||
|
z-index: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#canvas-container {
|
||||||
|
position: relative;
|
||||||
|
width: auto;
|
||||||
|
height: auto;
|
||||||
|
}
|
Loading…
Reference in a new issue