PK MQ.V2r> > ma-details-summary-nav.cccomp>rPK "Q.Vq#zP2 K2 component.jsonK2{"UUID":"3de25beb-52f5-4702-9039-b0916d4c34ef","additional_states":{"Container":{"outofview":{"character":".","name":"Out of View","value":"outofview"},"show-menu":{"character":".","name":"show-menu","value":"show-menu"}},"Font Icon Link":{"outofview":{"character":".","name":"Out of View","value":"outofview"}},"HTML Element":{"outofview":{"character":".","name":"Out of View","value":"outofview"}},"List Item Link":{"outofview":{"character":".","name":"Out of View","value":"outofview"}},"Paragraph":{"outofview":{"character":".","name":"Out of View","value":"outofview"}},"Text":{"outofview":{"character":".","name":"Out of View","value":"outofview"}},"Text Link":{"outofview":{"character":".","name":"Out of View","value":"outofview"}},"UL Link":{"outofview":{"character":".","name":"Out of View","value":"outofview"}}},"appBuildInfo":"RSD 5.0.3534","appId":"RSD","appVersion":3534,"buildNumber":5979,"component_resources":{"classes":12,"file_sizes_values":[2852,0,0],"file_type_values":[1,0,0],"html_elements":1,"ids":0,"links_external":3,"links_internal":9,"local_files":"1 (local size 2,79 kB)","styled_breakpoints":"601px / 750px / 993px / 1201px"},"description":"Your component description","element_name":"Container","framework":"materialize","html":"
This sample paragraph is sitting in the container main-content
. That is where you should place your site content in order to avoid interfering with the menu and other important mechanisms that make the page work.Please don't change the parameters for the main-content
.
It is also advisable to make the menu into a 'symbol'. That makes it possible to insert it on several pages, and if it has to be edited, you only do it on one page, and the rest of the pages will be updated automatically.
","htmlembed":{"3":""},"mobile_first":true,"name":"ma-details-summary-nav","resources":{"./custom-code/custom-menu.css":{"breakpoints":{},"elements":{"counter":1},"pictures":{},"type":"image"}},"stylesheet":".container-grid.pageinside {\n margin-right:auto;\n margin-left:auto;\n max-width:1200px;\n width:100%;\n background-color:rgba(241, 241, 242, 1);\n height:auto;\n min-height:100vh;\n box-sizing:border-box;\n padding-top:10px;\n}\n\n.container-grid.menu-items-wrapper {\n background-color:rgba(188, 186, 190, 1);\n display:none;\n height:auto;\n min-height:0px;\n padding-top:20px;\n padding-right:20px;\n padding-bottom:20px;\n padding-left:20px;\n position:relative;\n top:56px;\n overflow:scroll;\n border-right-color:rgba(91, 112, 101, 1);\n border-right-width:0.3125rem;\n border-right-style:solid;\n}\n\na.link-text.home-button {\n color:rgba(25, 149, 173, 1);\n text-decoration:none;\n font-family:'Trebuchet MS', 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', Tahoma, sans-serif;\n font-weight:600;\n font-size:16px;\n display:block;\n width:100%;\n padding-top:5px;\n padding-bottom:5px;\n padding-right:15px;\n border-bottom-width:0.0625rem;\n border-bottom-style:solid;\n border-bottom-color:rgba(221, 221, 221, 1);\n line-height:24px;\n}\n\nspan.text-element.menu-item-summary {\n color:rgba(25, 149, 173, 1);\n font-family:'Trebuchet MS', 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', Tahoma, sans-serif;\n font-size:16px;\n font-weight:600;\n padding-bottom:5px;\n border-bottom-width:0.0625rem;\n border-bottom-style:solid;\n border-bottom-color:rgba(221, 221, 221, 1);\n display:block;\n width:100%;\n margin-bottom:15px;\n margin-top:15px;\n padding-right:15px;\n cursor:pointer;\n padding-top:5px;\n line-height:1.2;\n text-decoration:none;\n}\n\nul.link-list.menu-item-details {\n list-style-type:none;\n padding-left:10px;\n margin-top:0px;\n margin-bottom:0px;\n margin-left:20px;\n}\n\nul.link-list {\n width:auto;\n}\n\nli.list-item-link.menu-item-link {\n line-height:1.4;\n margin-top:16px;\n margin-bottom:16px;\n}\n\nli.list-item-link.menu-item-link>a {\n color:rgba(25, 149, 173, 1);\n text-decoration:none;\n font-family:'Trebuchet MS', 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', Tahoma, sans-serif;\n font-size:16px;\n}\n\n.container-grid.menu-container {\n grid-area:menu/menu/menu/menu;\n position:fixed;\n max-width:none;\n width:100%;\n padding-top:0px;\n display:flex;\n flex-direction:column;\n padding-left:0px;\n justify-self:center;\n align-self:flex-start;\n top:0px;\n padding-right:0px;\n height:auto;\n overflow:auto;\n right:0px;\n left:0px;\n background-color:rgba(25, 149, 173, 1);\n}\n\n.container-grid.menu-mobile-navigation {\n display:flex;\n justify-content:flex-end;\n padding-top:20px;\n padding-right:20px;\n padding-bottom:20px;\n padding-left:20px;\n position:relative;\n top:0px;\n}\n\na.glyph.menu-icon {\n color:rgba(241, 241, 242, 1);\n position:relative;\n vertical-align:middle;\n font-size:24px;\n text-align:right;\n text-decoration:none;\n line-height:30px;\n}\n\n.container-grid.main-content {\n width:95%;\n margin-right:auto;\n margin-left:auto;\n display:flex;\n padding-top:0px;\n margin-top:70px;\n}\n\np.paragraph.paragraph-1 {\n margin-top:16px;\n width:100%;\n margin-right:auto;\n margin-left:auto;\n padding-left:10px;\n padding-right:5px;\n}\n\n.html-element.html-element-1 {\n display:none;\n}\n\n@media screen and (min-width: 37.5625rem) {\n a.glyph.menu-icon {\n line-height:30px;\n }\n}\n\n@media screen and (min-width: 46.875rem) {\n .container-grid.pageinside {\n height:100%;\n min-height:100vh;\n background-color:rgba(241, 241, 242, 1);\n border-right-width:0.3125rem;\n border-right-style:solid;\n border-right-color:rgba(7, 111, 115, 1);\n box-sizing:border-box;\n padding-top:40px;\n display:grid;\n flex-direction:row;\n justify-content:flex-start;\n position:relative;\n grid-template-columns:350px 1fr;\n grid-template-rows:auto;\n grid-template-areas:\"menu main-content\";\n grid-area:elementArea/elementArea/elementArea/elementArea;\n }\n\n .container-grid.menu-items-wrapper {\n display:block;\n width:100%;\n max-width:300px;\n position:fixed;\n top:0px;\n border-right-style:solid;\n border-left-style:solid;\n border-right-width:0.3125rem;\n border-left-width:0.3125rem;\n border-right-color:rgba(7, 111, 115, 1);\n border-left-color:rgba(7, 111, 115, 1);\n background-color:rgba(188, 186, 190, 1);\n grid-area:1/1/span 1/span 1;\n height:100%;\n overflow:auto;\n }\n\n a.link-text.home-button {\n color:rgba(25, 149, 173, 1);\n }\n\n span.text-element.menu-item-summary {\n color:rgba(25, 149, 173, 1);\n grid-area:content/content/content/content;\n }\n\n li.list-item-link.menu-item-link>a {\n color:rgba(25, 149, 173, 1);\n }\n\n .container-grid.menu-container {\n display:block;\n max-width:350px;\n padding-right:8px;\n padding-left:16px;\n position:sticky;\n }\n\n .container-grid.menu-mobile-navigation {\n display:none;\n grid-area:menu/menu/menu/menu;\n }\n\n .container-grid.main-content {\n right:auto;\n left:auto;\n display:block;\n padding-top:0px;\n box-sizing:border-box;\n margin-left:auto;\n margin-right:auto;\n margin-top:0px;\n position:relative;\n width:100%;\n grid-area:1/2/span 1/span 1;\n }\n\n p.paragraph.paragraph-1 {\n width:95%;\n margin-left:0px;\n margin-right:0px;\n max-width:none;\n padding-left:10px;\n }\n}\n\n@media screen and (min-width: 62.0625rem) {\n .container-grid.pageinside {\n grid-template-columns:350px 1fr;\n }\n\n p.paragraph.paragraph-1 {\n padding-left:10px;\n }\n}\n\n@media screen and (min-width: 75.0625rem) {\n .container-grid.pageinside {\n grid-template-columns:350px 1fr;\n }\n\n .container-grid.menu-items-wrapper {\n max-width:350px;\n overflow:auto;\n }\n\n p.paragraph.paragraph-1 {\n padding-left:10px;\n margin-right:auto;\n margin-left:auto;\n }\n}","timestamp":1673687303421,"type":"Container","units":"rem"}
PK "Q.V\k) $ % resources/custom-code/custom-menu.css$html.loaded {
scroll-behavior: smooth;
}
@media screen and (prefers-reduced-motion: reduce) {
html.loaded {
scroll-behavior: auto;
}
}
.title-section {
pointer-events: none;
}
.container.menu-container {
height: calc(100vh - 32px);
overflow-x: hidden;
}
@media screen and (max-width: 60rem) {
.container.menu-container {
height: auto;
}
.container.menu-container.show-menu {
height: 100vh; /* Fallback */
height: calc(var(--viewport-height, 1vh) * 100);
}
.container.menu-items-wrapper.show-menu {
height: calc(100vh - 65px); /* Fallback */
height: calc(var(--viewport-height, 1vh) * 100 - 65px);
}
}
nav.menu-container,
nav.menu-container * {
box-sizing: border-box;
}
nav.menu-container a {
display: block;
-webkit-transition-delay: .5s;
-moz-transition-delay: .5s;
-o-transition-delay: .5s;
transition-delay: .5s;
-webkit-transition-duration: .2s;
-moz-transition-duration: .2s;
-o-transition-duration: .2s;
transition-duration: .2s;
-webkit-transition-property: all;
-moz-transition-property: all;
-o-transition-property: all;
transition-property: all;
}
details > summary {
list-style: none;
display: block;
position: relative;
}
details > summary::-webkit-details-marker {
display: none;
}
details > summary:focus {
outline: none;
}
details > summary .line-vertical-plus,
details > summary .line-horizontal-plus {
width: 12px;
height: 2px;
background-color: #1995ad;
color: transparent;
display: block;
position: absolute;
right: 0;
top: calc(50% - 2px);
-webkit-transition-delay: 0s;
-moz-transition-delay: 0s;
-o-transition-delay: 0s;
transition-delay: 0s;
-webkit-transition-timing-function: ease-in-out;
-moz-transition-timing-function: ease-in-out;
-o-transition-timing-function: ease-in-out;
transition-timing-function: ease-in-out;
-webkit-transition-duration: 0.2s;
-moz-transition-duration: 0.2s;
-o-transition-duration: 0.2s;
transition-duration: 0.2s;
-webkit-transition-property: all;
-moz-transition-property: all;
-o-transition-property: all;
transition-property: all;
}
details > summary .line-vertical-plus {
transform: rotate(-90deg);
}
details[open] > summary .line-vertical-plus {
transform: rotate(0deg);
}
details[open] > summary .line-horizontal-plus{
transform: rotate(180deg);
}
details[open] summary ~ * {
animation: sweep .5s ease-in-out;
}
@keyframes sweep {
0% {opacity: 0;}
100% {opacity: 1;}
}
/* Search Custom Styles */
.cc-result-highlight {
font-weight: 700;
}
PK "Q.Vq#zP2 K2 component.jsonPK "Q.V\k) $ % |2 resources/custom-code/custom-menu.cssPK = PK MQ.V̪E D ma-details-summary-nav.png PNG
IHDR A l1 pHYs + IDATx{\T ^p
ĒTK҄K"-;^2=;fvOJ:Zϰciͻih^/( *hJ*b
f 輞rf^kk&