From f1d1f1d86bfcefdb5680166577f3a9b9582802ae Mon Sep 17 00:00:00 2001
From: Alice Poggioli <alice.poggioli@paca.happy-dev.fr>
Date: Wed, 26 Aug 2020 10:04:01 +0200
Subject: [PATCH] change the typo
---
src/includes/head.pug | 1 +
src/includes/splash.pug | 2 +-
src/styles/_variables.scss | 4 ++
src/styles/index.scss | 116 ++++++++++++++++++-------------------
4 files changed, 64 insertions(+), 59 deletions(-)
diff --git a/src/includes/head.pug b/src/includes/head.pug
index 655b0332..470060fc 100644
--- a/src/includes/head.pug
+++ b/src/includes/head.pug
@@ -12,6 +12,7 @@ head
script(src="https://unpkg.com/dialog-polyfill")
script(src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous")
script(src="https://cdn.jsdelivr.net/npm/sweetalert2@9")
+ link(href="https://fonts.googleapis.com/css2?family=Cabin:wght@400;500&display=swap" rel="stylesheet")
script.
document.addEventListener("DOMContentLoaded", event => {
if ((window.navigator.userAgent.indexOf("MSIE ") > -1 || !!navigator.userAgent.match(/Trident.*rv\:11\./)) ||
diff --git a/src/includes/splash.pug b/src/includes/splash.pug
index 944aca57..263f30cd 100644
--- a/src/includes/splash.pug
+++ b/src/includes/splash.pug
@@ -2,7 +2,7 @@ solid-router(default-route='splash-index')
solid-route(name='splash-index')
figure(class="logo")
- img(src=`${client_domain}/images/logo.png` alt="Coopstarter logo")
+ img(src=`${client_domain}/images/logo.png` alt="Coopedia logo")
h2.title_lead=`${data.Welcome}`
diff --git a/src/styles/_variables.scss b/src/styles/_variables.scss
index e69de29b..73548a5a 100644
--- a/src/styles/_variables.scss
+++ b/src/styles/_variables.scss
@@ -0,0 +1,4 @@
+
+$font-stack: 'Cabin', sans-serif;
+$subfont-stack: Open Sans, sans-serif;
+
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 3b85587d..f1815047 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -85,25 +85,25 @@ XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX*/
}
/* XXXXXXXXXXXXXXXXXXXXXXXX technique XXXXXXXXXXXXXXXXXXXXXX */
-@font-face {
- font-family: 'var(--typo)';
- src: url('../fonts/CALIST.eot'); /* IE9 Compat Modes */
- src: url('../fonts/CALIST.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
- url('../fonts/CALIST.woff2') format('woff2'), /* Super Modern Browsers */
- url('../fonts/CALIST.woff') format('woff'), /* Pretty Modern Browsers */
- url('../fonts/CALIST.ttf') format('truetype'), /* Safari, Android, iOS */
- url('../fonts/CALIST.svg#svgFontName') format('svg'); /* Legacy iOS */
-}
-
-@font-face {
- font-family: 'var(--typo-btn)';
- src: url('../fonts/avenir-light.eot'); /* IE9 Compat Modes */
- src: url('../fonts/avenir-light.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
- url('../fonts/avenir-light.woff2') format('woff2'), /* Super Modern Browsers */
- url('../fonts/avenir-light.woff') format('woff'), /* Pretty Modern Browsers */
- url('../fonts/avenir-light.ttf') format('truetype'), /* Safari, Android, iOS */
- url('../fonts/avenir-light.svg#svgFontName') format('svg'); /* Legacy iOS */
-}
+// @font-face {
+// font-family: 'var(--typo)';
+// src: url('../fonts/CALIST.eot'); /* IE9 Compat Modes */
+// src: url('../fonts/CALIST.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
+// url('../fonts/CALIST.woff2') format('woff2'), /* Super Modern Browsers */
+// url('../fonts/CALIST.woff') format('woff'), /* Pretty Modern Browsers */
+// url('../fonts/CALIST.ttf') format('truetype'), /* Safari, Android, iOS */
+// url('../fonts/CALIST.svg#svgFontName') format('svg'); /* Legacy iOS */
+// }
+
+// @font-face {
+// font-family: 'var(--typo-btn)';
+// src: url('../fonts/avenir-light.eot'); /* IE9 Compat Modes */
+// src: url('../fonts/avenir-light.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
+// url('../fonts/avenir-light.woff2') format('woff2'), /* Super Modern Browsers */
+// url('../fonts/avenir-light.woff') format('woff'), /* Pretty Modern Browsers */
+// url('../fonts/avenir-light.ttf') format('truetype'), /* Safari, Android, iOS */
+// url('../fonts/avenir-light.svg#svgFontName') format('svg'); /* Legacy iOS */
+// }
html{
font-size: 62.5%; /* definition du rem 1rem=10px*/
@@ -228,7 +228,7 @@ solid-set-default[name="actions"]{
/* XXXXXXXXXXXXXXXXXXXXXXXX visuels XXXXXXXXXXXXXXXXXXXXXX */
body{
- font-family: "var(--typo)";
+ font-family: $font-stack;
background: var(--bg-page);
}
@@ -245,7 +245,7 @@ body{
text-align: center;
margin: 2rem;
font-weight: 900;
- font-family: 'var(--typo-btn)';
+ font-family: $font-stack;
}
@@ -296,7 +296,7 @@ input[type="submit"].disabled {
font-size: 1.4rem;
padding: .8rem 1.9rem .8rem 1.9rem;
margin: 1.5rem .5rem 1rem .5rem;
- font-family: 'var(--typo-btn)';
+ font-family: $font-stack;
border: 2px solid var(--bg-btn-base);
box-shadow: none;
border-radius: 20px;
@@ -318,7 +318,7 @@ input[type="submit"].disabled {
font-size: 1.4rem;
padding: 1.5rem 1.9rem 1.5rem 1.9rem;
margin: 3rem 0 1rem 0;
- font-family: 'var(--typo-btn)';
+ font-family: $font-stack;
border: 2px solid #444C4D;
box-shadow: none;
width: auto;
@@ -335,7 +335,7 @@ input[type="submit"].disabled {
p{
font-size: 1.6rem;
color: var(--clr-typo-base);
- font-family: 'var(--typo-btn)';
+ font-family: $font-stack;
text-align: left;
margin: 0 0 var(--marge-petit) 0;
}
@@ -350,7 +350,7 @@ p{
color: var(--clr-typo-base);
font-size: 1.4rem;
text-decoration: underline;
- font-family: 'var(--typo-btn)';
+ font-family: $font-stack;
transition: all .3s ease-in-out;
margin: 3rem;
cursor: pointer;
@@ -361,7 +361,7 @@ p{
}
.add_browse{
- font-family: 'var(--typo-btn)';
+ font-family: $font-stack;
min-width: 10rem;
font-size: 1.4rem;
color: var(--bg-block);
@@ -386,7 +386,7 @@ p{
border-radius: 15.5px;
background-color: #818998;
padding: .5rem 3.5rem .5rem 1.5rem;
- font-family: 'var(--typo-btn)';
+ font-family: $font-stack;
color: var(--bg-block);
text-decoration: none;
text-align: center;
@@ -456,7 +456,7 @@ p{
}
.step nav>span{
order: 2;
- font-family: "var(--typo-btn)";
+ font-family: $font-stack;
color: white;
font-size: 1rem;
font-weight: bold;
@@ -623,7 +623,7 @@ label div{
font-size: 1.4rem;
font-weight: bold;
padding: 1rem 0;
- font-family: 'var(--typo-btn)';
+ font-family: $font-stack;
}
input, textarea, select, form .ss-main .ss-multi-selected{
@@ -634,7 +634,7 @@ input, textarea, select, form .ss-main .ss-multi-selected{
width: 100%;
border:none;
font-weight: lighter;
- font-family: 'var(--typo-btn)';
+ font-family: $font-stack;
outline: none;
transition: all .3s ease-in-out;
height: 3.6rem;
@@ -647,7 +647,7 @@ input:focus, textarea:focus{
.title_form,.title_form p, cs-section_introduction h2, div#mentor-resource-detail cs-display-property[name="name"] p,
div#mentor-resource-validate cs-display-property[name="name"] p, div#entrepreneur-resource-detail cs-display-property[name="name"] p,
div#mentor-database-resource-detail cs-display-property[name="name"] p{
- font-family: 'var(--typo)';
+ font-family: $font-stack;
font-size: 2.2rem;
text-align: left;
width: 100%;
@@ -658,7 +658,7 @@ div#mentor-database-resource-detail cs-display-property[name="name"] p{
}
.title_form_avenir{
- font-family: 'var(--typo-btn)';
+ font-family: $font-stack;
color: #3D424A;
border-bottom: 1px solid #C5CCD9;
padding: 0 0 1.5rem 0;
@@ -769,7 +769,7 @@ form .ss-main .ss-multi-selected .ss-values .ss-value{
}
.ss-list.checkbox label{
- font-family: "var(--typo-btn)";
+ font-family: $font-stack;
font-size: 1.5rem;
top: 2rem;
left: .5rem;
@@ -927,7 +927,7 @@ XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX*/
#header .flex a{
display: inline-block;
font-size: 1.8rem;
- font-family: 'var(--typo-btn)';
+ font-family: $font-stack;
color: white;
margin: 0 0 0 5rem;
text-decoration: none;
@@ -1023,7 +1023,7 @@ figure+figure .img_log{
}
h2.title_create{
- font-family: 'var(--typo)';
+ font-family: $font-stack;
font-size: 2.2rem;
text-align: center;
color: #000;
@@ -1077,7 +1077,7 @@ XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX*/
top: -3.5rem;
}
cs-section_header[name="header_criterias"] h2.title_form{
- font-family: 'var(--typo-btn)';
+ font-family: $font-stack;
font-size: 1.4rem;
color: var(--clr-typo-base);
border-bottom: 1px solid #DBE2ED;
@@ -1122,7 +1122,7 @@ XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX*/
border-radius: 5px;
background-color: var(--orange);
padding: .5rem;
- font-family: 'var(--typo-btn)';
+ font-family: $font-stack;
color: var(--bg-block);
text-decoration: none;
text-align: center;
@@ -1296,7 +1296,7 @@ solid-set-default[name="content"]>*{
display: block;
width: 100%;
text-align: left;
- font-family: "var(--typo-btn)";
+ font-family: $font-stack;
font-size: 1.4rem;
}
@@ -1315,7 +1315,7 @@ div .tit_element_list{
display: none;
}
cs-section_header[name="header_criterias"] h2.title_form{
- font-family: 'var(--typo-btn)';
+ font-family: $font-stack;
font-size: 1.4rem;
color: var(--clr-typo-base);
border-bottom: 1px solid #DBE2ED;
@@ -1366,10 +1366,10 @@ solid-multiple label{
text-align: right;
div{
display: inline-block;
- font-family: "var(--typo-btn)";
+ font-family: $font-stack;
&>div {
display: inline-block;
- font-family: "var(--typo-btn)";
+ font-family: $font-stack;
}
}
}
@@ -1476,7 +1476,7 @@ solid-multiple label, cs-resource-status[name="review.status"]+*{
text-align: left;
cursor: pointer;
font-weight: bold;
- font-family: "var(--typo-btn)";
+ font-family: $font-stack;
}
solid-set-default[name="info"]{
@@ -1507,7 +1507,7 @@ solid-multiple label, cs-resource-status[name="review.status"]+*{
color: var(--clr-roll-black);
font-size: 1.4rem;
margin: 0 1rem 0 0;
- font-family: 'var(--typo-btn)';
+ font-family: $font-stack;
}
cs-display-multiple-property[name="fields"]{
float: left;
@@ -1588,7 +1588,7 @@ solid-set-default[name="more_criterias_hidden"]{
border-radius: 5px;
background-color: var(--orange);
padding: .5rem;
- font-family: 'var(--typo-btn)';
+ font-family: $font-stack;
color: var(--bg-block);
text-decoration: none;
text-align: center;
@@ -1605,7 +1605,7 @@ solid-set-default[name="more_criterias_hidden"]{
}
}
solid-multiple.steps label {
- font-family: 'var(--typo-btn)';
+ font-family: $font-stack;
font-weight: bold;
padding-bottom: .5rem;
color: #3D424A;
@@ -1687,7 +1687,7 @@ solid-set-default[name="submitter_info"]{
margin: 0;
}
h1{
- font-family: var(--typo);
+ font-family: $font-stack;
font-size: 2.2rem;
margin: 0 0 2rem 0;
font-weight: normal;
@@ -1708,7 +1708,7 @@ solid-set-default[name="submitter_info"]{
h2{
width: 100%;
text-align: center;
- font-family: "var(--typo)";
+ font-family: $font-stack;
font-size: 2rem;
margin-top: 5rem;
color: var(--clr-roll-black);
@@ -1753,7 +1753,7 @@ solid-set-default[name="submitter_info"]{
.title_form{
font-size: 1.6rem;
color: #3D424A;
- font-family: 'var(--typo-btn)';
+ font-family: $font-stack;
text-align: left;
border: none;
font-weight: normal;
@@ -1818,7 +1818,7 @@ div#public-resource-detail cs-display-property[name="name"].title_form p,
div#mentor-resource-detail cs-display-property[name="name"].title_form p,
div#mentor-database-resource-detail cs-display-property[name="name"].title_form p,
div#entrepreneur-resource-detail cs-display-property[name="name"].title_form p {
- font-family: 'var(--typo)';
+ font-family: $font-stack;
font-size: 2.2rem;
color: #444C4D;
padding: 0 0 1.5rem 2rem;
@@ -1845,7 +1845,7 @@ div#entrepreneur-resource-detail cs-display-property[name="name"].title_form p {
}
}
#entrepreneur-request-create form h2.title_form{
- font-family: 'var(--typo-btn)';
+ font-family: $font-stack;
font-size: 1.6rem;
color: #3D424A;
font-weight: bold;
@@ -1859,7 +1859,7 @@ div#entrepreneur-resource-detail cs-display-property[name="name"].title_form p {
solid-multiple[name="skills"] {
label{
- font-family: 'var(--typo-btn)';
+ font-family: $font-stack;
margin: 0;
font-size: 1.4rem;
color: var(--clr-roll-black);
@@ -1892,7 +1892,7 @@ solid-set-default[name="specifications"] > solid-multiple {
background: var(--bg-form-focus);
margin-top: 1px;
label{
- font-family: 'var(--typo-btn)';
+ font-family: $font-stack;
text-align: center;
margin:0;
font-size: 1.4rem;
@@ -1986,7 +1986,7 @@ div.sib-conversation div.conversation-form:before{
}
div#requests.tabcontent solid-display.request_accordion div div> solid-display-value{
- font-family: 'var(--typo-btn)';
+ font-family: $font-stack;
font-size: 1.2rem;
color: var(--clr-typo-base);
float: left;
@@ -2039,7 +2039,7 @@ cs-display-user-link {
text-align: left;
font-size: 1.3rem;
color: var(--clr-typo-base);
- font-family: 'var(--typo-btn)';
+ font-family: $font-stack;
margin: 0 0 1rem 0;
font-weight: lighter;
}
@@ -2373,7 +2373,7 @@ XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX*/
top: -2rem;
right: 45%;
font-weight: bold;
- font-family: 'var(--typo-btn)';
+ font-family: $font-stack;
font-size: 2rem;
color: var(--bg-btn-base);
}
@@ -2490,7 +2490,7 @@ b, strong {
#mentor-resource-list .tabs .tablink.active+.tablink+.tablink+div div:before{
content: "Resources requesting validation";
position: absolute;
- font-family: 'var(--typo-btn)';
+ font-family: $font-stack;
top: -5px;
left: 0;
font-size: 1.4rem;
@@ -2498,7 +2498,7 @@ b, strong {
#mentor-resource-list .tabs .tablink.active+.tablink+div #requests:before{
content: "Requested resources";
position: absolute;
- font-family: 'var(--typo-btn)';
+ font-family: $font-stack;
top: -5px;
left: 40%;
font-size: 1.4rem;
@@ -2506,7 +2506,7 @@ b, strong {
#mentor-resource-list .tabs .tablink.active+div #history:before{
content: "History of your resources";
position: absolute;
- font-family: 'var(--typo-btn)';
+ font-family: $font-stack;
top: -5px;
right: -8px;
font-size: 1.4rem;
--
GitLab