|
- <template>
- <img id="banner-media" src="/images/header-banalites.jpg"/>
- <header>
- <CPMMenu :items="contents.sections"/>
- </header>
-
- <main>
- <section v-for="section in contents.sections.filter((s) => s.content)" v-html="section.content">
- </section>
- </main>
-
- </template>
-
-
- <script setup>
-
- const {data : contents } = await useFetch('/api/contents');
-
- </script>
-
-
- <style lang="scss">
-
- * {
- margin : 0;
- padding: 0;
- font-family: Verdana, Geneva, Tahoma, sans-serif;
- }
-
- #banner-media {
- width: 100vw;
- }
-
- main {
- width : 80vw;
- margin: auto;
-
- section {
- margin-top: 50px;
- font-size: 1.2rem;
- line-height: 175%;
-
- h1 {
- font-size : 1.5rem;
- }
-
- h2 {
- font-size : 1.3rem;
- }
-
- ul {
- margin-left: 50px;
- margin-top: 25px;
- list-style-type: square;
- }
-
- sup { vertical-align: top; position: relative; top: -0.5em; }
-
- figure {
- margin-bottom : 25px;
- img {
- width : 100%;
- }
- figcaption {
- text-align: center;
- color: white;
- background-color: black;
- }
- }
- }
- }
- </style>
|