Added base for avocat page
This commit is contained in:
parent
8a2e32d550
commit
e6c72e3c8b
5 changed files with 70 additions and 6 deletions
BIN
assets/saoult_bg_arbre_full.jpg
Normal file
BIN
assets/saoult_bg_arbre_full.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.3 MiB |
|
|
@ -5,13 +5,27 @@
|
|||
<title>Avocat | Saoul Bonmonsieur</title>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||||
<link rel="icon" type="image/x-icon" href="assets/favicon.ico">
|
||||
|
||||
<script src="../lib/anime.min.js"></script>
|
||||
<script src="../js/base.js"></script>
|
||||
<link href="../css/avocat.css" rel="stylesheet">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<Navbar></Navbar>
|
||||
<div class="avocat">
|
||||
<div class="avocat-text">
|
||||
<h1>Saul Bonmonsieur</h1>
|
||||
</div>
|
||||
</div>
|
||||
<div class="block">
|
||||
<div class="parcours-text">
|
||||
<h2>Mon Parcours</h2>
|
||||
<br><br>
|
||||
<p></p>
|
||||
</div>
|
||||
</div>
|
||||
<Footer></Footer>
|
||||
</body>
|
||||
|
||||
|
|
|
|||
20
css/avocat.css
Normal file
20
css/avocat.css
Normal file
|
|
@ -0,0 +1,20 @@
|
|||
.avocat {
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
height: 30rem;
|
||||
display: flex;
|
||||
background-image: url("../assets/saoult_bg_arbre_full.jpg");
|
||||
background-position-y: 50%;
|
||||
background-size: cover;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.avocat-text {
|
||||
flex: 1;
|
||||
width: 100%;
|
||||
padding: 0 0 0 2rem;
|
||||
z-index: 1;
|
||||
font-size: larger;
|
||||
position: relative;
|
||||
top: 40%;
|
||||
}
|
||||
39
css/base.css
39
css/base.css
|
|
@ -1,5 +1,10 @@
|
|||
@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
|
||||
|
||||
@font-face {
|
||||
font-family: 'Comic Sans MS';
|
||||
src: url("comic-sans-ms/comici.ttf");
|
||||
}
|
||||
|
||||
:root {
|
||||
--color-dark: #2D2424;
|
||||
--color-main-light: #A55540;
|
||||
|
|
@ -16,11 +21,13 @@
|
|||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
*:any-link{
|
||||
*:any-link {
|
||||
color: var(--color-light);
|
||||
}
|
||||
|
||||
h1,h2,h3 {
|
||||
h1,
|
||||
h2,
|
||||
h3 {
|
||||
font-family: "Comic Sans MS", "Comic Sans", cursive;
|
||||
}
|
||||
|
||||
|
|
@ -52,14 +59,14 @@ p {
|
|||
transition: all .3s ease 0s;
|
||||
}
|
||||
|
||||
.btn:hover{
|
||||
.btn:hover {
|
||||
transform: translateY(-3px);
|
||||
background-color: var(--color-light);
|
||||
color: var(--color-white);
|
||||
box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
|
||||
}
|
||||
|
||||
.black-bg{
|
||||
.black-bg {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
|
|
@ -68,3 +75,27 @@ p {
|
|||
z-index: 99;
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 700px) {
|
||||
.block {
|
||||
background-color: var(--color-main-light);
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 700px) {
|
||||
.block {
|
||||
background-color: var(--color-main-light);
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
|
||||
position: relative;
|
||||
flex-direction: column;
|
||||
overflow: clip;
|
||||
}
|
||||
}
|
||||
|
|
@ -42,8 +42,7 @@
|
|||
les cours
|
||||
de M. Timètres en SVT au lycée Raymond Naves.
|
||||
<br><br>J’intérviens à Toulouse, Ramonville Saint-Agne et <a
|
||||
href="https://www.google.fr/maps/@39.0198584,125.7532734,16">39.01939978492492,
|
||||
125.75396209686407</a>
|
||||
href="https://goo.gl/maps/SAbzNjLLPDPEfkj86">평양 직할시 평양 승리거리</a>
|
||||
</p>
|
||||
</div>
|
||||
<div class="description-img">
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue