initial commit
This commit is contained in:
commit
4b99d290f3
5 changed files with 153 additions and 0 deletions
2
css/main.css
Normal file
2
css/main.css
Normal file
|
|
@ -0,0 +1,2 @@
|
|||
@import "reset.css";
|
||||
@import "text.css";
|
||||
5
css/reset.css
Normal file
5
css/reset.css
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
html {box-sizing: border-box;}*,*::before,*::after {box-sizing: inherit;}body,h1,h2,h3,h4,h5,h6,ul,ol,li,p,pre,blockquote,figure,hr {margin: 0;padding: 0; font-size:100%; font-weight: normal;}ul {list-style: none;}input,textarea,select,button {color: inherit;font: inherit;letter-spacing: inherit;}input,textarea,button {border: 1px solid gray;}button {border-radius: 0;padding: 0.75em 1em;background-color: transparent;}button * {pointer-events: none;}embed,iframe,img,object,video {display: block;max-width: 100%;}table {table-layout: fixed;width: 100%;}[hidden] {display: none !important;}noscript {display: block;margin-bottom: 1em;margin-top: 1em;}
|
||||
/* Buttons and input buttons */
|
||||
[role="button"],input[type="submit"],input[type="reset"],input[type="button"],button { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box;}
|
||||
input[type="submit"], input[type="reset"], input[type="button"], button { background: none; border: 0; color: inherit; font: inherit; line-height: normal; overflow: visible; padding: 0; -webkit-appearance: button; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; }
|
||||
input::-moz-focus-inner, button::-moz-focus-inner { border: 0; padding: 0;}
|
||||
45
css/text.css
Normal file
45
css/text.css
Normal file
|
|
@ -0,0 +1,45 @@
|
|||
.title-l {
|
||||
font-size: var(--font-size-xxl);
|
||||
line-height: var(--line-height-title-l);
|
||||
font-family: serif;
|
||||
}
|
||||
.title-m {
|
||||
font-size: var(--font-size-xl);
|
||||
line-height: var(--line-height-title-m);
|
||||
font-family: serif;
|
||||
}
|
||||
|
||||
.current-text-l {
|
||||
font-size: var(--font-size-l);
|
||||
line-height: var(--line-height-current-text-l);
|
||||
font-family: sans-serif;
|
||||
}
|
||||
.current-text-m {
|
||||
font-size: var(--font-size-m);
|
||||
line-height: var(--line-height-current-text);
|
||||
font-family: sans-serif;
|
||||
}
|
||||
|
||||
.bubble-current-text {
|
||||
font-size: var(--font-size-s);
|
||||
line-height: var(--line-height-current-text);
|
||||
font-family: sans-serif;
|
||||
}
|
||||
|
||||
.label-m,
|
||||
.bubble-title,
|
||||
.topbar-menu-item {
|
||||
/*revoir les classes*/
|
||||
font-size: var(--font-size-s);
|
||||
line-height: var(--line-height-label-m);
|
||||
font-family: sans-serif;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.label-s {
|
||||
font-size: var(--font-size-xs);
|
||||
line-height: var(--line-height-label-s);
|
||||
font-family: sans-serif;
|
||||
opacity: 0.8;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
25
css/varibles.css
Normal file
25
css/varibles.css
Normal file
|
|
@ -0,0 +1,25 @@
|
|||
:root{
|
||||
--font-size-xxl : 8rem;
|
||||
--font-size-xl : 4.0625rem;
|
||||
--font-size-l : 2.5rem;
|
||||
--font-size-m : 1.125rem;
|
||||
--font-size-s : 0.9375rem;
|
||||
--font-size-xs : 0.625rem;
|
||||
|
||||
--line-height-title-l: 0.93em;
|
||||
--line-height-title-m: 1em;
|
||||
--line-height-bubble-title: 1em;
|
||||
--line-height-current-text-l: 50px;
|
||||
--line-height-current-text: 1.4em;
|
||||
--line-height-label-m: 1em;
|
||||
--line-height-label-s: 15px;
|
||||
|
||||
--spacing-l: calc(var(--spacing-m) * 2);
|
||||
--spacing-m: 5rem;
|
||||
--spacing-s: 1.75rem;
|
||||
--spacing-xs: 1.25rem;
|
||||
|
||||
--color-blue:#4433FF;
|
||||
--color-black: black;
|
||||
--color-white: white;
|
||||
}
|
||||
76
index.html
Normal file
76
index.html
Normal file
|
|
@ -0,0 +1,76 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="fr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Document</title>
|
||||
<link rel="stylesheet" href="css\main.css">
|
||||
</head>
|
||||
<body>
|
||||
<nav class="topbar">
|
||||
<p class="topbar-name">F.Denjoy</p>
|
||||
<li class="topbar-menu">
|
||||
<ul class="topbar-menu-item"><a href="#">Le Courage du Réel</a></ul>
|
||||
<ul class="topbar-menu-item"><a href="#">Extraits</a></ul>
|
||||
<ul class="topbar-menu-item"><a href="#">Les poignées</a></ul>
|
||||
<ul class="topbar-menu-item"><a href="#">Le système</a></ul>
|
||||
<ul class="topbar-menu-item"><a href="#">L’auteur</a></ul>
|
||||
<ul class="topbar-menu-item"><a href="#">Précommander</a></ul>
|
||||
<ul class="topbar-menu-item"><a href="#">Presse</a></ul>
|
||||
</li>
|
||||
</nav>
|
||||
<main>
|
||||
<section id="le-courage-du-reel">
|
||||
<header id="hero">
|
||||
<p class="hero-name">Frédéric Denjoy</p>
|
||||
<h1>Le courage<br/> du réel</h1>
|
||||
<h2>Changer sans tomber, tenir sans croire</h2>
|
||||
</header>
|
||||
<section class="wraper-quote">
|
||||
<blockquote>
|
||||
<p>“Le vrai n'est pas démontrable.<br/> Il est habitable.”</p>
|
||||
</blockquote>
|
||||
<p class="current-text-m">— Le Courage du Réel</p>
|
||||
</section>
|
||||
<section class="the-book">
|
||||
<div class="warpper-title">
|
||||
<h3>Pour ceux qui ne sont<br/> plus si sûrs</h3>
|
||||
<p>Le livre</p>
|
||||
</div>
|
||||
<div class="current-text-m">
|
||||
<p>Tout sonne creux, comme si le monde se fermait. Une sensation d'absurde. Des mots, encore des mots— ils glissent. Ce livre commence là : quand ça ne tient plus. </p>
|
||||
<p>Ce n'est ni un développement personnel, ni un traité académique.</p>
|
||||
<p>Le Courage du Réel propose une ontologie du passage. Le réel n'est pas ce qui est, mais ce qui se traverse — localement — dans un geste vivant, face à un inconnu.</p>
|
||||
<p>Le mal n'est pas moral : il est structurel. La vérité, l'amour, l'intelligence, le pouvoir ne sont pas ce que tu crois — et toi non plus. De Platon à Lacan, ce livre met à nu ce qui ne fonctionne plus. Voici venu le temps de construire.</p>
|
||||
</div>
|
||||
<div class="wrapper-data">
|
||||
<div class="data">
|
||||
<p class="label-s">Éditeur</p>
|
||||
<p class="label-m">Reconnaissance</p>
|
||||
</div>
|
||||
<div class="data">
|
||||
<p class="label-s">Pages</p>
|
||||
<p class="label-m">220</p>
|
||||
</div>
|
||||
<div class="data">
|
||||
<p class="label-s">Parution</p>
|
||||
<p class="label-m">2026</p>
|
||||
</div>
|
||||
<div class="data">
|
||||
<p class="label-s">ISBN</p>
|
||||
<p class="label-m">978-2-487595-32-3</p>
|
||||
</div>
|
||||
</div>
|
||||
<div></div>
|
||||
</section>
|
||||
</section>
|
||||
<section id="extrait"></section>
|
||||
<section id="les-poignees"></section>
|
||||
<section id="le-systeme"></section>
|
||||
<section id="l-auteur"></section>
|
||||
<section id="precommander"></section>
|
||||
<section id="presse"></section>
|
||||
</main>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Add table
Add a link
Reference in a new issue