@@ -157,7 +157,7 @@
|
- 196 41 46
+ rgba(69, 140, 165,1)
|
@@ -174,7 +174,7 @@
- 196 35 56
+ rgba()
|
@@ -191,7 +191,7 @@
- 196 35 67
+ rgba()
|
@@ -208,7 +208,7 @@
- 67 67 52
+ rgba()
|
@@ -225,7 +225,7 @@
- 65 81 66
+ rgba()
|
@@ -242,7 +242,7 @@
- 196 41 46
+ rgba()
|
@@ -259,7 +259,7 @@
- 0 0 0
+ rgba()
|
@@ -276,7 +276,7 @@
- 0 0 11
+ rgba()
|
@@ -294,7 +294,7 @@
- 0 0 29
+ rgba()
|
@@ -311,7 +311,7 @@
- 0 0 56
+ rgba()
|
@@ -331,7 +331,7 @@
- 0 0 94
+ rgba()
|
@@ -349,7 +349,7 @@
- 195 29 97
+ rgba()
|
@@ -368,7 +368,7 @@
- 0 0 100
+ decimal rgba(255,255,255,1) % rgb(100,100,100)
|
diff --git a/src/app/custom/themes/istex/colorsTheme.js b/src/app/custom/themes/istex/colorsTheme.js
deleted file mode 100644
index cc9cbda89..000000000
--- a/src/app/custom/themes/istex/colorsTheme.js
+++ /dev/null
@@ -1,41 +0,0 @@
-export default {
- black: {
- primary: '#1D1D1D',
- secondary: '#4A4A4A',
- veryDark: '#000',
- dark: '#555',
- light: '#8F8F8F',
- lighter: '#F0F0F0',
- veryLight: '#F6F9FA',
- transparent: 'rgba(0, 0, 0, .1)',
- },
- white: {
- primary: '#fff',
- transparent: 'rgba(255, 255, 255, .1)',
- light: '#F0F0F0',
- },
- gray: {
- primary: '#e0e0e0',
- },
- red: {
- primary: '#f44336',
- },
- green: {
- primary: '#C4D733',
- secondary: '#779e04',
- tertiary: '#E5F949',
- light: 'rgba(196, 215, 51, 0.5)',
- },
- purple: {
- primary: '#c4d733',
- },
- orange: {
- primary: '#f48022',
- },
- blue: {
- primary: '#458CA5',
- secondary: '#337288',
- tertiary: '#59A7C2',
- light: '#F6F9FA',
- },
-};
diff --git a/src/app/custom/themes/istex/css/istex-internalclass.css b/src/app/custom/themes/istex/css/istex-internalclass.css
index 65fa74034..9f4d93e9c 100644
--- a/src/app/custom/themes/istex/css/istex-internalclass.css
+++ b/src/app/custom/themes/istex/css/istex-internalclass.css
@@ -2,7 +2,7 @@
/*div[class*='HomeContentSidebar'] */
/* fond blanc casse + decor */
div[class*='HomeContentSidebar'] {
- background-color: var(--neutral-dark-very-light);
+ background-color: var(--primary-very-light);
background-image: url('../img/svgfond.svg');
background-repeat: repeat-x;
background-position: bottom center;
@@ -61,82 +61,85 @@ span.property_label:empty {
/* home ou resource */
/* liste en pave */
/********************/
-[class*='ListePave'] div.property_value_container:first-child {
- padding: 0 !important;
-}
-.body [class*='ListePave'] :is(ul, li) {
- padding: 0;
- margin: 0;
-}
-.body [class*='ListePave'] ul {
+/* ul istex en pave*/
+/* syndication*/
+div[class*='ListePave'] ul,
+ul.resources-grid-list {
display: flex;
flex-wrap: wrap;
- gap: 12px;
+ gap: 20px;
+ list-style-type: none;
+ padding: 0;
+ margin: 0;
+ margin-bottom: 3rem !important;
}
-/*avec liste syndication*/
-div.property_value_container li[class*='item'],
-[class*='ListePave'] div.property_value_container li div {
+/*reset lodex style*/
+div[class*='ListePave'] li *,
+li.resources-grid-item,
+li.resources-grid-item * {
+ padding: 0;
+ margin: 0;
background: transparent;
box-shadow: none;
border: 0px;
- width: auto;
+ text-decoration: none !important;
}
-[class*='ListePave'] div.property_value_container li div[class*='wrapper'] {
- padding: 0rem;
+div[class*='ListePave'] li,
+li.resources-grid-item {
+ width: 330px;
+ height: 100px;
+ border-radius: 4px;
+ padding: 2rem !important;
}
-[class*='ListePave'] li a {
+div[class*='ListePave'] li a,
+li.resources-grid-item a {
display: block;
- width: 325px;
- min-height: 80px;
- padding: 1.3rem;
- background-color: var(--primary-light);
- border: 1px solid var(--primary-main);
- border-radius: 4px;
+ overflow: hidden;
}
-[class*='ListePave'] li a > div {
+[class*='ListePave'] li a > div,
+li.resources-grid-item a > div {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
+ gap: 5px;
}
+/*liste pave general*/
+[class*='ListePave'] li {
+ background-color: var(--primary-very-light);
+ border: 1px solid var(--primary-main);
+ padding: 1.3rem !important;
+ display: flex;
+}
+/*[class*='ListePave'] li a {
+}*/
/* titre du bloc toutes liste */
[class*='ListePave'] a div[class*='contentTitle'] {
flex: 1;
font-family: var(--font-titre);
- color: var(--primary-main);
+ color: var(--text-main);
font-weight: 700;
font-size: 1.6rem;
}
-/*liste pave dans designHomeContent*/
-div[class*='HomeContentSidebar']
- div[class*='designHomeContent']
+/*********************/
+/* liste pave dans */
+/* designHomeContent */
+/*********************/
+div[class*='designHomeContent']
/* [class*='ListePave']*/
- li
- a {
+ li {
background-color: var(--contrast-light);
border-color: var(--contrast-light);
+ padding: 2rem;
}
-div[class*='HomeContentSidebar']
- div[class*='designHomeContent']
- /* [class*='ListePave']*/
- div.property_value_container
- li
- a
- > div {
- display: flex;
- flex-direction: column;
- gap: 0 2px;
-}
-div[class*='HomeContentSidebar']
- div[class*='designHomeContent']
+div[class*='designHomeContent']
/* [class*='ListePave']*/
- a
+ li a
div[class*='contentTitle'] {
background: var(--contrast-light) url('../img/fleched.svg') no-repeat center
right 1.3rem;
}
-div[class*='HomeContentSidebar']
- div[class*='designHomeContent']
+div[class*='designHomeContent']
/* [class*='ListePave']*/
div.property_value_container
li
@@ -144,6 +147,14 @@ div[class*='HomeContentSidebar']
div[class*='contentParagraph'] {
flex: 2;
}
+/*titre dans homecontent*/
+div[class*='designHomeContent']
+ div.property_value_container
+ li
+ a
+ div[class*='contentTitle'] {
+ color: var(--primary-main);
+}
/******************/
/* home ISTEX */
/* design sidebar */
@@ -204,7 +215,7 @@ div[class*='HomeCompteur'] div.content {
.dataset-characteristics div[class*='HomeSidebar'] img:last-child {
filter: opacity(90%);
}
-/* tdm tools home*/
+/* for home sidebar img */
.design-filter {
filter: opacity(90%);
}
@@ -283,6 +294,7 @@ div[class*='HomeCompteur'] div.content {
/*istex home promo*/
/* galaxieIstex */
+/* #TODO faire template ejs */
div[class*='designHomeGalaxieIstex'] {
width: 100vw !important;
background-image: url(../img/galaxie-istex-1.jpg);
@@ -363,7 +375,7 @@ div[class*='ResourceCompose'],
}
/*champs composés*/
div[class*='ResourceCompose'] {
- background-color: var(--primary-light);
+ background-color: var(--primary-very-light);
flex: 2.79;
}
/*titre*/
@@ -380,7 +392,7 @@ div[class*='ResourceCompose'] .property_value_container > div > div > div {
margin-left: 0 !important;
border-left: 0px !important;
padding: 0 !important;
- background-color: var(--primary-light);
+ background-color: var(--primary-very-light);
}
div[class*='ResourceCompose'] div.property {
margin: 0rem auto;
diff --git a/src/app/custom/themes/istex/css/istex-linksclass.css b/src/app/custom/themes/istex/css/istex-linksclass.css
index 7b8641b23..39212bef2 100644
--- a/src/app/custom/themes/istex/css/istex-linksclass.css
+++ b/src/app/custom/themes/istex/css/istex-linksclass.css
@@ -1,24 +1,27 @@
+:root {
+ /*couleur icon lien et bouton*/
+ --filtreBleuMain: invert(55%) sepia(9%) saturate(2387%) hue-rotate(150deg)
+ brightness(88%) contrast(81%);
+ --filtreBleuHoverFocus: invert(39%) sepia(60%) saturate(480%)
+ hue-rotate(150deg) brightness(90%) contrast(85%);
+ --filtreBleuActive: invert(24%) sepia(74%) saturate(509%) hue-rotate(150deg)
+ brightness(99%) contrast(88%);
+ --filtreBlancLight: invert(88%) sepia(54%) saturate(7152%)
+ hue-rotate(182deg) brightness(124%) contrast(89%);
+ --filtreBlancMainHFA: invert(100%) sepia(100%) saturate(0%)
+ hue-rotate(327deg) brightness(107%) contrast(101%);
+}
/* lien du content*/
-.body > div:last-child a {
+#content a {
text-decoration: underline;
}
/*a avec url comme texte*/
-.property div[class*="designHomeSidebar"] a.property_value {
+.property div[class*='designHomeSidebar'] a.property_value {
overflow-wrap: anywhere !important;
word-break: break-all !important;
hyphens: auto;
width: inherit;
}
-/*lien externe icone couleur position*/
-.property a:not(:empty)[target="_blank"] {
- display: inline-flex;
-}
-.property a:not(:empty)[target="_blank"]::after {
- filter: invert(55%) sepia(9%) saturate(2387%) hue-rotate(150deg)
- brightness(88%) contrast(81%);
- color: black;
- display: inline-block;
-}
/* link in text fond clair*/
.property a {
color: var(--primary-main);
@@ -30,56 +33,61 @@
.property a:active {
color: var(--link-dark);
}
-/*link externe in text fond clair*/
-.property a:not(:empty, .property_value)[target="_blank"]::after {
- content: url("../img/suivre-le-lien-nouvel-onglet.png");
+/*lien externe icone couleur position*/
+.property a:not(:empty)[target='_blank'] {
+ display: inline-flex;
+}
+.property a:not(:empty)[target='_blank']::after,
+div[class*='Icon'] a::after {
+ filter: var(--filtreBleuMain);
+ color: black;
+ display: inline-block;
+}
+/*link ext hover focus*/
+.property a:not(:empty, .property_value)[target='_blank']::after {
+ content: url('../img/suivre-le-lien-nouvel-onglet.png');
padding-left: 5px;
}
-.property a:is(:hover, :focus):not(:empty)[target="_blank"]::after,
-div[class*="Icon"] a:is(:hover, :focus)::after {
- filter: invert(39%) sepia(60%) saturate(480%) hue-rotate(150deg)
- brightness(90%) contrast(85%);
+.property a:is(:hover, :focus):not(:empty)[target='_blank']::after,
+div[class*='Icon'] a:is(:hover, :focus)::after {
+ filter: var(--filtreBleuHoverFocus);
color: black;
}
-.property a:active:not(:empty, .property_value)[target="_blank"]::after,
-div[class*="Icon"] a:active::after {
- filter: invert(24%) sepia(74%) saturate(509%) hue-rotate(150deg)
- brightness(99%) contrast(88%);
+.property a:active:not(:empty, .property_value)[target='_blank']::after,
+div[class*='Icon'] a:active::after {
+ filter: var(--filtreBleuActive);
color: black;
}
/*link in text fond sombre*/
/*lien externe icon*/
-div[class*="HomeSidebar"] a {
+div[class*='HomeSidebar'] a {
color: var(--contrast-light);
}
-div[class*="HomeSidebar"] a:is(:hover, :focus, :active) {
+div[class*='HomeSidebar'] a:is(:hover, :focus, :active) {
color: var(--contrast-main);
}
/*link externe in text fond sombre*/
/*link externe icon */
-div[class*="HomeSidebar"] a:not(:empty)[target="_blank"]::after,
-div[class*="HomeSidebar"] div[class*="Icon"] a::after {
- filter: invert(88%) sepia(54%) saturate(7152%) hue-rotate(182deg)
- brightness(124%) contrast(89%);
+div[class*='HomeSidebar'] a:not(:empty)[target='_blank']::after,
+div[class*='HomeSidebar'] div[class*='Icon'] a::after {
+ filter: var(--filtreBlancLight);
color: black;
}
-div[class*="HomeSidebar"]
- a:is(:hover, :focus, :active):not(:empty)[target="_blank"]::after,
-div[class*="HomeSidebar"]
- div[class*="Icon"]
+div[class*='HomeSidebar']
+ a:is(:hover, :focus, :active):not(:empty)[target='_blank']::after,
+div[class*='HomeSidebar']
+ div[class*='Icon']
a:is(:hover, :focus, :active)::after {
- filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(327deg)
- brightness(107%) contrast(101%);
+ filter: var(--filtreBlancMainHFA);
color: black;
}
-/*linkIcon = bloc ? */
-
-/************************/
-/* linkIcon & bouton */
-/************************/
+/*******************/
+/* boutons & links */
+/* prim,sec,ombre */
+/*******************/
/* la forme */
-div[class*="LinkIcon"] a.property_value,
-div[class*="Bouton"] a.property_value {
+div[class*='LinkIcon'] a.property_value,
+div[class*='Bouton'] a.property_value {
font-family: var(--font-texte);
font-size: 16px !important;
text-decoration: none !important;
@@ -89,109 +97,149 @@ div[class*="Bouton"] a.property_value {
line-height: auto;
display: inline-flex;
}
-div[class*="LinkIcon"] a.property_value {
+div[class*='LinkIcon'] a.property_value {
font-weight: 700;
padding-right: 20px;
}
-div[class*="Bouton"] a.property_value {
+div[class*='Bouton'] a.property_value {
font-family: var(--font-texte);
border: 1px solid transparent;
border-radius: 8px;
cursor: pointer;
padding: 12px 20px;
}
-div[class*="BoutonOmbre"] a.property_value {
+div[class*='BoutonOmbre'] a.property_value {
border: none !important;
box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.15);
}
/*avec Icon*/
-div[class*="Icon"] a.property_value {
+div[class*='Icon'] a.property_value {
display: inline-flex;
gap: 10px;
padding-right: 20px;
padding-left: 20px;
}
-div[class*="Icon"] a.property_value::after {
+div[class*='Icon'] a.property_value::after {
color: black;
}
/*Icon fleche droite */
-div[class*="IconFlecheDroite"] a.property_value.link::after {
- content: url("../img/fleche-petite-droite.png");
+div[class*='IconFlecheDroite'] a.property_value.link::after {
+ content: url('../img/fleche-petite-droite.png');
}
/*Icon chevron droit*/
-div[class*="IconChevronDroit"] a.property_value::after {
- content: url("../img/chevron-droit.png");
+div[class*='IconChevronDroit'] a.property_value::after {
+ content: url('../img/chevron-droit.png');
}
/*couleurs + bordures fond clair*/
/* couleurs */
/*BoutonPrimaire*/
-div[class*="BoutonPrimaire"] a.property_value {
+div[class*='BoutonPrimaire'] a.property_value {
color: var(--contrast-light);
background-color: var(--primary-main) !important;
}
/* les autres */
-div[class*="Bouton"] a.property_value {
- background-color: var(--contrast-light);
+div[class*='Bouton'] a.property_value {
+ background-color: transparent;
}
/*bordure : BoutonPrimaire Bouton secondaire*/
-div[class*="Bouton"] a.property_value {
+div[class*='Bouton'] a.property_value {
border: 1px solid var(--primary-main) !important;
}
/*hover&focus&active Bouton*/
-div:is([class*="BoutonPrimaire"], [class*="BoutonSecondaire"])
+div:is([class*='BoutonPrimaire'], [class*='BoutonSecondaire'])
a.property_value:is(:hover, :focus) {
color: var(--contrast-main);
background-color: var(--link-secondary) !important;
border-color: var(--link-secondary) !important;
}
-div[class*="BoutonOmbre"] a.property_value:is(:hover, :focus) {
+div[class*='BoutonOmbre'] a.property_value:is(:hover, :focus) {
background-color: var(--neutral-dark-very-light) !important;
}
/*tous les boutons actifs fond clair*/
-div[class*="Bouton"] a.property_value:active {
+div[class*='Bouton'] a.property_value:active {
color: var(--contrast-main);
background-color: var(--link-dark) !important;
border-color: var(--link-dark) !important;
}
+/*boutonIcon - linkIcon */
+/*spec*/
+/*fond clair*/
+div[class*='BoutonPrimaire'][class*='Icon'] a.property_value::after {
+ filter: var(--filtreBlancLight);
+}
+/*les autres = idem link externe + icon*/
+
+/*fond clair icon*/
+/*hover&focus*/ /*&active*/
+.property[class*='Bouton'][class*='Icon'] a:is(:hover, :focus)::after {
+ filter: var(--filtreBlancLight);
+ color: black;
+}
+/*[class*='Bouton'][class*='Icon'] a:active:not(:empty)[target='_blank']::after,*/
+[class*='Bouton'][class*='Icon'] a:active::after {
+ filter: var(--filtreBlancMainHFA);
+ color: black;
+}
/*couleurs + bordures fond sombre*/
/* couleurs */
/*BoutonPrimaire*/
-div[class*="BoutonPrimaire"] a.property_value {
+div[class*='HomeSidebar'] div[class*='BoutonPrimaire'] a.property_value {
color: var(--primary-main);
background-color: var(--contrast-light);
border: 1px solid var(--contrast-light);
}
/* les autres */
-div[class*="HomeSidebar"]
- div:is([class*="LinkIcon"], [class*="Bouton"])
+div[class*='HomeSidebar']
+ div:is([class*='LinkIcon'], [class*='Bouton'])
a.property_value {
background-color: transparent;
}
/*bordure : Bouton secondaire*/
-div[class*="HomeSidebar"] div[class*="BoutonSecondaire"] a.property_value {
+div[class*='HomeSidebar'] div[class*='BoutonSecondaire'] a.property_value {
border: 1px solid var(--contrast-light) !important;
}
/*hover&focus&active*/
-div[class*="BoutonPrimaire"] a:is(:hover, :focus).property_value {
+div[class*='BoutonPrimaire'] a:is(:hover, :focus).property_value {
color: var(--contrast-main) !important;
background-color: var(--link-secondary) !important;
border: 1px solid var(--link-secondary) !important;
}
-div[class*="BoutonPrimaire"] a.property_value:active {
+div[class*='BoutonPrimaire'] a.property_value:active {
color: var(--contrast-main);
background-color: var(--link-dark) !important;
border: 1px solid var(--link-secondary) !important;
}
/*les autres*/
-div[class*="HomeSidebar"]
- div[class*="BoutonSecondaire"]
+div[class*='HomeSidebar']
+ div[class*='BoutonSecondaire']
a:is(:hover, :focus, :active).property_value {
border-color: var(--contrast-main);
}
+
+/*boutonIcon - linkIcon */
+/*fond sombre*/
+/*div[class*='BoutonPrimaire'] = idem que fond clair*/
+
+/*les autres*/
+div[class*='HomeSidebar']
+ div[class*='Bouton'][class*='Icon']
+ a.property_value::after {
+ filter: var(--filtreBlancLight);
+ color: black;
+}
+/*fond sombre icon*/
+/*hover&focus&active*/
+div[class*='HomeSidebar']
+ [class*='Bouton'][class*='Icon']
+ a:is(:hover, :focus, :active):not(:empty)[target='_blank']::after,
+[class*='Bouton'][class*='Icon'] a:is(:hover, :focus, :active)::after {
+ filter: var(--filtreBlancMainHFA);
+ color: black;
+}
/*********************/
/*liste liens en pave*/
/*********************/
-[class*="ListePave"] div.property_value_container a {
+[class*='ListePave'] div.property_value_container a {
text-decoration: none;
}
/*home designHomeContent*/
diff --git a/src/app/custom/themes/istex/css/istex.css b/src/app/custom/themes/istex/css/istex.css
index a6083c2fd..528a11dc8 100644
--- a/src/app/custom/themes/istex/css/istex.css
+++ b/src/app/custom/themes/istex/css/istex.css
@@ -13,7 +13,7 @@
@font-face {
font-family: 'Montserrat';
src:
- local('Montserrat'),
+ local('Montserrat Medium'),
url('/themes/istex/fonts/Montserrat/Montserrat-Medium.ttf')
format('truetype');
font-style: normal;
@@ -65,10 +65,30 @@ body {
}
:root {
--font-titre: Montserrat, Arial, Helvetica, sans-serif;
+ --font-titre-medium: Montserrat Medium, Arial, Helvetica, sans-serif;
--font-texte: Inter, Arial, Helvetica, sans-serif;
--maxWidth: 1700px; /* .css-19r6kue-MuiContainer-root 19.08.2024*/
-}
-/*otdm2023.css pour header footer*/
+
+ --canard0: #458ca5; /*canard 0 */
+ --canard-1: #31768f; /*canard -1*/
+ --canard-2: #1a5a71; /*canard -2*/
+ --canard1: #69a1b6; /*canard 1*/
+ --canard2: #8fbac9; /*canard 2*/
+ --canard3: #f6f9fa; /* background*/
+
+ --lime0: #c4d733; /*lime 0*/
+ --lime1: #e3ef63; /*lime 1*/
+ --lime2: #f9fbeb; /*lime 2*/
+ --lime-1: #a9bb1e; /*lime -1*/
+
+ --black: #000000;
+ --gris0: #1d1d1d; /*gris 0*/
+ --gris1: #fafafa; /*gris 1*/
+ --gris2: #8f8f8f; /*gris 2*/
+ --gris3: #f0f0f0; /*gris 3*/
+ --white: #ffffff;
+}
+/*class pour header footer*/
.flexrow {
display: flex;
flex-direction: row;
@@ -245,7 +265,7 @@ footer.site-footer::after {
margin-top: 30px;
}
.footer4.container {
- color: var(--neutral-dark-light);
+ color: var(--neutral-dark-main);
text-align: center;
padding: 30px;
}
@@ -277,12 +297,16 @@ footer.site-footer::after {
max-width: 100% !important;
padding: 0 0 !important;
}
-#content > div.container div:is(.graph-page.graph-container, .resource) {
+div:is(.graph-page.graph-container, .resource, .drawer) {
width: 100%;
max-width: var(--maxWidth) !important;
min-width: 360px;
- padding: 0 10px;
- margin: 0 auto 4rem;
+ padding: 2rem 5% 4rem;
+ margin: 0 auto 0;
+}
+div.drawer {
+ padding: 2rem 5% !important;
+ margin: 0 auto 0;
}
/*stucture pour home-page*/
/*property_label_container*/
@@ -348,22 +372,18 @@ nav.nav-bar-menu div.nav-bar-container > img {
}
#content h2 {
font-size: 2.8rem;
- line-height: 3rem;
font-weight: 700;
margin-block-end: 0.5em;
}
#content h3 {
font-size: 2.2rem;
- line-height: 3rem;
}
#content h4 {
font-size: 2rem;
- line-height: 2.8rem;
font-style: italic;
}
#content h5 {
font-size: 1.8rem;
- line-height: 2.6rem;
font-style: italic;
}
#content h6 {
@@ -386,9 +406,9 @@ a img {
/*links&alikebutton see*/
/*istex-linksclass.css*/
-/*.body liste*/
-.body ul,
-.body ol {
+/*#content liste*/
+#content ul,
+#content ol {
margin-inline-start: 0px;
margin-bottom: 10px;
}
@@ -422,7 +442,7 @@ a img {
}
* input,
* textarea {
- color: var(--neutral-dark-light) !important;
+ color: var(--neutral-dark-main) !important;
}
* label {
color: var(--text-main);
@@ -484,17 +504,6 @@ span.property_label[style*='color: rgb(158, 158, 158)']:not(:empty) {
#content span.property_scheme a {
text-decoration: none;
}
-/* ul istex */
-.resources-grid-list {
- list-style-type: none;
- display: flex;
- gap: 20px;
- margin-bottom: 3rem !important;
-}
-.resources-grid-item {
- padding: 0 !important;
- margin: 0 !important;
-}
/*input search*/
.searchbar-container .MuiOutlinedInput-root fieldset,
.searchbar-container .MuiOutlinedInput-root fieldset:hover,
@@ -524,23 +533,9 @@ span.property_label[style*='color: rgb(158, 158, 158)']:not(:empty) {
#version .container strong {
font-weight: bold !important;
}
-/***********/
-/*
-/*************************/
-/* design Home bottom */
-/* full screen */
-/* content fond et promo */
-/*************************/
-/* #home-page {
- position: relative;
- left: 0;
- width: 100vw;
-} */
-/*****************************/
-/* .drawer .search-container */
-/* .graph-container */
-/* input search - facets */
-/*****************************/
+/***************************/
+/* search facettes results */
+/***************************/
/*comme .graph-container*/
.search-container {
margin-top: 3rem !important;
@@ -564,7 +559,7 @@ span.property_label[style*='color: rgb(158, 158, 158)']:not(:empty) {
}
/*stats graph*/
.graph-header .graph-advanced {
- max-width: 100%;
+ max-width: 875px;
}
.graph-header .graph-advanced .stats {
min-width: 400px;
@@ -586,7 +581,7 @@ span.property_label[style*='color: rgb(158, 158, 158)']:not(:empty) {
ul.MuiList-root.facets-list {
display: flex;
flex-direction: column;
- background-color: var(--neutral-dark-very-light);
+ background-color: var(--primary-very-light);
border-radius: 4px;
min-width: 370px !important;
padding-bottom: 8px !important;
@@ -620,7 +615,7 @@ ul.MuiList-root.facets-list > li .facet-value-list svg {
}
/*****************************/
/* Recherche results */
-/* .drawer .search-container */
+/* = .drawer .search-container */
/* ***************************/
/*stats + tris*/
.search-results > div > div {
@@ -635,7 +630,7 @@ ul.MuiList-root.facets-list > li .facet-value-list svg {
gap: 16px;
}
/*a.search-result-link*/
-#content .search-result-list-container a {
+.search-result-list-container a {
text-decoration: none;
flex: 1 0 325px;
color: rgb(74, 74, 74);
@@ -643,7 +638,7 @@ ul.MuiList-root.facets-list > li .facet-value-list svg {
border-radius: 5px;
border: 1px solid var(--primary-main);
overflow: hidden;
- background-color: var(--neutral-dark-very-light);
+ background-color: var(--primary-very-light);
display: flex;
flex-direction: column;
width: 48%;
@@ -668,6 +663,12 @@ ul.MuiList-root.facets-list > li .facet-value-list svg {
/* page resource */
/*****************/
/*general*/
+.resource .nav-button-root {
+ background-color: rgba(100%, 100%, 100%, 0.8);
+}
+.resource .nav-button-root:is(:hover, focus, :active) {
+ background-color: rgba(100%, 100%, 100%, 1);
+}
/*labels en noir et soulignes*/
.resource
.property
@@ -705,7 +706,6 @@ ul.MuiList-root.facets-list > li .facet-value-list svg {
}
/*bloc header-resource-section*/
.header-resource-section .property * {
- color: var(--text-main);
padding-left: 1rem;
}
/* resource titre*/
@@ -767,6 +767,9 @@ ul.MuiList-root.facets-list > li .facet-value-list svg {
.menuIstex {
height: 68px;
}
+ .resource {
+ padding: 0 4rem !important;
+ }
}
@media screen and (max-width: 530px) {
.banner {
diff --git a/src/app/custom/themes/istex/img/actu/corpus-supraconducteur.jpg b/src/app/custom/themes/istex/img/actu/corpus-supraconducteur.jpg
new file mode 100644
index 000000000..a5d48c506
Binary files /dev/null and b/src/app/custom/themes/istex/img/actu/corpus-supraconducteur.jpg differ
diff --git a/src/app/custom/themes/istex/img/chevron-droit-blanc.png b/src/app/custom/themes/istex/img/chevron-droit-blanc.png
new file mode 100644
index 000000000..5962da50a
Binary files /dev/null and b/src/app/custom/themes/istex/img/chevron-droit-blanc.png differ
diff --git a/src/app/custom/themes/istex/img/chevron-droit-blanc.png:Zone.Identifier b/src/app/custom/themes/istex/img/chevron-droit-blanc.png:Zone.Identifier
new file mode 100644
index 000000000..053d1127c
--- /dev/null
+++ b/src/app/custom/themes/istex/img/chevron-droit-blanc.png:Zone.Identifier
@@ -0,0 +1,3 @@
+[ZoneTransfer]
+ZoneId=3
+HostUrl=about:internet
diff --git a/src/app/custom/themes/istex/img/chevron-droit.png b/src/app/custom/themes/istex/img/chevron-droit.png
index cb847698b..f6570f2b0 100644
Binary files a/src/app/custom/themes/istex/img/chevron-droit.png and b/src/app/custom/themes/istex/img/chevron-droit.png differ
diff --git a/src/app/custom/themes/istex/img/chevron-droit.png:Zone.Identifier b/src/app/custom/themes/istex/img/chevron-droit.png:Zone.Identifier
new file mode 100644
index 000000000..053d1127c
--- /dev/null
+++ b/src/app/custom/themes/istex/img/chevron-droit.png:Zone.Identifier
@@ -0,0 +1,3 @@
+[ZoneTransfer]
+ZoneId=3
+HostUrl=about:internet
diff --git a/src/app/custom/themes/istex/img/chevron-droit.svg b/src/app/custom/themes/istex/img/chevron-droit.svg
new file mode 100644
index 000000000..05c5eeede
--- /dev/null
+++ b/src/app/custom/themes/istex/img/chevron-droit.svg
@@ -0,0 +1,3 @@
+
\ No newline at end of file
diff --git a/src/app/custom/themes/istex/img/chevron-droit.svg:Zone.Identifier b/src/app/custom/themes/istex/img/chevron-droit.svg:Zone.Identifier
new file mode 100644
index 000000000..053d1127c
--- /dev/null
+++ b/src/app/custom/themes/istex/img/chevron-droit.svg:Zone.Identifier
@@ -0,0 +1,3 @@
+[ZoneTransfer]
+ZoneId=3
+HostUrl=about:internet
diff --git a/src/app/custom/themes/istex/img/fleche-petite-droite-blanc.png b/src/app/custom/themes/istex/img/fleche-petite-droite-blanc.png
new file mode 100644
index 000000000..4a1766f31
Binary files /dev/null and b/src/app/custom/themes/istex/img/fleche-petite-droite-blanc.png differ
diff --git a/src/app/custom/themes/istex/img/fleche-petite-droite-blanc.png:Zone.Identifier b/src/app/custom/themes/istex/img/fleche-petite-droite-blanc.png:Zone.Identifier
new file mode 100644
index 000000000..053d1127c
--- /dev/null
+++ b/src/app/custom/themes/istex/img/fleche-petite-droite-blanc.png:Zone.Identifier
@@ -0,0 +1,3 @@
+[ZoneTransfer]
+ZoneId=3
+HostUrl=about:internet
diff --git a/src/app/custom/themes/istex/img/fleche-petite-droite-bleu.png b/src/app/custom/themes/istex/img/fleche-petite-droite-bleu.png
new file mode 100644
index 000000000..490307078
Binary files /dev/null and b/src/app/custom/themes/istex/img/fleche-petite-droite-bleu.png differ
diff --git a/src/app/custom/themes/istex/img/fleche-petite-droite.png:Zone.Identifier b/src/app/custom/themes/istex/img/fleche-petite-droite.png:Zone.Identifier
new file mode 100644
index 000000000..053d1127c
--- /dev/null
+++ b/src/app/custom/themes/istex/img/fleche-petite-droite.png:Zone.Identifier
@@ -0,0 +1,3 @@
+[ZoneTransfer]
+ZoneId=3
+HostUrl=about:internet
diff --git a/src/app/custom/themes/istex/img/suivre-le-lien-nouvel-onglet(1).png:Zone.Identifier b/src/app/custom/themes/istex/img/suivre-le-lien-nouvel-onglet(1).png:Zone.Identifier
new file mode 100644
index 000000000..053d1127c
--- /dev/null
+++ b/src/app/custom/themes/istex/img/suivre-le-lien-nouvel-onglet(1).png:Zone.Identifier
@@ -0,0 +1,3 @@
+[ZoneTransfer]
+ZoneId=3
+HostUrl=about:internet
diff --git a/src/app/custom/themes/istex/img/suivre-le-lien-nouvel-onglet.png b/src/app/custom/themes/istex/img/suivre-le-lien-nouvel-onglet.png
new file mode 100644
index 000000000..2ac32c755
Binary files /dev/null and b/src/app/custom/themes/istex/img/suivre-le-lien-nouvel-onglet.png differ
diff --git a/src/app/custom/themes/istex/img/suivre-le-lien-nouvel-onglet.png:Zone.Identifier b/src/app/custom/themes/istex/img/suivre-le-lien-nouvel-onglet.png:Zone.Identifier
new file mode 100644
index 000000000..053d1127c
--- /dev/null
+++ b/src/app/custom/themes/istex/img/suivre-le-lien-nouvel-onglet.png:Zone.Identifier
@@ -0,0 +1,3 @@
+[ZoneTransfer]
+ZoneId=3
+HostUrl=about:internet
diff --git a/src/app/custom/themes/istex/istexTheme.js b/src/app/custom/themes/istex/istexTheme.js
index c21686422..8870d10c6 100644
--- a/src/app/custom/themes/istex/istexTheme.js
+++ b/src/app/custom/themes/istex/istexTheme.js
@@ -12,17 +12,44 @@
* https://zenoo.github.io/mui-theme-creator/
* @type {import('@mui/material/styles').Theme['palette']}
*/
+
+/*canard: {
+ primary: '#458CA5', //canard 0
+ dark: '#31768f', //canard -1
+ darker: '#1a5a71', //canard -2
+ light: '#69A1B6', //canard 1
+ lighter: '#8FBAC9', //canard 2
+ background: '#F6F9FA', //canard 3
+},
+lime: {
+ primary: '#C4D733', //lime 0
+ light: '#E3EF63', //lime 1
+ lighter: '#F9FBEB', //lime 2
+ dark: '#A9BB1E', //lime -1
+},
+gris: {
+ black: '#000000',
+ dark: '#1D1D1D', //gris 0
+ main: '#FAFAFA', //gris 1
+ light: '#8F8F8F', //gris 2
+ lighter: '#F0F0F0', //gris 3
+ white: '#FFFFFF',
+},*/
const palette = {
mode: 'light',
primary: {
main: '#458cA5',
- secondary: '#31768F' /*secondary: '#337288' */,
- light: '#f4f9fa',
+ secondary: '#31768F',
+ light: '#69A1B6',
+ lighter: '#8FBAC9',
+ veryLight: '#f6f9fa',
contrastText: '#fff',
},
secondary: {
- main: '#AABF23',
- contrastText: '#f0f0f0',
+ main: '#A9BB1E',
+ light: '#E3EF63',
+ lighter: '#F9FBEB',
+ contrastText: '#fff',
},
info: {
main: '#C4D733',
@@ -37,37 +64,36 @@ const palette = {
contrastText: '#fff',
},
success: {
- main: '#AABF23',
- contrastText: '#f0f0f0',
+ main: '#A9BB1E',
+ contrastText: '#fff',
},
text: {
primary: '#1d1d1d',
main: '#4a4a4a',
},
- contrastThreshold: 3, // Mui default (we need to look if is pertinent to change it)
// Do not exist in mui / Custom variable
danger: {
main: '#f44336',
contrastText: '#fff',
},
- neutral: {
- main: '#e0e0e0',
- },
+ contrastThreshold: 4.1, // Mui default 3
// Use mui palette.grey ???
neutralDark: {
- main: '#555',
+ main: '#8f8f8f',
secondary: '#4a4a4a',
- veryDark: '#000',
- dark: '#555',
- light: '#8f8f8f',
- lighter: '#f0f0f0',
- veryLight: '#f6f9fa',
- transparent: 'rgba(0, 0, 0, .1)',
+ dark: '#1D1D1D',
+ light: '#f0f0f0',
+ lighter: '#f6f9fa',
+ transparent: 'rgba(0, 0, 0, 0.01)',
},
contrast: {
main: '#fff',
light: '#f0f0f0',
},
+ link: {
+ secondary: '#31768f',
+ dark: '#1a5a71',
+ },
};
export default {
diff --git a/src/app/custom/themes/voscouleurs/css/styles.css b/src/app/custom/themes/voscouleurs/css/styles.css
index e6ea94286..252ff4fd0 100644
--- a/src/app/custom/themes/voscouleurs/css/styles.css
+++ b/src/app/custom/themes/voscouleurs/css/styles.css
@@ -50,7 +50,7 @@ body {
header {
background: var(--bgHeader);
}
-header #banner {
+header #banner.container {
display: flex;
flex-wrap: nowrap;
align-items: center;
@@ -74,12 +74,25 @@ header #banner :last-child {
#banner p {
font-weight: 500;
}
+/*structure lodex*/
+.container,
+.container-fluid {
+ width: 100%;
+ max-width: var(--maxWidthXl);
+ margin-right: auto;
+ margin-left: auto;
+ padding-left: 0.5rem;
+ padding-right: 0.5rem;
+}
/*bgContent*/
-#root {
- box-sizing: content-box;
- padding: 0 50px;
+#content .container {
+ padding: 30px 50px !important;
background-color: var(--bgContent);
}
+.drawer .search-content {
+ padding-left: 1rem;
+ padding-right: 1rem;
+}
/*bgFacet : facet search et graph*/
.search-content ul.search-facets,
.graph-facets {
@@ -167,24 +180,52 @@ a.graph-link.graph-summary-link:hover {
.MuiButton-textPrimary:hover svg {
background-color: var(--bgContrast) !important;
}
+/*facettes : search in facettes*/
+.css-134m6vv-MuiInputBase-root-MuiInput-root::after {
+ border-bottom-color: var(--buttonHover) !important;
+}
/*background search content*/
div._1eoh2kv.search-content {
background-color: var(--bgContent);
}
/*fieldset active*/
fieldset.MuiOutlinedInput-notchedOutline {
- border-color: var(--button) !important;
+ border-color: var(--icon) !important;
+}
+.Mui-focused fieldset.MuiOutlinedInput-notchedOutline {
+ border-color: var(--iconHover) !important;
}
.MuiListItemText-secondary {
background-color: #fff;
}
-
-/*structure lodex*/
-.container,
-.container-fluid {
- width: var(--maxWidthXl);
- margin-right: auto;
- margin-left: auto;
- padding-left: 0.5rem;
- padding-right: 0.5rem;
+/*resource feuilletage*/
+.resource .nav-button-root {
+ background-color: var(--grey-200) !important;
+ color: var(--button) !important;
+}
+.resource .nav-button-root svg {
+ fill: var(--button) !important;
+}
+.resource .nav-button-root:is(:hover, :focus, :active) {
+ background-color: var(--grey-100) !important;
+ color: var(--buttonHover) !important;
+}
+.resource .nav-button-root:is(:hover, :focus, :active) svg {
+ fill: var(--buttonHover) !important;
+}
+/*resource : title*/
+.header-resource-section .property_value_container > div > div > :first-child {
+ font-weight: 600;
+ font-size: 1.3rem;
+ line-height: 1.5rem;
+}
+/*resource space property*/
+.resource .property {
+ padding: 0 0.5rem 0 !important;
+}
+.resource .property .css-oa9bdm {
+ padding: 0 0 0 0 !important;
+}
+.resource .property .property_value_container ul {
+ margin: 0 0 0.5rem !important;
}
diff --git a/src/app/custom/themes/voscouleurs/index.ejs b/src/app/custom/themes/voscouleurs/index.ejs
index 4965d755a..46cf1e4cd 100644
--- a/src/app/custom/themes/voscouleurs/index.ejs
+++ b/src/app/custom/themes/voscouleurs/index.ejs
@@ -32,6 +32,7 @@
<% if (custom.color) {%>
:root {
--bgBody: <%= custom.color.bgBody %>;
+ --bgContrast: <%= custom.color.bgContrast %>;
--bgHeader: <%= custom.color.bgHeader %>;
--headerTitle: <%= custom.color.headerTitle %>;
--bgContent: <%= custom.color.bgContent %>;
@@ -44,7 +45,6 @@
--button: <%= custom.color.button %>;
--buttonHover: <%= custom.color.buttonHover %>;
--textContrast: <%= custom.color.textContrast %>;
- --bgContrast: <%= custom.color.bgContrast %>;
}
<% } %>
@@ -68,7 +68,7 @@
-
+