From 8d35d6772ec18e2ea2a266fff74fbe9ce063e7af Mon Sep 17 00:00:00 2001 From: vjeantet Date: Fri, 25 Sep 2020 23:20:16 +0200 Subject: fix layout --- assets/sass/layout.scss | 10 ++-- assets/sass/main.scss | 2 +- exampleSite/content/_layout/netlifycms/root.md | 10 ++-- .../01-homepage/_index.md | 4 +- .../examples/page with raw content/_index.md | 4 +- ...t.scss_f300667da4f5b5f84e1a9e0702b2fdde.content | 57 +++++++++++----------- ...n.scss_97a9b8e6852415b29a37632934745b8b.content | 56 ++++++++++----------- exampleSite/static/css/docport.css | 1 + layouts/raw/section.html | 1 + 9 files changed, 73 insertions(+), 72 deletions(-) create mode 100644 layouts/raw/section.html diff --git a/assets/sass/layout.scss b/assets/sass/layout.scss index eb1c611..ca71691 100644 --- a/assets/sass/layout.scss +++ b/assets/sass/layout.scss @@ -6,7 +6,7 @@ a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, bo vertical-align: baseline; } -body:not(.render_raw) { +body { margin: 0px 0px ; display: -webkit-box; display: flex; @@ -69,7 +69,7 @@ body:not(.render_raw) { -webkit-box-direction: normal; flex-flow: row nowrap; - padding: 0 20px; + padding-top: 45px; margin: 0 auto; width: 100%; @@ -150,7 +150,7 @@ body:not(.render_raw) { } /* hideheader hidenav hidebreadcrumb hidetoc hidefooter */ -body:not(.render_raw) { +body { &.hideheader{ article{ padding-top: 0px ; @@ -167,7 +167,7 @@ body:not(.render_raw) { } @media(max-width:1160px) { - body:not(.render_raw){ + body{ header{ div.burger{ display: none; @@ -194,7 +194,7 @@ body:not(.render_raw) { } @media(max-width:936px) { - body:not(.render_raw){ + body{ header{ div.burger{ display: block; diff --git a/assets/sass/main.scss b/assets/sass/main.scss index 40b2b75..31829b8 100644 --- a/assets/sass/main.scss +++ b/assets/sass/main.scss @@ -37,7 +37,7 @@ $c_saturate7 : saturate($color_second, 90%); -body:not(.render_raw){ +body{ font-family:"Montserrat",sans-serif; diff --git a/exampleSite/content/_layout/netlifycms/root.md b/exampleSite/content/_layout/netlifycms/root.md index 1efc1d2..ff62ed0 100644 --- a/exampleSite/content/_layout/netlifycms/root.md +++ b/exampleSite/content/_layout/netlifycms/root.md @@ -1,8 +1,8 @@ ---- -render: raw -title: Content Manager -url: /admin/index.html ---- +--- +type: raw +title: Content Manager +url: /admin/index.html +--- diff --git a/exampleSite/content/content-and-customization/01-homepage/_index.md b/exampleSite/content/content-and-customization/01-homepage/_index.md index 346ab25..296d498 100644 --- a/exampleSite/content/content-and-customization/01-homepage/_index.md +++ b/exampleSite/content/content-and-customization/01-homepage/_index.md @@ -24,7 +24,7 @@ Remove navigation components from your landing page by setting options in its pa {{%notice success%}} **Nothing but my content !** \ -set `render="raw"` in your home page frontmatter : only your content will be rendered, without menu, toc, headers, etc..... [example]({{%relref "/examples/page with raw content"%}}) +set `type="raw"` in your home page frontmatter : only your content will be rendered, without menu, toc, headers, etc..... [example]({{%relref "/examples/page with raw content"%}}) {{%/notice%}} ## Use plain HTML for your homepage @@ -34,7 +34,7 @@ Example ```toml +++ title="Homepage" -render="raw" +type="raw" +++
Hello diff --git a/exampleSite/content/examples/page with raw content/_index.md b/exampleSite/content/examples/page with raw content/_index.md index 6fd9586..bc5b3ae 100644 --- a/exampleSite/content/examples/page with raw content/_index.md +++ b/exampleSite/content/examples/page with raw content/_index.md @@ -1,6 +1,6 @@ --- description: Nothing but your content ! usefull for special pages -render: raw +type: raw title: A page with raw content weight: 99 --- @@ -13,7 +13,7 @@ weight: 99 ```yaml --- title: A page with raw content -render: raw +type: raw --- ``` {{%/panel%}} diff --git a/exampleSite/resources/_gen/assets/scss/sass/layout.scss_f300667da4f5b5f84e1a9e0702b2fdde.content b/exampleSite/resources/_gen/assets/scss/sass/layout.scss_f300667da4f5b5f84e1a9e0702b2fdde.content index 1fb45dc..299f7f7 100644 --- a/exampleSite/resources/_gen/assets/scss/sass/layout.scss_f300667da4f5b5f84e1a9e0702b2fdde.content +++ b/exampleSite/resources/_gen/assets/scss/sass/layout.scss_f300667da4f5b5f84e1a9e0702b2fdde.content @@ -5,7 +5,7 @@ a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, bo border: 0; vertical-align: baseline; } -body:not(.render_raw) { +body { margin: 0px 0px; display: -webkit-box; display: flex; @@ -14,7 +14,7 @@ body:not(.render_raw) { flex-direction: column; min-height: 100vh; text-rendering: optimizeLegibility; } - body:not(.render_raw) header { + body header { flex-shrink: 0; min-height: 45px; max-height: 45px; @@ -24,14 +24,14 @@ body:not(.render_raw) { z-index: 9999; -webkit-transform: translateZ(0); transform: translateZ(0); } - body:not(.render_raw) header > * { + body header > * { max-width: 1400px; width: 100%; padding: 0 20px; margin: 0 auto; } - body:not(.render_raw) header div.burger { + body header div.burger { display: none; } - body:not(.render_raw) article { + body article { -webkit-box-flex: 1; flex-grow: 1; display: -webkit-box; @@ -52,14 +52,13 @@ body:not(.render_raw) { -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-flow: row nowrap; - padding: 0 20px; padding-top: 45px; margin: 0 auto; width: 100%; max-width: 1400px; } - body:not(.render_raw) article > * { + body article > * { margin: 0 24px; } - body:not(.render_raw) article aside { + body article aside { transition: max-height .2s ease-out; -webkit-box-flex: 0; flex: 0 0 20em; @@ -71,18 +70,18 @@ body:not(.render_raw) { position: sticky; overflow-y: auto; top: 45px; } - body:not(.render_raw) article section.page { + body article section.page { -webkit-box-flex: 1; flex: 1 auto; max-width: 100%; min-width: 0; } - body:not(.render_raw) article section.page .jump-to-section { + body article section.page .jump-to-section { display: none; margin-top: 0.5em; margin-left: 0.2em; } - body:not(.render_raw) article section.page .jump-to-section ul { + body article section.page .jump-to-section ul { padding-left: 10px; } - body:not(.render_raw) article section.page .jump-to-section nav { + body article section.page .jump-to-section nav { display: none; position: absolute; z-index: 5; @@ -92,7 +91,7 @@ body:not(.render_raw) { min-width: 25%; max-width: 50%; box-shadow: 0 5px 8px rgba(0, 0, 0, 0.25); } - body:not(.render_raw) article section.right-menu { + body article section.right-menu { margin-right: 0; align-self: flex-start; display: block; @@ -104,49 +103,49 @@ body:not(.render_raw) { position: sticky; top: 45px; margin-bottom: 40px; } - body:not(.render_raw) footer > * { + body footer > * { max-width: 1400px; width: 100%; padding: 0 20px; margin: 0 auto; } /* hideheader hidenav hidebreadcrumb hidetoc hidefooter */ -body:not(.render_raw).hideheader article { +body.hideheader article { padding-top: 0px; } - body:not(.render_raw).hideheader article aside { + body.hideheader article aside { top: 0px; height: calc(100vh); } - body:not(.render_raw).hideheader article section.right-menu { + body.hideheader article section.right-menu { top: 0px; max-height: calc(100vh); } @media (max-width: 1160px) { - body:not(.render_raw) header div.burger { + body header div.burger { display: none; } - body:not(.render_raw) article { + body article { padding-left: 0px; padding-right: 0px; } - body:not(.render_raw) article aside { + body article aside { margin-right: 0px; } - body:not(.render_raw) article aside.responsive { + body article aside.responsive { display: block; } - body:not(.render_raw) article section.page .jump-to-section { + body article section.page .jump-to-section { display: block; } - body:not(.render_raw) article section.right-menu { + body article section.right-menu { display: none; } } @media (max-width: 936px) { - body:not(.render_raw) header div.burger { + body header div.burger { display: block; } - body:not(.render_raw) article { + body article { padding-left: 0px; padding-right: 0px; } - body:not(.render_raw) article aside { + body article aside { display: none; flex: 0 0 100%; } - body:not(.render_raw) article aside.responsive { + body article aside.responsive { display: block; } - body:not(.render_raw) article section.page .jump-to-section { + body article section.page .jump-to-section { display: block; } - body:not(.render_raw) article section.right-menu { + body article section.right-menu { display: none; } } diff --git a/exampleSite/resources/_gen/assets/scss/sass/main.scss_97a9b8e6852415b29a37632934745b8b.content b/exampleSite/resources/_gen/assets/scss/sass/main.scss_97a9b8e6852415b29a37632934745b8b.content index 6534a4c..8057b34 100644 --- a/exampleSite/resources/_gen/assets/scss/sass/main.scss_97a9b8e6852415b29a37632934745b8b.content +++ b/exampleSite/resources/_gen/assets/scss/sass/main.scss_97a9b8e6852415b29a37632934745b8b.content @@ -1,35 +1,35 @@ @charset "UTF-8"; -body:not(.render_raw) { +body { font-family: "Montserrat",sans-serif; font-weight: 400; line-height: 1.5; color: black; } - body:not(.render_raw) a { + body a { color: black; text-decoration: none; background-color: transparent; } - body:not(.render_raw) header { + body header { background-color: #333333; border-bottom: 2px solid gray; box-shadow: 0 0 0.2rem rgba(0, 0, 0, 0.1), 0 0.2rem 0.4rem rgba(0, 0, 0, 0.2); justify-content: space-between; align-items: stretch; color: #e6e6e6; } - body:not(.render_raw) header a { + body header a { color: #cccccc; } - body:not(.render_raw) header > div { + body header > div { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; align-items: stretch; white-space: nowrap; } - body:not(.render_raw) header > div img { + body header > div img { height: 32px; margin-right: 0.5rem; } - body:not(.render_raw) header > div .burger { + body header > div .burger { margin-right: 1rem; } - body:not(.render_raw) header nav.shortcuts { + body header nav.shortcuts { margin-left: auto; position: relative; display: flex; @@ -37,33 +37,33 @@ body:not(.render_raw) { list-style-type: none; flex-direction: row; flex-wrap: nowrap; } - body:not(.render_raw) header nav.shortcuts li { + body header nav.shortcuts li { margin: 0px; } - body:not(.render_raw) header nav.shortcuts li .fa { + body header nav.shortcuts li .fa { margin-right: 0.5rem; } - body:not(.render_raw) header nav.shortcuts li a { + body header nav.shortcuts li a { color: #d6d6d6; padding: 0 1rem; font-weight: bold; font-size: 90%; } - body:not(.render_raw) article { + body article { background-color: white; } - body:not(.render_raw) article aside #close_menu { + body article aside #close_menu { display: none; float: right; margin-right: 2rem; } - body:not(.render_raw) article aside.responsive #close_menu { + body article aside.responsive #close_menu { display: block; } - body:not(.render_raw) article section.right-menu { + body article section.right-menu { padding: 3.5rem 0 3.5rem 0; font-size: 14px; line-height: 20px; padding-left: 2px; } - body:not(.render_raw) article section.right-menu > div { + body article section.right-menu > div { margin-bottom: 2em; } - body:not(.render_raw) article section.right-menu > div > * { + body article section.right-menu > div > * { margin-left: 5px; } - body:not(.render_raw) article section.right-menu > div label { + body article section.right-menu > div label { font-weight: 700; letter-spacing: -1px; display: block; @@ -71,31 +71,31 @@ body:not(.render_raw) { border-bottom: 1px dotted #999999; color: #333333; font-variant: small-caps; } - body:not(.render_raw) article section.right-menu > div nav > ul { + body article section.right-menu > div nav > ul { padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px; } - body:not(.render_raw) article section.right-menu > div nav > ul ul { + body article section.right-menu > div nav > ul ul { padding: 0px 0px 0px 14px; margin: 0px 0px 0px 0px; border-left: 1px solid #e6e6e6; } - body:not(.render_raw) article section.right-menu > div nav > ul ul li { + body article section.right-menu > div nav > ul ul li { font-size: 90%; } - body:not(.render_raw) article section.right-menu > div ul { + body article section.right-menu > div ul { list-style-type: none; } - body:not(.render_raw) article section.right-menu > div li { + body article section.right-menu > div li { padding: 8px 0px 8px 0px; font-weight: 300; } - body:not(.render_raw) article section.right-menu > div li a { + body article section.right-menu > div li a { /*padding-left: 2px;*/ } - body:not(.render_raw) article section.right-menu > div li a.active { + body article section.right-menu > div li a.active { font-weight: 500; } - body:not(.render_raw) article section.right-menu .Actions { + body article section.right-menu .Actions { font-size: 75%; } - body:not(.render_raw) footer { + body footer { background-color: #333333; color: #cccccc; padding: 3rem; } - body:not(.render_raw) footer a { + body footer a { color: #cccccc; } article section.page { diff --git a/exampleSite/static/css/docport.css b/exampleSite/static/css/docport.css index e69de29..437391a 100644 --- a/exampleSite/static/css/docport.css +++ b/exampleSite/static/css/docport.css @@ -0,0 +1 @@ +/*body header > *, body article,body footer > * { max-width: 100%;}*/ \ No newline at end of file diff --git a/layouts/raw/section.html b/layouts/raw/section.html new file mode 100644 index 0000000..68a09ae --- /dev/null +++ b/layouts/raw/section.html @@ -0,0 +1 @@ +{{ .Content }} -- cgit v1.2.3