feat: Why Lenra page (#61)

lenra-io · Jan 24, 2023 · 2c0391e · 2c0391e
1 parent 83600e0
commit 2c0391e
Show file tree

Hide file tree

Showing 25 changed files with 1,044 additions and 434 deletions.
diff --git a/font/Lenra icons.json b/font/Lenra icons.json
diff --git a/font/Lenra-icons-v1.0.zip b/font/Lenra-icons-v1.0.zip
diff --git a/font/custom_icons/tilde.svg b/font/custom_icons/tilde.svg
diff --git a/src/i18n/common.json b/src/i18n/common.json
@@ -9,6 +9,10 @@
  "name": "discover",
  "group": "platform"
  },
+ {
+ "name": "why-lenra",
+ "group": "platform"
+ },
  {
  "name": "usecases",
  "group": "platform"
@@ -24,12 +28,73 @@
  {
  "name": "contact",
  "group": "contact",
- "disabled": true
+ "disabled": true,
+ "notOnTop": true
  },
  {
  "name": "legal",
  "group": "contact",
  "notOnTop": true
  }
+ ],
+ "competitorsFields": [
+ "anyLanguage",
+ "frontEnd",
+ "allOS",
+ "backEnd",
+ "autoscaling",
+ "optimized",
+ "encourageOptimizing",
+ "gdpr"
+ ],
+ "competitors": [
+ {
+ "name": "MeteorJS",
+ "anyLanguage": "no",
+ "opensource": "yes",
+ "frontEnd": "yes",
+ "allOS": "partially",
+ "backEnd": "yes",
+ "autoscaling": "no",
+ "optimized": "no",
+ "encourageOptimizing": "no",
+ "gdpr": "no"
+ },
+ {
+ "name": "Supabase",
+ "anyLanguage": "partially",
+ "opensource": "yes",
+ "frontEnd": "no",
+ "allOS": "",
+ "backEnd": "yes",
+ "autoscaling": "partially",
+ "optimized": "no",
+ "encourageOptimizing": "no",
+ "gdpr": "no"
+ },
+ {
+ "name": "Firebase",
+ "anyLanguage": "no",
+ "opensource": "no",
+ "frontEnd": "no",
+ "allOS": "",
+ "backEnd": "yes",
+ "autoscaling": "partially",
+ "optimized": "partially",
+ "encourageOptimizing": "no",
+ "gdpr": "no"
+ },
+ {
+ "name": "AWS Lambda",
+ "anyLanguage": "yes",
+ "opensource": "no",
+ "frontEnd": "no",
+ "allOS": "",
+ "backEnd": "yes",
+ "autoscaling": "yes",
+ "optimized": "no",
+ "encourageOptimizing": "no",
+ "gdpr": "no"
+ }
  ]
 }
diff --git a/src/i18n/en.json b/src/i18n/en.json
@@ -27,6 +27,11 @@
  "title": "Discover Lenra",
  "description": "Lenra is an open source framework to create your app using any language, and deploy it without any Ops scale, built on ethical values."
  },
+ "why-lenra": {
+ "name": "Why Lenra",
+ "title": "Why should I use Lenra ?",
+ "description": "Why our solution and not another? With Lenra, we make sure to solve a problem that is more than present in our society, all with strong values."
+ },
  "usecases": {
  "name": "Use cases",
  "title": "The main Lenra use cases",
@@ -62,5 +67,16 @@
  "contact": {
  "name": "Contact"
  }
+ },
+ "competitorsFieldsText": {
+ "anyLanguage": "Code using any language",
+ "opensource": "Use an opensource solution",
+ "frontEnd": "Manage the front end",
+ "allOS": "Use my app on any operating system",
+ "backEnd": "Manage the back end",
+ "autoscaling": "Have an autoscalable environment",
+ "optimized": "Consume a minimum of data",
+ "encourageOptimizing": "Be accompanied to optimize my resources",
+ "gdpr": "Be accompanied to comply with European law (GDPR, INR, etc.)"
  }
 }
