bachir/drupal-reha
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

css block phase 1 home

Browse Source
This commit is contained in:
ouidade
2023-11-24 14:04:28 +01:00
parent e1393fba87
commit 6813ff33da
8 changed files with 163 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/themes/custom/reha/css/reha.css
+45 -14
View File
@@ -3,12 +3,12 @@
/*global*/
/* Colors used for REHA */
.field--type-link {
width: 45%;
text-transform: uppercase;
padding: 1rem;
border: solid black 1px;
margin-bottom: 1rem;
background-color: white; }
background-color: white;
width: fit-content; }
.bouton {
background-color: white !important;
@@ -16,7 +16,6 @@
cursor: pointer; }
.field--type-file {
width: 45%;
text-transform: uppercase;
padding: 1rem;
border: solid black 1px;
@@ -319,18 +318,50 @@ input {
font-weight: 900;
margin: 0;
line-height: 0.6; }
.home-page-layout-content .layout--onecol .block-region-content .block-block-content1ca95211-9fa2-4ef2-a460-8184d1eaf20f {
.home-page-layout-content .layout--onecol .block-region-content {
display: flex;
justify-content: flex-end;
margin-top: 5rem; }
.home-page-layout-content .layout--onecol .block-region-content .block-block-content1ca95211-9fa2-4ef2-a460-8184d1eaf20f :hover {
background-color: #fdc300; }
.home-page-layout-content .layout--onecol .block-region-content .block-block-content1dd151e8-8a8b-4586-9e62-8905ba0c93e0 {
display: flex;
justify-content: flex-end;
margin-bottom: 4rem; }
.home-page-layout-content .layout--onecol .block-region-content .block-block-content1dd151e8-8a8b-4586-9e62-8905ba0c93e0 :hover {
background-color: #fdc300; }
flex-wrap: wrap; }
.home-page-layout-content .layout--onecol .block-region-content .block-block-content5ae07b35-3c0b-48f5-b51b-f0f0e4c1765f {
width: 35%;
border: solid #fdc300 1px;
background-color: white;
font-weight: 800;
padding: 1rem; }
.home-page-layout-content .layout--onecol .block-region-content .block-block-content5ae07b35-3c0b-48f5-b51b-f0f0e4c1765f h2 {
margin-top: 0;
margin-bottom: 0;
text-transform: lowercase;
font-weight: 900;
line-height: 1rem;
font-size: 1.8rem; }
.home-page-layout-content .layout--onecol .block-region-content .block-block-content5ae07b35-3c0b-48f5-b51b-f0f0e4c1765f .field--name-field-description {
margin-top: 0;
font-size: 2rem;
line-height: 2.2rem; }
.home-page-layout-content .layout--onecol .block-region-content .block-block-content5ae07b35-3c0b-48f5-b51b-f0f0e4c1765f .field--name-field-description p {
margin-top: 0.8rem; }
.home-page-layout-content .layout--onecol .block-region-content .block-block-content5ae07b35-3c0b-48f5-b51b-f0f0e4c1765f .field--type-link {
padding: 0;
margin: 0;
border: none;
font-weight: 400; }
.home-page-layout-content .layout--onecol .block-region-content .block-block-content5ae07b35-3c0b-48f5-b51b-f0f0e4c1765f .field--type-link .field__item ::after {
justify-self: unset;
padding-left: 1rem;
content: url(../images/noun-arrow-1569918.svg); }
.home-page-layout-content .layout--onecol .block-region-content .block-block-content08189a6a-2ca1-42c3-a780-d7ad0c65619d {
width: 45%;
height: fit-content;
display: flex;
justify-content: flex-end; }
.home-page-layout-content .layout--onecol .block-region-content .block-block-content08189a6a-2ca1-42c3-a780-d7ad0c65619d :hover {
background-color: #fdc300; }
.home-page-layout-content .layout--onecol .block-region-content .block-block-content259faa3e-f66e-4776-9f4e-9a3aa26e8252 {
width: 45%;
display: flex;
justify-content: flex-end; }
.home-page-layout-content .layout--onecol .block-region-content .block-block-content259faa3e-f66e-4776-9f4e-9a3aa26e8252 :hover {
background-color: #fdc300; }
.user--register h1 {
font-size: 3rem !important;
web/themes/custom/reha/images/noun-arrow-1569918.svg
+61
View File
@@ -0,0 +1,61 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
version="1.1"
x="0px"
y="0px"
viewBox="0 0 60.166816 38.10535"
id="svg10"
sodipodi:docname="noun-arrow-1569918.svg"
inkscape:version="1.3 (0e150ed6c4, 2023-07-21)"
width="45"
height="24.10535"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
id="defs14" />
<sodipodi:namedview
id="namedview12"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
showgrid="false"
inkscape:zoom="9.741103"
inkscape:cx="15.552654"
inkscape:cy="15.809298"
inkscape:window-width="1920"
inkscape:window-height="1016"
inkscape:window-x="0"
inkscape:window-y="276"
inkscape:window-maximized="1"
inkscape:current-layer="svg10">
<inkscape:page
x="0"
y="0"
width="60.166817"
height="38.10535"
id="page1"
margin="0 6.0311446 0 0"
bleed="0" />
</sodipodi:namedview>
<g
transform="translate(-19.52231,-983.19166)"
id="g4">
<path
style="color:#fdc300;text-indent:0;text-transform:none;direction:ltr;baseline-shift:baseline;enable-background:accumulate"
d="m 79.9999,1002.3622 c 0,-0.4628 -0.2799,-1.0773 -0.56389,-1.3755 l -15.9997,-17.00032 c -0.747,-0.7723 -1.9572,-0.8618 -2.8281,-0.078 -0.7786,0.7007 -0.798,2.0673 -0.078,2.8282 l 12.8435,13.62522 H 22.0001 c -1.1046,0 -2,0.8954 -2,2 0,1.1046 0.8954,2.0001 2,2.0001 h 51.37361 l -12.8435,13.6252 c -0.7199,0.7608 -0.6688,2.0938 0.078,2.8281 0.7885,0.7752 2.0925,0.7062 2.8281,-0.078 l 15.9997,-17.0002 c 0.4701,-0.4611 0.556,-0.9052 0.56389,-1.3748 z"
fill="#fdc300"
fill-opacity="1"
stroke="none"
marker="none"
visibility="visible"
display="inline"
overflow="visible"
id="path2" />
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.1 KiB

web/themes/custom/reha/scss/global/variables/_buttons.scss
+4 -5
View File
@@ -1,16 +1,16 @@
// home
.field--type-link{
width: 45%;
text-transform: uppercase;
padding: 1rem;
border: solid black 1px;
margin-bottom: 1rem;
background-color: white;
background-color: $white-button;
width: fit-content;
}
.bouton{
background-color: white !important;
background-color: $white-button !important;
border: none !important;
cursor: pointer;
}
@@ -18,10 +18,9 @@
.field--type-file{
width: 45%;
text-transform: uppercase;
padding: 1rem;
border: solid black 1px;
margin-bottom: 1rem;
background-color: white;
background-color: $white-button;
}
web/themes/custom/reha/scss/global/variables/_colors.scss
+2 -1
View File
@@ -4,7 +4,8 @@
$background-home: rgba(153, 147, 174, 0.1);
$white: white;
$white-button: rgb(255, 255, 255);
$white-header:rgb(255, 255, 255);
$yellow-puca: #fdc300;
web/themes/custom/reha/scss/pages/_home.scss
+46 -4
View File
@@ -20,19 +20,61 @@
}
.block-region-content{
display: flex;
flex-wrap: wrap;
.block-block-content5ae07b35-3c0b-48f5-b51b-f0f0e4c1765f{
width: 35%;
border: solid $yellow-puca 1px;
background-color: $white-button;
font-weight: 800;
padding: 1rem;
h2{
margin-top: 0;
margin-bottom: 0;
text-transform: lowercase;
font-weight: 900;
line-height: 1rem;
font-size:1.8rem ;
}
.field--name-field-description{
margin-top: 0;
font-size: 2rem;
line-height: 2.2rem;
// inline-size: 1rem;
p{
margin-top: 0.8rem;
}
}
.field--type-link{
padding: 0;
margin: 0;
border: none;
font-weight: 400;
.field__item {
::after{
justify-self: unset;
padding-left: 1rem;
content: url(../images/noun-arrow-1569918.svg);
}
}
}
}
.block-block-content1ca95211-9fa2-4ef2-a460-8184d1eaf20f{
.block-block-content08189a6a-2ca1-42c3-a780-d7ad0c65619d{
width: 45%;
height: fit-content;
display: flex;
justify-content: flex-end;
margin-top: 5rem;
:hover{
background-color: $yellow-puca;
}
}
.block-block-content1dd151e8-8a8b-4586-9e62-8905ba0c93e0{
.block-block-content259faa3e-f66e-4776-9f4e-9a3aa26e8252{
width: 45%;
display: flex;
justify-content: flex-end;
margin-bottom: 4rem;
:hover{
background-color: $yellow-puca;
}
web/themes/custom/reha/scss/partials/_footer.scss
+1 -1
View File
@@ -1,5 +1,5 @@
footer{
background-color: $white;
background-color: $white-header;
padding-top: 3rem;
font-family: "Marianne";
font-weight: 800;
web/themes/custom/reha/scss/partials/_header.scss
+3 -3
View File
@@ -3,7 +3,7 @@
header{
display: block;
height: $header-height;
background-color: white;
background-color: $white-header;
// position: fixed;
z-index: 99;
width: 100vw;
@@ -62,7 +62,7 @@ header{
right:-235px;
top: 36px; // Positionnez-les sous les boutons
position: absolute;
background-color: $white;
background-color: $white-header;
width: 30vw;
height: 100vh;
box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
@@ -90,7 +90,7 @@ header{
width: 100%;
.field--type-text-long {
display: none;
background-color: $white;
background-color: $white-header;
position: absolute;
right:0px;
top: 100%;
web/themes/custom/reha/scss/reha.scss
+1 -1
View File
@@ -5,7 +5,7 @@
/*global*/
@import "global/variables/colors";
@import "global/variables/colors.scss";
@import "global/variables/typography";
@import "global/variables/buttons";
@import "global/core";