diff --git a/public/assets/images/internet_earth.png b/public/assets/images/internet_earth.png
new file mode 100644
index 0000000000000000000000000000000000000000..b8261400687c05d34258055d6240d484dde053a1
Binary files /dev/null and b/public/assets/images/internet_earth.png differ
diff --git a/public/assets/translations/en.json b/public/assets/translations/en.json
index ad1ff38773a36f1bc9069bd8058aebdaa7d66f0c..bb9a4657bd7973d1385b86623961b73a20950218 100644
--- a/public/assets/translations/en.json
+++ b/public/assets/translations/en.json
@@ -2,7 +2,7 @@
"Simplicité": "Simplicity",
"Légèreté": "Lightness",
"Écologie": "Ecology",
- "kuadrado-home-description": "Video game creation studio based in France - Ardèche<br />Digital art creation | Development of free and open source software tools | Education",
+ "kuadrado-home-description": "Based in Vernoux en Vivarais in the Ardèche, Kuadrado Software is a micro-enterprise created in 2021 by Pierre Jarriges.<br />Kuadrado Software develops IT projects with a focus on maximum quality and minimalism.<br /><br />Video game | Web | Software | Research projects | Digital pedagogy<br /><br />All projects are based on a free and open-source approach.",
"Site en construction ...": "Website in construction...",
"Sur les réseaux": "On the networks",
"kuadrado-footer-copyleft": "All images on this website were made by me and may be reused for personal usage.",
@@ -31,5 +31,7 @@
"Pour s'inscrire ou en savoir plus": "To register or find out more",
"software-page-intro": "R&D, experimental projects, software tools for game development or for the web.",
"Programme XXXX": "{%date%} program",
- "Rien de prévu pour le moment": "Nothing planned for the moment"
+ "Rien de prévu pour le moment": "Nothing planned for the moment",
+ "service-page-intro": "Kuadrado Software offers small organisations with limited resources the development of customised IT solutions.<br /><br />Websites | Business applications | Management software ...<br /><br />Kuadrado's values are based on simplicity and honesty, with the aim of developing simple, effective and lightweight solutions to meet real needs.",
+ "service-description": "Customised development of IT solutions. Websites, business applications, management software ..."
}
\ No newline at end of file
diff --git a/public/assets/translations/fr.json b/public/assets/translations/fr.json
index b2aea9cb2fa0ff62530b6a7e93aabd8aa9076047..48f0e714524291ce0e878e995814271cf711fd17 100644
--- a/public/assets/translations/fr.json
+++ b/public/assets/translations/fr.json
@@ -1,5 +1,5 @@
{
- "kuadrado-home-description": "Studio de création de jeux vidéo basé en Ardèche, Vernoux en Vivarais.<br />Création artisitique numérique | Développement d'outillage logiciel libre et open source | Pédagogie.",
+ "kuadrado-home-description": "Basée en Ardèche à Vernoux en Vivarais, Kuadrado Software est une micro-entreprise créée en 2021 par Pierre Jarriges.<br />Kuadrado Software développe des projets informatique dans une démarche d'exigence de qualité maximum et de minimalisme.<br /><br />Jeu vidéo  |  Web  |  Logiciel  |  projets de recherche  |  Pédagogie numérique<br /><br />Tous les projets sont basés sur une approche libre et open-source.",
"kuadrado-footer-copyleft": "Toutes les images du site ont été réalisées par mes soins et peuvent être réutilisées pour un usage personnel.",
"games-description": "Créations vidéoludiques, jeux web et jeux PC, projets en cours.",
"education-description": "S'approprier la technologie par le partage de connaissances.",
@@ -13,5 +13,7 @@
"edu-learn-gnu": "<b>Passez le cap du libre ! </b><br/>Apprenez à installer Linux, faites vos premiers pas avec les logiciels libres et acquérez une autonomie suffisante pour une utilisation basique.",
"edu-learn-mentalo": "Créez un jeu en quelques séances avec l'application Mentalo. Manipulez des concepts logiques, narratifs et artistiques avec le maximum de simplicité.",
"software-page-intro": "R&D, projets expérimentaux, outillage logiciel pour le développement de jeu ou pour le web.",
- "Programme XXXX": "Programme {%date%}"
+ "Programme XXXX": "Programme {%date%}",
+ "service-page-intro": "Kuadrado Software propose aux petites structures à faibles moyens le développement sur mesure de solutions informatiques.<br /><br />Sites web | Applications métier | Logiciels de gestion ...<br /><br />Les valeurs de Kuadrado sont tournées vers la simplicité et l'honnêteté en se donnant pour objectif de développer des solutions simples, efficaces et légères pour répondre à des besoins réels.",
+ "service-description": "Développement sur mesure de solutions informatiques. Sites web, applications métiers, logiciels de gestion ..."
}
\ No newline at end of file
diff --git a/public/service/index.html b/public/service/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..16f7c89b7508ea34b7525166f61d5732855a4a1c
--- /dev/null
+++ b/public/service/index.html
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<html lang="fr" prefix="og: https://ogp.me/ns#">
+
+<head>
+ <meta charset="utf-8" />
+ <title>Kuadrado Software | Service</title>
+ <meta name="description" content="Développement informatique sur mesure, création de site web, applications métiers et logiciels."/>
+ <meta name="author" content="Kuadrado Software" />
+ <meta name="image" content="https://kuadrado-software.fr/assets/images/meca_proc.png"/>
+
+ <!-- Open Graph Protocol meta data -->
+ <meta property="og:title" content="Kuadrado Software | Service"/>
+ <meta property="og:description" content="Développement informatique sur mesure, création de site web, applications métiers et logiciels."/>
+ <meta property="og:type" content="website" />
+ <meta property="og:url" content="https://kuadrado-software.fr/service"/>
+ <meta property="og:image" content="https://kuadrado-software.fr/assets/images/meca_proc.svg"/>
+<meta property="og:image" content="https://kuadrado-software.fr/assets/images/meca_proc.png"/>
+ <meta property="twitter:image" content="https://kuadrado-software.fr/assets/images/meca_proc.png"/>
+ <meta property="og:locale" content="fr_FR"/>
+ <meta property="og:site_name" content="Kuadrado Software" />
+
+ <!-- English translation not ready yet -->
+ <!-- <meta property="og:locale:alternate" content="en_GB" /> -->
+
+ <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1" />
+ <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+ <link href="/style/style.css" rel="stylesheet" />
+ <script type="application/ld+json">{"@context":"https://schema.org","type":"WebPage","description":"Développement informatique sur mesure, création de site web, applications métiers et logiciels.","image":["https://kuadrado-software.fr/assets/images/game_controller.svg","https://kuadrado-software.fr/assets/images/game_controller.png"],"keywords":"service, development, web, software, ardeche, auvergne-rhone-alpes, sur-mesure, informatique, ingénierie, engineering","name":"Kuadrado Software - Service","url":"https://kuadrado-software.fr/service"}</script>
+</head>
+<!-- The vocab attribute defines the standard vocabulary used for RDFa standard.
+ The DOM may contain properties such as "typeof" and "property" accordinly to the schema.org vocabulary -->
+
+<body vocab="https://schema.org/">
+ <!-- The H1 tag will be never seen but it's necessary for SEO -->
+ <main>
+ <h1 style="visibility: hidden">Kuadrado Software | Service</h1>
+ </main>
+</body>
+
+<script type="text/javascript" src="/service/service.js"></script>
+
+</html>
\ No newline at end of file
diff --git a/public/software-development/index.html b/public/software-development/index.html
index 2c0339a05d090b3d30ed4144959163e89295a7e7..96581bd895b496f559d9e1b4d53cb1c8ed8f306d 100644
--- a/public/software-development/index.html
+++ b/public/software-development/index.html
@@ -13,7 +13,8 @@
<meta property="og:description" content="R&D, projets expérimentaux, outillage logiciel pour le développement de jeu ou pour le web."/>
<meta property="og:type" content="website" />
<meta property="og:url" content="https://kuadrado-software.fr/software-development"/>
- <meta property="og:image" content="https://kuadrado-software.fr/assets/images/meca_proc.png"/>
+ <meta property="og:image" content="https://kuadrado-software.fr/assets/images/meca_proc.svg"/>
+<meta property="og:image" content="https://kuadrado-software.fr/assets/images/meca_proc.png"/>
<meta property="twitter:image" content="https://kuadrado-software.fr/assets/images/meca_proc.png"/>
<meta property="og:locale" content="fr_FR"/>
<meta property="og:site_name" content="Kuadrado Software" />
diff --git a/website/src/homepage.js b/website/src/homepage.js
index b6dc91087a6ff045c52150f1c668d36d1f7e1dd1..3e4f5a53c96424182cc55e86b9e3401e7c3a3f67 100644
--- a/website/src/homepage.js
+++ b/website/src/homepage.js
@@ -76,6 +76,12 @@ class HomePage extends WebPage {
href: "/software-development/",
description: t("software-description"),
},
+ {
+ title: "Service",
+ img: images_url + "/meca_proc.svg",
+ href: "/service/",
+ description: t("service-description"),
+ },
].map(cardProps => new ThemeCard(cardProps).render()),
},
],
diff --git a/website/src/homepage.scss b/website/src/homepage.scss
index 61d150e9c65866e818c2079d6b5d3b245179049d..7d4764ed813a85bd25da88a0149931c54cff98cb 100644
--- a/website/src/homepage.scss
+++ b/website/src/homepage.scss
@@ -114,43 +114,9 @@
&:hover {
transform: scale(1.03);
}
- }
- }
-
- .kuadrado-values {
- background-image: $wp_bin_light;
- padding: 100px 0 120px;
-
- *:not(a, blue) {
- color: $light_0;
- }
-
- h2 {
- @include flex-center;
- margin: 0 auto 60px;
- width: 120px;
- height: 120px;
- background-image: $wp_bin;
- border-radius: 100%;
- color: $blue_3;
- }
-
- ul.values-list {
- display: grid;
- grid-template-columns: repeat(3, 1fr);
- gap: 30px;
-
- li {
- background-image: $wp_bin;
- padding: 30px 20px 40px;
- h3 {
- text-align: center;
- }
-
- p {
- text-align: justify;
- }
+ &:last-child {
+ grid-column: 2;
}
}
}
@@ -185,12 +151,10 @@
&:hover {
transform: none;
}
- }
- }
- .kuadrado-values {
- ul.values-list {
- grid-template-columns: 1fr;
+ &:last-child {
+ grid-column: unset;
+ }
}
}
}
diff --git a/website/src/pages/service/service.js b/website/src/pages/service/service.js
index 71559f78d23fc8270243e8cd4cf33137bcdad361..9edc4437f44ec9433a48c5a09e420f09ca1cc45d 100644
--- a/website/src/pages/service/service.js
+++ b/website/src/pages/service/service.js
@@ -1,8 +1,130 @@
-class ServicePage {
+const { images_url } = require("../../../constants");
+const WebPage = require("../../lib/web-page");
+
+class ServicePage extends WebPage {
render() {
return {
- tag: "h1",
- contents: "Service"
+ tag: "div",
+ id: "service-page",
+ contents: [
+ {
+ tag: "div",
+ class: "page-header logo-left",
+ contents: [
+ {
+ tag: "div",
+ class: "page-contents-center grid-wrapper",
+ contents: [
+ {
+ tag: "div",
+ class: "logo",
+ contents: [
+ {
+ tag: "img",
+ alt: "image electronics circuit and gears",
+ src: `${images_url}/meca_proc.svg`,
+ },
+ ],
+ },
+ { tag: "h1", contents: "Service" },
+ {
+ tag: "p",
+ contents: t("service-page-intro"),
+ },
+ ],
+ },
+ ],
+ },
+ {
+ tag: "div",
+ id: "service-sections",
+ class: "page-contents-center",
+ contents: [
+ {
+ tag: "section",
+ class: "img-left",
+ contents: [
+ { tag: "img", width: 300, height: 300, src: `${images_url}/internet_earth.png` },
+ {
+ tag: "div",
+ class: "section-data",
+ contents: [
+ { tag: "h3", contents: "Web" },
+ { tag: "p", contents: "Sites web légers et rapides avec outil de gestion de contenu incorporé." },
+ {
+ tag: "ul", contents: [
+ "Gestion de l'hébergement",
+ "Maintenance et évolution",
+ "Référencement sur les moteurs de recherche",
+ ].map(li_txt => {
+ return {
+ tag: "li",
+ contents: li_txt
+ }
+ })
+ }
+ ]
+ }
+ ]
+ },
+ {
+ tag: "section",
+ class: "img-right",
+ contents: [
+ { tag: "img", width: 300, height: 300, src: `${images_url}/meca_proc.svg` },
+ {
+ tag: "div",
+ class: "section-data",
+ contents: [
+ { tag: "h3", contents: "Logiciels professionnels - Applications métier" },
+ { tag: "p", contents: "Optimisez la gestion de votre activité avec un logiciel adapté ou proposez une interface numérique à votre public." },
+ ]
+ }
+ ]
+ },
+ {
+ tag: "section",
+ class: "img-left",
+ contents: [
+ { tag: "img", width: 300, height: 300 },
+ {
+ tag: "div",
+ class: "section-data",
+ contents: [
+ { tag: "p", contents: "Kuadrado Software vous accompagne sur votre projet de A Ã Z" },
+ {
+ tag: "ul", contents: [
+ "Identification du métier et du besoin",
+ "Définition d'un cahier des charges adapté à vos moyens",
+ "Développement itératif<br /><em>(nous validons ensemble chaque étape du développement)<em/>",
+ "Maintenance, mises à jours, déploiement, hébergement ...",
+ ].map(li_txt => {
+ return {
+ tag: "li",
+ contents: li_txt
+ }
+ })
+ }
+ ]
+ }
+
+ ]
+ },
+ {
+ tag: "section",
+ contents: [
+ { tag: "p", contents: "Pour une demande de devis ou un premier échange autour de votre projet" },
+ {
+ tag: "a",
+ href: "mailto:contact@kuadrado-software.fr",
+ contents: "contact@kuadrado-software.fr"
+ }
+ ]
+ },
+ ]
+ }
+ ]
+
}
}
}
diff --git a/website/src/pages/service/service.scss b/website/src/pages/service/service.scss
new file mode 100644
index 0000000000000000000000000000000000000000..0435bd074a5e31dd63024332594bfc734b379197
--- /dev/null
+++ b/website/src/pages/service/service.scss
@@ -0,0 +1,74 @@
+#service-page {
+ #service-sections {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+
+ section {
+ display: grid;
+ gap: 30px;
+ padding: 30px;
+
+ img {
+ width: 300px;
+ height: 300px;
+ grid-row: 1 / span 2;
+ }
+
+ &.img-right {
+ grid-template-columns: 300px auto;
+
+ img {
+ grid-column: 2;
+ }
+ }
+
+ &.img-left {
+ grid-template-columns: 300px auto;
+
+ img {
+ grid-column: 1;
+ }
+ }
+
+ .section-data {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ min-height: 300px;
+
+ h3 {
+ color: $blue_2;
+ font-size: 25px;
+ margin: 0;
+ }
+
+ p {
+ max-width: 400px;
+ font-size: 18px;
+ }
+
+
+
+ ul {
+
+ li {
+ padding: 5px 0;
+
+ &,
+ * {
+ color: $medium_grey;
+ }
+
+ &::before {
+ content: "\1F7E2\0020"; // A green spot and a space
+ vertical-align: middle;
+ }
+ }
+ }
+ }
+
+
+ }
+ }
+}
\ No newline at end of file
diff --git a/website/src/style.scss b/website/src/style.scss
index b33fef02ef16b49785400b51bfc5d5b481d346f8..d3d092e7eb029447557a57fa1b17a43eefad91c0 100644
--- a/website/src/style.scss
+++ b/website/src/style.scss
@@ -516,6 +516,7 @@ main {
@import "./homepage.scss";
@import "./pages/education/education.scss";
@import "./pages/games/games.scss";
+ @import "./pages/service/service.scss";
@import "./pages/software-development/software-development.scss";
@import "./article-view.scss";
}
diff --git a/website/src/template/components/navbar.js b/website/src/template/components/navbar.js
index 2f3bf62e7f02c93f7f97c9990d17b85ea2611f12..e3fffd988cb2c36591996abd78afe5f12ec52f5d 100644
--- a/website/src/template/components/navbar.js
+++ b/website/src/template/components/navbar.js
@@ -8,7 +8,9 @@ const NAV_MENU_ITEMS = [
url: "/education/",
text: "Pédagogie",
},
- { url: "/software-development/", text: "Software" }
+ { url: "/software-development/", text: "Software" },
+ { url: "/service/", text: "Service" }
+
];
class NavBar {