more respnsive: header hamburger done, started base
This commit is contained in:
parent
d170979b42
commit
2f1636dfd4
|
|
@ -33,7 +33,7 @@ module.exports = merge(baseConfig, {
|
|||
'sass-loader'
|
||||
]
|
||||
}, {
|
||||
test: /\.(png|jpg|gif)$/,
|
||||
test: /\.(png|jpg|gif|svg)$/,
|
||||
use: [
|
||||
{
|
||||
loader: 'url-loader',
|
||||
|
|
|
|||
|
|
@ -34,7 +34,7 @@ module.exports = merge(baseConfig, {
|
|||
'sass-loader'
|
||||
]
|
||||
}, {
|
||||
test: /\.(png|jpg|gif)$/,
|
||||
test: /\.(png|jpg|gif|svg)$/,
|
||||
use: [
|
||||
{
|
||||
loader: 'url-loader',
|
||||
|
|
|
|||
|
|
@ -19319,24 +19319,36 @@ header[role="banner"] {
|
|||
header[role="banner"] > .wrapper .header-block.header-right label[for="header-block-right-toggle"] {
|
||||
display: block; }
|
||||
header[role="banner"] > .wrapper .header-block.header-right .header-block-wrapper {
|
||||
z-index: 10;
|
||||
z-index: 100;
|
||||
position: absolute;
|
||||
top: 33px;
|
||||
width: 300px;
|
||||
right: -450px;
|
||||
right: 0;
|
||||
box-sizing: border-box;
|
||||
transition: right 0.5s ease-in-out; }
|
||||
overflow: hidden;
|
||||
width: 0.1px;
|
||||
box-shadow: 0 0 0 #fff;
|
||||
padding: 1em 0;
|
||||
margin-top: 0.7em;
|
||||
transition: all 0.5s ease-in-out; }
|
||||
header[role="banner"] > .wrapper .header-block.header-right .header-block-wrapper > *.block, header[role="banner"] > .wrapper .header-block.header-right .header-block-wrapper > div#user-tools {
|
||||
display: block;
|
||||
padding: 0 0 0.5em 0 !important;
|
||||
margin: 0 0 0.5em 0 !important;
|
||||
width: 18em;
|
||||
padding: 0 0 1em 0 !important;
|
||||
margin: 0 0 1em 0 !important;
|
||||
text-align: right;
|
||||
border-left: none !important;
|
||||
border-right: none !important; }
|
||||
header[role="banner"] > .wrapper .header-block.header-right .header-block-wrapper > *.block:not(:last-child), header[role="banner"] > .wrapper .header-block.header-right .header-block-wrapper > div#user-tools:not(:last-child) {
|
||||
border-bottom: 1px solid #ccc !important; }
|
||||
header[role="banner"] > .wrapper .header-block.header-right .header-block-wrapper #user-flags {
|
||||
width: 18em;
|
||||
padding: 1em 0 0 0 !important;
|
||||
margin: 1em 0 0 0 !important;
|
||||
border-top: 1px solid #ccc !important; }
|
||||
header[role="banner"] > .wrapper .header-block.header-right input#header-block-right-toggle:checked ~ div.header-block-wrapper {
|
||||
right: 1px; } }
|
||||
width: 20em;
|
||||
padding: 1em 1em;
|
||||
box-shadow: -2px 2px 4px #ccc; } }
|
||||
|
||||
main[role="main"] {
|
||||
flex: 1 1 auto;
|
||||
|
|
@ -19397,9 +19409,7 @@ header[role="banner"] {
|
|||
header[role="banner"] #block-sitebranding h1, header[role="banner"] #block-sitebranding .slogan {
|
||||
display: inline-block; } }
|
||||
@media (max-width: 654px) {
|
||||
header[role="banner"] .header-block.header-right .header-block-wrapper {
|
||||
padding: 1em 1em;
|
||||
box-shadow: -2px 2px 4px #ccc;
|
||||
header[role="banner"] .header-block.header-right .header-block-wrapper, header[role="banner"] .header-block.header-right .header-block-wrapper #user-flags ul {
|
||||
background-color: #fff; } }
|
||||
header[role="banner"] #block-socialmedialinks {
|
||||
padding-right: 0.5em;
|
||||
|
|
@ -19672,13 +19682,18 @@ header[role="banner"] {
|
|||
align-self: flex-end; }
|
||||
@media (max-width: 654px) {
|
||||
header[role="banner"] #header-bottom {
|
||||
flex-direction: column-reverse;
|
||||
flex-direction: column;
|
||||
justify-content: center; }
|
||||
header[role="banner"] #header-bottom #block-pagetitle {
|
||||
width: max-content; } }
|
||||
width: 100%; }
|
||||
header[role="banner"] #header-bottom #block-materiosapisearchblock {
|
||||
box-sizing: border-box;
|
||||
width: 100%; } }
|
||||
header[role="banner"] #block-pagetitle {
|
||||
padding: 1em 0; }
|
||||
@media (max-width: 654px) {
|
||||
header[role="banner"] #block-pagetitle {
|
||||
padding: 1em 0 0; }
|
||||
body.path-frontpage header[role="banner"] #block-pagetitle, body.path-home header[role="banner"] #block-pagetitle {
|
||||
display: none; } }
|
||||
header[role="banner"] #block-pagetitle h2 {
|
||||
|
|
@ -19720,10 +19735,17 @@ header[role="banner"] {
|
|||
width: 20px;
|
||||
height: 20px;
|
||||
margin: 0;
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAIAAAAC64paAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAATFJREFUeNqcU8sNgkAQxc9dEr1rQgEkWoBGPEOid0ygA+6asDagBZCIHUgFrBVABWoF0ME6yZqRz/jBFw7D7ryZnZk3LSGEQiHP8/M5ut9v8rfXU2ezqa7rJSdBwff9fn/Q6XQr33xuXK83dCPIy+UKvSEEEMbjSfEkSRKa7HkeOh2PIZ5DQgwBBkEGD8yA4RFZliFfxi2R9/uDvIP8ZC/iOC4mL5GhvHdpEdhIsNvknHAkjDHDWIThqX6VpmlX+QjGdtJYr+26EL6Qt9sN5xfbtutXqqrSNUNjGtdsmqY0oigiH8I5h9e+Kv9vzjBUQmF4/UFhmqYRCnMcp7IJUtvg/UXbyATjx61qyX12XVcqAeYZBAG5z5ZljUbD6j4Xc4omUFDrTZnPmqGrfzABDwEGACI/YeOOd/wDAAAAAElFTkSuQmCC);
|
||||
background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgeG1sbnM6c29kaXBvZGk9Imh0dHA6Ly9zb2RpcG9kaS5zb3VyY2Vmb3JnZS5uZXQvRFREL3NvZGlwb2RpLTAuZHRkIgogICB4bWxuczppbmtzY2FwZT0iaHR0cDovL3d3dy5pbmtzY2FwZS5vcmcvbmFtZXNwYWNlcy9pbmtzY2FwZSIKICAgd2lkdGg9IjI3bW0iCiAgIGhlaWdodD0iMjdtbSIKICAgdmlld0JveD0iMCAwIDI3IDI3IgogICB2ZXJzaW9uPSIxLjEiCiAgIGlkPSJzdmcxNTY4MCIKICAgaW5rc2NhcGU6dmVyc2lvbj0iMS4wLjIgKGU4NmM4NzA4NzksIDIwMjEtMDEtMTUpIgogICBzb2RpcG9kaTpkb2NuYW1lPSJzZWFyY2guc3ZnIj4KICA8ZGVmcwogICAgIGlkPSJkZWZzMTU2NzQiIC8+CiAgPHNvZGlwb2RpOm5hbWVkdmlldwogICAgIGlkPSJiYXNlIgogICAgIHBhZ2Vjb2xvcj0iI2ZmZmZmZiIKICAgICBib3JkZXJjb2xvcj0iIzY2NjY2NiIKICAgICBib3JkZXJvcGFjaXR5PSIxLjAiCiAgICAgaW5rc2NhcGU6cGFnZW9wYWNpdHk9IjAuMCIKICAgICBpbmtzY2FwZTpwYWdlc2hhZG93PSIyIgogICAgIGlua3NjYXBlOnpvb209IjMuOTU5Nzk4IgogICAgIGlua3NjYXBlOmN4PSI1Mi4zOTQzMDEiCiAgICAgaW5rc2NhcGU6Y3k9IjY2LjY2OTUyOSIKICAgICBpbmtzY2FwZTpkb2N1bWVudC11bml0cz0ibW0iCiAgICAgaW5rc2NhcGU6Y3VycmVudC1sYXllcj0ibGF5ZXIxIgogICAgIGlua3NjYXBlOmRvY3VtZW50LXJvdGF0aW9uPSIwIgogICAgIHNob3dncmlkPSJmYWxzZSIKICAgICBpbmtzY2FwZTp3aW5kb3ctd2lkdGg9IjE5MjAiCiAgICAgaW5rc2NhcGU6d2luZG93LWhlaWdodD0iMTE0NSIKICAgICBpbmtzY2FwZTp3aW5kb3cteD0iMCIKICAgICBpbmtzY2FwZTp3aW5kb3cteT0iMjgiCiAgICAgaW5rc2NhcGU6d2luZG93LW1heGltaXplZD0iMSIgLz4KICA8bWV0YWRhdGEKICAgICBpZD0ibWV0YWRhdGExNTY3NyI+CiAgICA8cmRmOlJERj4KICAgICAgPGNjOldvcmsKICAgICAgICAgcmRmOmFib3V0PSIiPgogICAgICAgIDxkYzpmb3JtYXQ+aW1hZ2Uvc3ZnK3htbDwvZGM6Zm9ybWF0PgogICAgICAgIDxkYzp0eXBlCiAgICAgICAgICAgcmRmOnJlc291cmNlPSJodHRwOi8vcHVybC5vcmcvZGMvZGNtaXR5cGUvU3RpbGxJbWFnZSIgLz4KICAgICAgICA8ZGM6dGl0bGU+PC9kYzp0aXRsZT4KICAgICAgPC9jYzpXb3JrPgogICAgPC9yZGY6UkRGPgogIDwvbWV0YWRhdGE+CiAgPGcKICAgICBpbmtzY2FwZTpsYWJlbD0iQ2FscXVlIDEiCiAgICAgaW5rc2NhcGU6Z3JvdXBtb2RlPSJsYXllciIKICAgICBpZD0ibGF5ZXIxIj4KICAgIDxnCiAgICAgICBpZD0iZzE2NDIwIgogICAgICAgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMC44MTE1MDI5MywwLjIxMDg3NTA4KSI+CiAgICAgIDxsaW5lCiAgICAgICAgIGZpbGw9Im5vbmUiCiAgICAgICAgIHN0cm9rZT0iIzNhNThkOCIKICAgICAgICAgc3Ryb2tlLXdpZHRoPSIzLjU3NzU0IgogICAgICAgICBzdHJva2UtbGluZWNhcD0icm91bmQiCiAgICAgICAgIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIKICAgICAgICAgeDE9IjIuMDQzNjYwNiIKICAgICAgICAgeTE9IjI0LjQzMzkxNiIKICAgICAgICAgeDI9IjkuNDg3MjAyNiIKICAgICAgICAgeTI9IjE2Ljk5MDM3NCIKICAgICAgICAgaWQ9ImxpbmU0NTg0IgogICAgICAgICBzdHlsZT0ic3Ryb2tlOiMwMDAwMDA7c3Ryb2tlLW9wYWNpdHk6MSIgLz4KICAgICAgPGcKICAgICAgICAgaWQ9Imc0NTkwIgogICAgICAgICB0cmFuc2Zvcm09Im1hdHJpeCgwLjI2NDU4MzMzLDAsMCwwLjI2NDU4MzMzLC0zNzQuNTIzNSwtNjQ3Ljc4NjYpIj4KICAgICAgICA8cGF0aAogICAgICAgICAgIGQ9Im0gMTUwOS4zNzEsMjQ4OS4xMjkgYyAtMC4wMzksNi4xOTYgLTAuOTk2LDExLjYzOSAtMi44NjksMTYuMzI2IC0xLjg3Myw0LjY4NyAtNC40MjEsOC42MDcgLTcuNjQyLDExLjc1NSAtMy4yMjMsMy4xNDkgLTcuMDQ5LDUuNTA5IC0xMS40NzksNy4wODMgLTQuNDMsMS41NzQgLTkuMTg4LDIuMzQ2IC0xNC4yNjksMi4zMTUgLTQuOTQ0LC0wLjAzIC05LjYwMywtMC44NTkgLTEzLjk3OSwtMi40ODcgLTQuMzc3LC0xLjYyOCAtOC4xOTIsLTQuMDMzIC0xMS40NDQsLTcuMjI0IC0zLjI1MywtMy4xODcgLTUuODA0LC03LjEzNyAtNy42NTUsLTExLjg0NyAtMS44NTEsLTQuNzEgLTIuNzU3LC0xMC4xNjQgLTIuNzIxLC0xNi4zNjEgMC4wMzksLTYuMTk1IDEuMDQ1LC0xMS42MzcgMy4wMjQsLTE2LjMyNCAxLjk3OCwtNC42ODggNC42MjksLTguNjIxIDcuOTU3LC0xMS44MDUgMy4zMjYsLTMuMTgyIDcuMTY5LC01LjU2MSAxMS41MywtNy4xMzcgNC4zNjEsLTEuNTc0IDguOTQ1LC0yLjM0NiAxMy43NDksLTIuMzE2IDQuOTQzLDAuMDI5IDkuNjAxLDAuODU3IDEzLjk3OSwyLjQ4NiA0LjM3NSwxLjYyOSA4LjE4OCw0LjA1NSAxMS40NDIsNy4yNzYgMy4yNTIsMy4yMjIgNS44MDUsNy4xODggNy42NTYsMTEuODk5IDEuODUxLDQuNzEzIDIuNzU4LDEwLjE2NSAyLjcyMSwxNi4zNjEgeiBtIC01NS4yNDQsLTAuMzM3IGMgLTAuMDIyLDMuNTUxIDAuMzkyLDYuNzU4IDEuMjQ3LDkuNjE2IDAuODU0LDIuODYgMi4wOSw1LjMyMiAzLjcxNSw3LjM4NSAxLjYyMywyLjA2NCAzLjYxNCwzLjY2MiA1Ljk3Myw0Ljc4NyAyLjM2LDEuMTMgNS4wNzQsMS43MDMgOC4xMzcsMS43MjEgMi45OTIsMC4wMiA1LjY5NSwtMC41MiA4LjEwMywtMS42MjEgMi40MTEsLTEuMDk5IDQuNDM3LC0yLjY3IDYuMDg2LC00LjcxNSAxLjY0OSwtMi4wNDEgMi45MTYsLTQuNDg4IDMuODA1LC03LjMzOSAwLjg4NiwtMi44NDggMS4zNDMsLTYuMDQ5IDEuMzY0LC05LjYwMSAwLjAyMSwtMy41NDkgLTAuMzk2LC02Ljc3MiAtMS4yNDcsLTkuNjY2IC0wLjg1NCwtMi44OTUgLTIuMDkyLC01LjM3MiAtMy43MTQsLTcuNDM4IC0xLjYyNCwtMi4wNjIgLTMuNjMxLC0zLjY1OSAtNi4wMjksLTQuNzg5IC0yLjM5NSwtMS4xMjcgLTUuMDkxLC0xLjcwMSAtOC4wODIsLTEuNzIxIC0zLjA2NCwtMC4wMTggLTUuNzg0LDAuNTM5IC04LjE1NiwxLjY3NCAtMi4zNzQsMS4xMzUgLTQuMzg1LDIuNzI2IC02LjAzMyw0Ljc2OCAtMS42NSwyLjA0NSAtMi45MTcsNC41MDkgLTMuODA1LDcuMzkzIC0wLjg5LDIuODg1IC0xLjM0Myw2LjA2NyAtMS4zNjQsOS41NDYgeiIKICAgICAgICAgICBpZD0icGF0aDQ1ODgiIC8+CiAgICAgIDwvZz4KICAgICAgPGNpcmNsZQogICAgICAgICBmaWxsPSIjZmYyMzI2IgogICAgICAgICBjeD0iMTUuMjQ0NTMzIgogICAgICAgICBjeT0iMTAuNjk2NDU0IgogICAgICAgICByPSIxLjcyMTkwODMiCiAgICAgICAgIGlkPSJjaXJjbGU0NTk0IgogICAgICAgICBzdHlsZT0iZmlsbDojMDAwMDAwO2ZpbGwtb3BhY2l0eToxO3N0cm9rZS13aWR0aDowLjI2NDU4MyIgLz4KICAgIDwvZz4KICA8L2c+Cjwvc3ZnPgo=);
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain; }
|
||||
background-size: contain;
|
||||
background-color: transparent; }
|
||||
@media (max-width: 654px) {
|
||||
header[role="banner"] #block-materiosapisearchblock {
|
||||
padding: 0 1em;
|
||||
background-color: #69cdcf; }
|
||||
body:not(.path-base) header[role="banner"] #block-materiosapisearchblock {
|
||||
display: none; } }
|
||||
|
||||
aside.messages {
|
||||
padding: 0; }
|
||||
|
|
@ -20116,6 +20138,32 @@ article.node--type-frontpage .node__content > section.home-pricing .field--name-
|
|||
padding: 0;
|
||||
display: inline-block;
|
||||
vertical-align: top; }
|
||||
@media (max-width: 654px) {
|
||||
.cards-list > ul {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
justify-content: space-around;
|
||||
width: 100%; }
|
||||
.cards-list > ul > li {
|
||||
flex: 0 1 48%;
|
||||
margin: 0 0 0.5em 0; }
|
||||
.cards-list > ul > li > article {
|
||||
width: 100%;
|
||||
height: auto; }
|
||||
.cards-list > ul > li > article > section.images {
|
||||
height: auto; }
|
||||
.cards-list > ul > li > article > section.images > figure {
|
||||
position: relative; }
|
||||
.cards-list > ul > li > article > section.images > figure:not(:first-child) {
|
||||
display: none; }
|
||||
.cards-list > ul > li > article > section.images > figure img:not(.blank) {
|
||||
width: 100%;
|
||||
height: auto; }
|
||||
.cards-list > ul > li > article > section.images > figure img.blank {
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0; } }
|
||||
|
||||
article.card {
|
||||
position: relative;
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,85 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
width="27mm"
|
||||
height="27mm"
|
||||
viewBox="0 0 27 27"
|
||||
version="1.1"
|
||||
id="svg15680"
|
||||
inkscape:version="1.0.2 (e86c870879, 2021-01-15)"
|
||||
sodipodi:docname="search.svg">
|
||||
<defs
|
||||
id="defs15674" />
|
||||
<sodipodi:namedview
|
||||
id="base"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1.0"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:zoom="3.959798"
|
||||
inkscape:cx="52.394301"
|
||||
inkscape:cy="66.669529"
|
||||
inkscape:document-units="mm"
|
||||
inkscape:current-layer="layer1"
|
||||
inkscape:document-rotation="0"
|
||||
showgrid="false"
|
||||
inkscape:window-width="1920"
|
||||
inkscape:window-height="1145"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="28"
|
||||
inkscape:window-maximized="1" />
|
||||
<metadata
|
||||
id="metadata15677">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title></dc:title>
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<g
|
||||
inkscape:label="Calque 1"
|
||||
inkscape:groupmode="layer"
|
||||
id="layer1">
|
||||
<g
|
||||
id="g16420"
|
||||
transform="translate(0.81150293,0.21087508)">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#3a58d8"
|
||||
stroke-width="3.57754"
|
||||
stroke-linecap="round"
|
||||
stroke-miterlimit="10"
|
||||
x1="2.0436606"
|
||||
y1="24.433916"
|
||||
x2="9.4872026"
|
||||
y2="16.990374"
|
||||
id="line4584"
|
||||
style="stroke:#000000;stroke-opacity:1" />
|
||||
<g
|
||||
id="g4590"
|
||||
transform="matrix(0.26458333,0,0,0.26458333,-374.5235,-647.7866)">
|
||||
<path
|
||||
d="m 1509.371,2489.129 c -0.039,6.196 -0.996,11.639 -2.869,16.326 -1.873,4.687 -4.421,8.607 -7.642,11.755 -3.223,3.149 -7.049,5.509 -11.479,7.083 -4.43,1.574 -9.188,2.346 -14.269,2.315 -4.944,-0.03 -9.603,-0.859 -13.979,-2.487 -4.377,-1.628 -8.192,-4.033 -11.444,-7.224 -3.253,-3.187 -5.804,-7.137 -7.655,-11.847 -1.851,-4.71 -2.757,-10.164 -2.721,-16.361 0.039,-6.195 1.045,-11.637 3.024,-16.324 1.978,-4.688 4.629,-8.621 7.957,-11.805 3.326,-3.182 7.169,-5.561 11.53,-7.137 4.361,-1.574 8.945,-2.346 13.749,-2.316 4.943,0.029 9.601,0.857 13.979,2.486 4.375,1.629 8.188,4.055 11.442,7.276 3.252,3.222 5.805,7.188 7.656,11.899 1.851,4.713 2.758,10.165 2.721,16.361 z m -55.244,-0.337 c -0.022,3.551 0.392,6.758 1.247,9.616 0.854,2.86 2.09,5.322 3.715,7.385 1.623,2.064 3.614,3.662 5.973,4.787 2.36,1.13 5.074,1.703 8.137,1.721 2.992,0.02 5.695,-0.52 8.103,-1.621 2.411,-1.099 4.437,-2.67 6.086,-4.715 1.649,-2.041 2.916,-4.488 3.805,-7.339 0.886,-2.848 1.343,-6.049 1.364,-9.601 0.021,-3.549 -0.396,-6.772 -1.247,-9.666 -0.854,-2.895 -2.092,-5.372 -3.714,-7.438 -1.624,-2.062 -3.631,-3.659 -6.029,-4.789 -2.395,-1.127 -5.091,-1.701 -8.082,-1.721 -3.064,-0.018 -5.784,0.539 -8.156,1.674 -2.374,1.135 -4.385,2.726 -6.033,4.768 -1.65,2.045 -2.917,4.509 -3.805,7.393 -0.89,2.885 -1.343,6.067 -1.364,9.546 z"
|
||||
id="path4588" />
|
||||
</g>
|
||||
<circle
|
||||
fill="#ff2326"
|
||||
cx="15.244533"
|
||||
cy="10.696454"
|
||||
r="1.7219083"
|
||||
id="circle4594"
|
||||
style="fill:#000000;fill-opacity:1;stroke-width:0.264583" />
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.6 KiB |
|
|
@ -96,6 +96,7 @@ import { MA } from 'vuejs/api/ma-axios'
|
|||
initVSiteBrandingBlock()
|
||||
initVPagetitleBlock()
|
||||
initVHeaderMenu()
|
||||
initHamburgerMenu()
|
||||
initVMainContent()
|
||||
initVSearchBlock()
|
||||
initVLeftContent()
|
||||
|
|
@ -167,6 +168,10 @@ import { MA } from 'vuejs/api/ma-axios'
|
|||
document.querySelector('body').classList.add(...classes)
|
||||
|
||||
updateLanguageLinksBlock(to.path);
|
||||
|
||||
// close the hamburger menu
|
||||
store.dispatch('Common/openCloseHamMenu', false)
|
||||
|
||||
// trigger router
|
||||
next()
|
||||
})
|
||||
|
|
@ -300,6 +305,14 @@ import { MA } from 'vuejs/api/ma-axios'
|
|||
}).$mount('#' + id)
|
||||
}
|
||||
|
||||
function initHamburgerMenu(){
|
||||
const input = document.querySelector('input#header-block-right-toggle')
|
||||
input.addEventListener('change', (e) => {
|
||||
console.log("block header right toggle", e, this);
|
||||
store.dispatch('Common/openCloseHamMenu', e.currentTarget.checked)
|
||||
})
|
||||
}
|
||||
|
||||
function initVMainContent () {
|
||||
const id = 'main-content'
|
||||
const $main_content = document.querySelector('#' + id)
|
||||
|
|
|
|||
|
|
@ -151,21 +151,28 @@ header[role="banner"]{
|
|||
display:block;
|
||||
}
|
||||
// default position (hidden, translated right)
|
||||
$w: 20em;
|
||||
.header-block-wrapper{
|
||||
z-index: 10;
|
||||
z-index: 100;
|
||||
position: absolute;
|
||||
top: $min-height;
|
||||
$w: 300px;
|
||||
width: $w;
|
||||
right: - $w - 150px;
|
||||
right:0;
|
||||
// right: - $w - 150px;
|
||||
box-sizing: border-box;
|
||||
// transform: translateX(150px);
|
||||
transition: right 0.5s ease-in-out;
|
||||
// transform: translateX(450px);
|
||||
|
||||
overflow: hidden;
|
||||
width:0.1px;
|
||||
box-shadow: 0 0 0 #fff;
|
||||
padding:1em 0;
|
||||
margin-top: 0.7em;
|
||||
transition: all 0.5s ease-in-out;
|
||||
|
||||
>*.block, >div#user-tools{
|
||||
display: block;
|
||||
padding:0 0 0.5em 0!important;
|
||||
margin:0 0 0.5em 0!important;
|
||||
width: $w - 2em;
|
||||
padding:0 0 1em 0!important;
|
||||
margin:0 0 1em 0!important;
|
||||
text-align: right;
|
||||
border-left: none!important;
|
||||
border-right: none!important;
|
||||
|
|
@ -173,11 +180,20 @@ header[role="banner"]{
|
|||
border-bottom: 1px solid #ccc!important;
|
||||
}
|
||||
}
|
||||
#user-flags{
|
||||
width: $w - 2em;
|
||||
padding:1em 0 0 0!important;
|
||||
margin:1em 0 0 0!important;
|
||||
border-top: 1px solid #ccc!important;
|
||||
}
|
||||
}
|
||||
// input checked, wrapper visible
|
||||
input#header-block-right-toggle:checked ~ div.header-block-wrapper {
|
||||
// transform: translateX(1px);
|
||||
right:1px;
|
||||
// right:1px;
|
||||
width: $w;
|
||||
padding:1em 1em;
|
||||
box-shadow: -2px 2px 4px #ccc;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -11,9 +11,9 @@ $mdi-font-path: './mdi/fonts/';
|
|||
@import './base/fonts';
|
||||
// @import './base/responsive';
|
||||
|
||||
html{
|
||||
// background-color: red;
|
||||
}
|
||||
// .dialog-off-canvas-main-canvas{
|
||||
// background-color: red;
|
||||
// }
|
||||
|
||||
@mixin iconMDI($name) {
|
||||
&::before {
|
||||
|
|
@ -54,6 +54,10 @@ header[role="banner"]{
|
|||
font-weight: 400;
|
||||
}
|
||||
|
||||
// @include col-mediaquery-max(3){
|
||||
// overflow-x: hidden;
|
||||
// }
|
||||
|
||||
#block-sitebranding{
|
||||
h1{
|
||||
margin:0;
|
||||
|
|
@ -77,12 +81,14 @@ header[role="banner"]{
|
|||
@include col-mediaquery-max(3){
|
||||
.header-block.header-right{
|
||||
.header-block-wrapper{
|
||||
padding:1em 1em;
|
||||
box-shadow: -2px 2px 4px #ccc;
|
||||
&, #user-flags ul{
|
||||
// background-color: #222;
|
||||
// color: #fff;
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#block-socialmedialinks{
|
||||
padding-right: 0.5em;
|
||||
|
|
@ -496,13 +502,15 @@ header[role="banner"]{
|
|||
align-self: flex-end;
|
||||
}
|
||||
@include col-mediaquery-max(3){
|
||||
flex-direction: column-reverse;
|
||||
flex-direction: column;
|
||||
justify-content:center;
|
||||
#block-pagetitle{
|
||||
width: max-content;
|
||||
// width: max-content;
|
||||
width:100%;
|
||||
}
|
||||
#block-materiosapisearchblock{
|
||||
|
||||
box-sizing: border-box;
|
||||
width:100%;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -515,6 +523,7 @@ header[role="banner"]{
|
|||
body.path-frontpage &, body.path-home & {
|
||||
display: none;
|
||||
}
|
||||
padding: 1em 0 0;
|
||||
}
|
||||
h2{
|
||||
margin:0;
|
||||
|
|
@ -574,13 +583,21 @@ header[role="banner"]{
|
|||
width:20px; height:20px;
|
||||
margin:0;
|
||||
// border-radius: 7px;
|
||||
background-image: url('../img/search.png');
|
||||
background-image: url('../img/search.svg');
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
background-color: transparent
|
||||
}
|
||||
|
||||
}
|
||||
@include col-mediaquery-max(3){
|
||||
body:not(.path-base) &{
|
||||
display: none;
|
||||
}
|
||||
padding: 0 1em;
|
||||
background-color: $color-base;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
|
@ -1202,6 +1219,38 @@ article.node--type-frontpage{
|
|||
vertical-align: top;
|
||||
}
|
||||
}
|
||||
@include col-mediaquery-max(3){
|
||||
&>ul{
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
justify-content: space-around;
|
||||
width:100%;
|
||||
>li{
|
||||
flex: 0 1 48%;
|
||||
margin:0 0 0.5em 0;
|
||||
>article{
|
||||
width:100%;
|
||||
height:auto;
|
||||
>section.images{
|
||||
height: auto;
|
||||
>figure{
|
||||
position: relative;
|
||||
&:not(:first-child){
|
||||
display:none;
|
||||
}
|
||||
img:not(.blank){
|
||||
width:100%;
|
||||
height:auto;
|
||||
}
|
||||
img.blank{
|
||||
top:0; bottom:0; left:0; right:0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
article.card{
|
||||
|
|
|
|||
|
|
@ -61,6 +61,16 @@ function materiotheme_preprocess_html(&$vars) {
|
|||
|
||||
$vars['page']['#attached']['html_head'][] = [$description, 'description'];
|
||||
|
||||
$viewport = array(
|
||||
'#tag' => 'meta',
|
||||
'#attributes' => array(
|
||||
'name' => 'viewport',
|
||||
'content' => 'width=device-width, initial-scale=1, maximum-scale=1',
|
||||
),
|
||||
);
|
||||
$vars['page']['#attached']['html_head'][] = [$viewport, 'viewport'];
|
||||
// drupal_add_html_head($viewport, 'viewport');
|
||||
|
||||
// $gv = [
|
||||
// '#tag' => 'meta',
|
||||
// '#attributes' => [
|
||||
|
|
|
|||
|
|
@ -22,7 +22,8 @@ export default {
|
|||
},
|
||||
methods: {
|
||||
...mapActions({
|
||||
userLogin: 'User/userLogin'
|
||||
userLogin: 'User/userLogin',
|
||||
openCloseHamMenu: 'Common/openCloseHamMenu'
|
||||
}),
|
||||
login () {
|
||||
this.userLogin({
|
||||
|
|
@ -30,6 +31,7 @@ export default {
|
|||
pass: this.password
|
||||
}).then(() => {
|
||||
console.log("LoginBlock user logged-in")
|
||||
this.openCloseHamMenu(false)
|
||||
this.$router.push({
|
||||
name: 'base'
|
||||
})
|
||||
|
|
|
|||
|
|
@ -34,6 +34,9 @@ export default {
|
|||
}
|
||||
},
|
||||
methods: {
|
||||
// ...mapActions({
|
||||
// openCloseHamMenu: 'Common/openCloseHamMenu'
|
||||
// }),
|
||||
compileTemplate(){
|
||||
this.template = Vue.compile(this.html)
|
||||
},
|
||||
|
|
@ -50,6 +53,7 @@ export default {
|
|||
onclick (event) {
|
||||
// console.log("Clicked on header menu link", event);
|
||||
const href = event.target.getAttribute('href')
|
||||
// this.openCloseHamMenu(false)
|
||||
this.$router.push(href)
|
||||
}
|
||||
},
|
||||
|
|
|
|||
|
|
@ -73,7 +73,8 @@ export default {
|
|||
...mapActions({
|
||||
createFlagColl: 'User/createFlagColl',
|
||||
deleteFlagColl: 'User/deleteFlagColl',
|
||||
openFlagColl: 'User/openFlagColl'
|
||||
openFlagColl: 'User/openFlagColl',
|
||||
openCloseHamMenu: 'Common/openCloseHamMenu'
|
||||
}),
|
||||
onCreateFlagColl () {
|
||||
console.log("UserFlags onCreateFlagColl", this.new_folder_name)
|
||||
|
|
@ -136,6 +137,7 @@ export default {
|
|||
onOpenFlagColl (flagcollid) {
|
||||
// const flagcollid = e.target.getAttribute('flagcollid');
|
||||
console.log("UserFlags onOpenFlagColl", flagcollid);
|
||||
this.openCloseHamMenu(false)
|
||||
this.openFlagColl(flagcollid)
|
||||
.then(() => {
|
||||
// console.log("onDeleteFlagColl then", data);
|
||||
|
|
|
|||
|
|
@ -7,7 +7,8 @@ export default {
|
|||
|
||||
// initial state
|
||||
state: {
|
||||
pagetitle: null
|
||||
pagetitle: null,
|
||||
hamburgerMenuToggle: document.querySelector('input#header-block-right-toggle')
|
||||
},
|
||||
|
||||
// getters
|
||||
|
|
@ -18,10 +19,18 @@ export default {
|
|||
setPagetitle (state, title) {
|
||||
console.log('Common, setPagetitle', title)
|
||||
state.pagetitle = title
|
||||
},
|
||||
setHamMenuState (state, s){
|
||||
state.hamburgerMenuToggle.checked = s
|
||||
}
|
||||
},
|
||||
|
||||
// actions
|
||||
actions: {}
|
||||
actions: {
|
||||
openCloseHamMenu ({ dispatch, commit, state }, s) {
|
||||
console.log('openCloseHamMenu', s)
|
||||
commit('setHamMenuState', s)
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue