allaw-ui 1.0.128 → 1.0.130

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/components/molecules/blogHeader/BlogHeader.js +6 -23
  2. package/dist/components/molecules/blogHeader/BlogHeader.module.css +24 -7
  3. package/dist/stories/Header.stories.d.ts +3 -3
  4. package/package.json +1 -1
package/dist/components/molecules/blogHeader/BlogHeader.js CHANGED
@@ -1,37 +1,20 @@
1
1
  import React from "react";
2
- import { Heading, TinyInfo } from "../../atoms/typography";
2
+ import { TinyInfo } from "../../atoms/typography";
3
3
  import Image from "next/image";
4
4
  import styles from "./BlogHeader.module.css";
5
5
  function BlogHeader(_a) {
6
6
  var Title = _a.Title, Author = _a.Author, Date = _a.Date, TimeToRead = _a.TimeToRead, Profession = _a.Profession, ImageBlog = _a.ImageBlog;
7
- var responsiveSettings = [
8
- {
9
- maxWidth: 1000,
10
- minWidth: 768,
11
- styles: { fontSize: "32px", lineHeight: "40px" },
12
- },
13
- {
14
- maxWidth: 767,
15
- minWidth: 480,
16
- styles: { fontSize: "28px", lineHeight: "36px" },
17
- },
18
- {
19
- maxWidth: 479,
20
- minWidth: 0,
21
- styles: { fontSize: "24px", lineHeight: "32px" },
22
- },
23
- ];
24
7
  return (React.createElement("div", { className: styles.blogContainerWrapper },
25
8
  React.createElement("div", { className: styles.blogContainer },
26
9
  React.createElement("div", { className: styles.blogTitle },
27
- React.createElement(Heading, { text: Title, variant: "h2", color: "noir", align: "left", responsiveSettings: responsiveSettings })),
10
+ React.createElement("h1", { className: styles.title }, Title)),
28
11
  React.createElement("div", { className: styles.blogInfoContainer },
29
- React.createElement(TinyInfo, { variant: "medium12", text: Date.toLocaleDateString(), color: "dark-grey" }),
12
+ React.createElement(TinyInfo, { variant: "semiBold12", text: Date.toLocaleDateString(), color: "dark-grey" }),
30
13
  React.createElement("div", { className: styles.timeToReadContainer },
31
14
  React.createElement("i", { className: "allaw-icon-clock" }),
32
- React.createElement(TinyInfo, { variant: "medium12", text: "".concat(TimeToRead, " min"), color: "dark-grey" })),
33
- React.createElement(TinyInfo, { variant: "medium12", text: Profession, color: "dark-grey" }),
34
- React.createElement(TinyInfo, { variant: "medium12", text: Author, color: "dark-grey" })),
15
+ React.createElement(TinyInfo, { variant: "semiBold12", text: "".concat(TimeToRead, " min"), color: "dark-grey" })),
16
+ React.createElement(TinyInfo, { variant: "semiBold12", text: Profession, color: "dark-grey" }),
17
+ React.createElement(TinyInfo, { variant: "semiBold12", text: Author, color: "dark-grey" })),
35
18
  React.createElement("div", { className: styles.blogImageContainer },
36
19
  React.createElement(Image, { src: ImageBlog, alt: "Illustration pour l'article intitul\u00E9 \"".concat(Title, "\""), width: 1000, height: 449, className: styles.blogImage })))));
37
20
  }
package/dist/components/molecules/blogHeader/BlogHeader.module.css CHANGED
@@ -3,6 +3,7 @@
3
3
  justify-content: center;
4
4
  background-color: white;
5
5
  padding: 16px;
6
+ width: 100%;
6
7
  }
7
8
 
8
9
  .blogContainer {
@@ -37,9 +38,20 @@
37
38
  overflow-wrap: break-word;
38
39
  }
39
40
 
41
+ .title {
42
+ color: var(--Primary-Mid-black, #171E25);
43
+ font-family: var(--font-poppins);
44
+ font-family: "Poppins";
45
+ font-size: 40px;
46
+ font-style: normal;
47
+ font-weight: 600;
48
+ line-height: normal;
49
+ letter-spacing: 0.4px;
50
+ }
51
+
40
52
  .blogImage {
41
53
  width: 100%;
42
- height: 100%;
54
+ height: 450px;
43
55
  object-fit: cover;
44
56
  object-position: center;
45
57
  }
@@ -105,6 +117,16 @@
105
117
  }
106
118
  }
107
119
 
120
+ @media (max-width: 825px) {
121
+ .blogImage {
122
+ height: 200px;
123
+ }
124
+
125
+ .title {
126
+ font-size: 25px;
127
+ }
128
+ }
129
+
108
130
  @media (max-width: 400px) {
109
131
  .blogContainerWrapper {
110
132
  padding: 0;
@@ -123,10 +145,5 @@
123
145
  margin-top: 4px;
124
146
  }
125
147
 
126
- .blogInfoContainer {
127
- display: flex;
128
- flex-direction: column;
129
- gap: 4px;
130
- align-items: flex-start;
131
- }
148
+
132
149
  }
package/dist/stories/Header.stories.d.ts CHANGED
@@ -7,9 +7,9 @@ declare const meta: {
7
7
  layout: string;
8
8
  };
9
9
  args: {
10
- onLogin: import("@vitest/spy").Mock<(...args: any[]) => any>;
11
- onLogout: import("@vitest/spy").Mock<(...args: any[]) => any>;
12
- onCreateAccount: import("@vitest/spy").Mock<(...args: any[]) => any>;
10
+ onLogin: import("@vitest/spy").Mock<[], void>;
11
+ onLogout: import("@vitest/spy").Mock<[], void>;
12
+ onCreateAccount: import("@vitest/spy").Mock<[], void>;
13
13
  };
14
14
  };
15
15
  export default meta;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "allaw-ui",
3
- "version": "1.0.128",
3
+ "version": "1.0.130",
4
4
  "description": "Composants UI pour l'application Allaw",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.esm.js",