]> _ Git - pmi.git/commitdiff
wip #2756 @1
authornael <nael@cubedesigners.com>
Wed, 12 Jun 2019 14:17:47 +0000 (16:17 +0200)
committernael <nael@cubedesigners.com>
Wed, 12 Jun 2019 14:17:47 +0000 (16:17 +0200)
public/_modules/news-article/img/arrow-left.svg [new file with mode: 0644]
public/_modules/news-article/img/news.png [new file with mode: 0644]
public/_modules/news-article/index.html [new file with mode: 0644]
public/_modules/news-article/style.styl [new file with mode: 0644]

diff --git a/public/_modules/news-article/img/arrow-left.svg b/public/_modules/news-article/img/arrow-left.svg
new file mode 100644 (file)
index 0000000..5e75c9a
--- /dev/null
@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="13.414" height="10.828" viewBox="0 0 13.414 10.828">
+  <g id="Groupe_8" data-name="Groupe 8" transform="translate(862.414 586.414) rotate(180)">
+    <g id="Groupe_6" data-name="Groupe 6" transform="translate(849 577)">
+      <path id="Tracé_16" data-name="Tracé 16" d="M3275.773-724.775l4,4-4,4" transform="translate(-3267.773 724.775)" fill="none" stroke="#0eaada" stroke-linecap="square" stroke-miterlimit="10" stroke-width="2"/>
+      <line id="Ligne_2" data-name="Ligne 2" x1="12" transform="translate(0 4)" fill="none" stroke="#0eaada" stroke-miterlimit="10" stroke-width="2"/>
+    </g>
+  </g>
+</svg>
diff --git a/public/_modules/news-article/img/news.png b/public/_modules/news-article/img/news.png
new file mode 100644 (file)
index 0000000..c932be9
Binary files /dev/null and b/public/_modules/news-article/img/news.png differ
diff --git a/public/_modules/news-article/index.html b/public/_modules/news-article/index.html
new file mode 100644 (file)
index 0000000..1c282ec
--- /dev/null
@@ -0,0 +1,71 @@
+<!doctype html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport"
+          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <link rel="stylesheet" href="style.css">
+    <link rel="stylesheet" href="../../css/app.css">
+    <link href="https://fonts.googleapis.com/css?family=Barlow:500,600|Muli&display=swap" rel="stylesheet">
+    <title>pmi</title>
+</head>
+<body>
+
+<div id="news-article" class=" mt-5 ">
+    <div class="text-block mb-2v text-block-default-padding pl-2v">
+        <h1 class="h1">Lorem Ipsum</h1>
+        <div class="text-block-body"></div>
+    </div>
+
+    <div class="article flex sm:flex-col">
+        <div class="img">
+            <img src="img/news.png" alt="">
+        </div>
+    <div class="content ml-12 sm:ml-0 flex flex-col text-grey-dark">
+        <span class="news-date ">12/01/19</span>
+        <h3 class="mt-2 mb-0">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque vehicula velit libero, id porta nulla dictum vel. Duis id euismod mauris.</h3>
+        <p class="news-txt mt-6" >
+            Ut in auctor turpis. Proin in velit eu tellus facilisis commodo. In convallis neque quis
+            augue vulputate finibus. Pellentesque volutpat a erat non tempor. Aliquam sagittis, nisi
+            quis elementum porttitor, lectus arcu facilisis mi, eget aliquet enim velit ut elit.
+            Donec eget purus pellentesque, tincidunt dolor et, condimentum neque. Curabitur vulputate
+            a sapien eget aliquet. Aenean pharetra neque vel sapien luctus, rutrum scelerisque mi
+            dapibus. Nunc commodo lobortis ornare. Nullam pharetra, diam eu auctor auctor, lectus
+            nisi lobortis ipsum, in imperdiet nulla est condimentum tortor. Duis ut commodo lacus.
+            Etiam id risus ac arcu ullamcorper fringilla nec eget nunc. Aliquam tincidunt vitae urna
+            eu volutpat.</p>
+        <p>
+            Nam a nulla in erat consequat dignissim. Etiam a mauris lacinia lorem varius tristique
+            nec at augue. Nunc iaculis efficitur laoreet. Donec finibus lobortis eros. Suspendisse
+            sed sapien vel magna tempor
+        </p>
+
+        <h3 class="mt-2 mb-0">Integer id vehicula orci.</h3>
+        <p class="news-txt mt-6" >
+            Sed vestibulum vestibulum placerat. Nulla ac odio posuere, pretium nisi sed, semper justo.
+            Curabitur facilisis tortor nec sapien sagittis, vel semper diam blandit. Curabitur
+            pretium, libero nec gravida volutpat, mi metus consectetur purus, et vulputate nunc
+            elit non felis. Nulla vitae mauris nunc. Duis a nisi a leo mattis tristique. In posuere
+            dui eu mauris faucibus tristique. Morbi vehicula mi non nibh maximus, ut molestie nisl
+            faucibus. Aliquam posuere augue eget velit tempor, ac vehicula ipsum dignissim. Aliquam
+            in dui sed nulla egestas bibendum id eu tortor. Etiam vel ipsum vitae eros ultricies
+            lacinia at vel justo. Sed pellentesque odio vel dui ornare congue.</p>
+       <span class="mb-0 mt-12">Plus d'informations sur :
+            <p>
+                <a href="#">www.consectetur.com</a>
+            </p>
+        </span>
+
+        <div class="mt-12 flex items-center ">
+            <img class="inline-block mr-3" src="img/arrow-left.svg" alt="">
+            <a href="">Retour aux actualités</a>
+        </div>
+
+    </div>
+    </div>
+</div>
+
+<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.js"></script>
+</body>
+</html>
\ No newline at end of file
diff --git a/public/_modules/news-article/style.styl b/public/_modules/news-article/style.styl
new file mode 100644 (file)
index 0000000..92e3b03
--- /dev/null
@@ -0,0 +1,36 @@
+$h3 = 24px
+$h2 = 36px
+$barlow = 'Barlow', sans-serif
+$muli = 'Muli', sans-serif
+$dark = #6B7287
+$lightgrey = #F7F8FC
+$darkblue = #152F4E
+$lightblue = #0EAADA
+$verylightgrey =#E7E9F3
+
+*
+  padding: 0
+  box-sizing: border-box !important
+  margin: 0
+  font-family: $muli
+
+#news-article
+  margin 5vw 10vw  // à supprimer
+  h3
+    font-size: 24px
+  .content
+    max-width: 744px
+    @media (max-width : 767px)
+      margin-top: 2.5vw
+  .news-date
+    font-size: 14px
+  .news-txt
+    margin-bottom: 0 !important
+  .section-event
+    background $lightgrey
+    width 18.125vw
+    @media (max-width : 1280px)
+      width 100%
+  .event-title
+    font-family: $barlow
+    font-weight: 500
\ No newline at end of file