diff --git a/src/static/css/.design.css b/src/static/css/.design.css
@@ -64,10 +64,10 @@
  --bottom-padding: 5;
  --section-padding-top: 6;
  --section-padding-bottom: 6;
- --logo-horizontal-image-black: url("../img/logo.svg");
- --logo-vertical-image-black: url("../img/logo-vertical.svg");
- --logo-horizontal-image-white: url("../img/logo-white.svg");
- --logo-vertical-image-white: url("../img/logo-vertical-white.svg");
+ --logo-horizontal-image-black: url("../img/logo/horizontal-black.svg");
+ --logo-vertical-image-black: url("../img/logo/vertical-black.svg");
+ --logo-horizontal-image-white: url("../img/logo/horizontal-white.svg");
+ --logo-vertical-image-white: url("../img/logo/vertical-white.svg");
  --logo-horizontal-image: var(--logo-horizontal-image-black);
  --logo-vertical-image: var(--logo-vertical-image-black);
  --logo-image: var(--logo-vertical-image);
@@ -89,7 +89,7 @@ html {
 
 body {
  background-color: var(--background-color);
- font-family: 'Source Sans Pro';
+ font-family: 'Source Sans Pro', 'Arial', sans-serif;
  font-size: var(--font-size);
  line-height: var(--line-height-multiplier);
 }

diff --git a/src/static/css/.icons.css b/src/static/css/.icons.css
@@ -1,9 +1,9 @@
 @font-face {
  font-family: 'Lenra-icons';
  src:
- url('../fonts/Lenra-icons.ttf?jxsam5') format('truetype'),
- url('../fonts/Lenra-icons.woff?jxsam5') format('woff'),
- url('../fonts/Lenra-icons.svg?jxsam5#Lenra-icons') format('svg');
+ url('../fonts/Lenra-icons.ttf?fkmt5b') format('truetype'),
+ url('../fonts/Lenra-icons.woff?fkmt5b') format('woff'),
+ url('../fonts/Lenra-icons.svg?fkmt5b#Lenra-icons') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
@@ -33,64 +33,6 @@
 .lenra-icon-cron:before {
  content: "\e930";
 }
-.lenra-icon-tiktok:before {
- content: "\e934";
-}
-.lenra-icon-twitch:before {
- content: "\e933";
- color: #6441a4;
-}
-.lenra-icon-dev-dot-to:before {
- content: "\e90b";
-}
-.lenra-icon-reddit:before {
- content: "\e90a";
- color: #ff4500;
-}
-.lenra-icon-github:before {
- content: "\e904";
-}
-.lenra-icon-instagram:before {
- content: "\e905";
- color: #e4405f;
-}
-.lenra-icon-linkedin:before {
- content: "\e906";
- color: #0077b5;
-}
-.lenra-icon-twitter:before {
- content: "\e907";
- color: #1da1f2;
-}
-.lenra-icon-youtube:before {
- content: "\e908";
- color: #f00;
-}
-.lenra-icon-android:before {
- content: "\e925";
- color: #3ddc84;
-}
-.lenra-icon-ios:before {
- content: "\e926";
-}
-.lenra-icon-apple:before {
- content: "\e927";
- color: #999;
-}
-.lenra-icon-linux:before {
- content: "\e928";
- color: #fcc624;
-}
-.lenra-icon-windows:before {
- content: "\e929";
- color: #0078d6;
-}
-.lenra-icon-devices:before {
- content: "\e931";
-}
-.lenra-icon-auto-scaling:before {
- content: "\e932";
-}
 .lenra-icon-cpu:before {
  content: "\e920";
 }
@@ -100,6 +42,15 @@
 .lenra-icon-database:before {
  content: "\e923";
 }
+.lenra-icon-frown:before {
+ content: "\e909";
+}
+.lenra-icon-meh:before {
+ content: "\e935";
+}
+.lenra-icon-smile:before {
+ content: "\e936";
+}
 .lenra-icon-at-sign:before {
  content: "\e900";
 }
@@ -145,6 +96,27 @@
 .lenra-icon-arrow-up-right:before {
  content: "\e91d";
 }
+.lenra-icon-tilde:before {
+ content: "\e903";
+}
+.lenra-icon-minus:before {
+ content: "\e90c";
+}
+.lenra-icon-help-circle:before {
+ content: "\e937";
+}
+.lenra-icon-share-2:before {
+ content: "\e938";
+}
+.lenra-icon-tool:before {
+ content: "\e939";
+}
+.lenra-icon-devices:before {
+ content: "\e931";
+}
+.lenra-icon-auto-scaling:before {
+ content: "\e932";
+}
 .lenra-icon-activity:before {
  content: "\e91e";
 }
@@ -158,13 +130,13 @@
  content: "\e924";
 }
 .lenra-icon-book-open:before {
- content: "\e903";
+ content: "\e90d";
 }
 .lenra-icon-check-circle:before {
- content: "\e90c";
+ content: "\e90e";
 }
 .lenra-icon-clock:before {
- content: "\e90d";
+ content: "\e90f";
 }
 .lenra-icon-dollar-sign:before {
  content: "\e910";
@@ -185,8 +157,60 @@
  content: "\e915";
 }
 .lenra-icon-shield:before {
- content: "\e90e";
+ content: "\e93a";
 }
 .lenra-icon-star:before {
- content: "\e90f";
+ content: "\e93b";
+}
+.lenra-icon-tiktok:before {
+ content: "\e934";
+}
+.lenra-icon-twitch:before {
+ content: "\e933";
+ color: #6441a4;
+}
+.lenra-icon-dev-dot-to:before {
+ content: "\e90b";
+}
+.lenra-icon-reddit:before {
+ content: "\e90a";
+ color: #ff4500;
+}
+.lenra-icon-github:before {
+ content: "\e904";
+}
+.lenra-icon-instagram:before {
+ content: "\e905";
+ color: #e4405f;
+}
+.lenra-icon-linkedin:before {
+ content: "\e906";
+ color: #0077b5;
+}
+.lenra-icon-twitter:before {
+ content: "\e907";
+ color: #1da1f2;
+}
+.lenra-icon-youtube:before {
+ content: "\e908";
+ color: #f00;
+}
+.lenra-icon-android:before {
+ content: "\e925";
+ color: #3ddc84;
+}
+.lenra-icon-ios:before {
+ content: "\e926";
+}
+.lenra-icon-apple:before {
+ content: "\e927";
+ color: #999;
+}
+.lenra-icon-linux:before {
+ content: "\e928";
+ color: #fcc624;
+}
+.lenra-icon-windows:before {
+ content: "\e929";
+ color: #0078d6;
 }
diff --git a/src/static/css/components/.header.css b/src/static/css/components/.header.css
@@ -145,6 +145,9 @@ body>header>p>a {
  justify-content: end;
  flex-wrap: nowrap;
  column-gap: 2rem;
+ /* 
+ If a page is added
+ column-gap: 1rem; */
  margin-bottom: 6rem;
  }
 
@@ -154,7 +157,13 @@ body>header>p>a {
  }
 }
 
-@media (min-width: 82.5rem) {
+/* @media (min-width: 60rem) {
+ body>header>nav.menu {
+ column-gap: 2rem;
+ }
+} */
+
+@media (min-width: 75rem) {
  body>header>nav.menu {
  column-gap: 3rem;
  }

diff --git a/src/static/css/index.css b/src/static/css/index.css
@@ -100,11 +100,6 @@ body>header>a::before {
 
 
 
-/********** Try **********/
-
-#try>img {
- margin-bottom: 1rem;
-}
 
 /*--------- Partners ---------*/
 
@@ -136,13 +131,6 @@ body>header>a::before {
 
 /******** Media queries *********/
 
-@media (min-width: 28.75rem) {
- #try>nav>a:last-of-type {
- margin-left: auto;
- margin-right: auto;
- }
-}
-
 @media (min-width: 31.25rem) {
  body>header {
  --header-content-padding: 0;