added styled page layout selector, page renders selected layout

This commit is contained in:
Ro 2021-11-18 14:59:59 -08:00
parent a8355b2da4
commit 49e53a9638
8 changed files with 53 additions and 33 deletions

View file

@ -173,7 +173,7 @@ class Render
"menu" => $this->menu, "menu" => $this->menu,
]; ];
} else { } else {
$template = $this->theme . "/page.twig"; $template = $this->theme . "/" . $page["layout"] . ".twig";
$location = $location =
"../public/" . $page["path"] . "/" . $page["slug"] . ".html"; "../public/" . $page["path"] . "/" . $page["slug"] . ".html";
$dir = "../public/" . $page["path"]; $dir = "../public/" . $page["path"];

View file

@ -30,7 +30,7 @@
{% endblock %} {% endblock %}
{% block stylesheets %} {% block stylesheets %}
<link rel="stylesheet" type="text/css" href="/assets/css/dash.css?=adfdf"> <link rel="stylesheet" type="text/css" href="/assets/css/dash.css?=dfdfd">
{% endblock %} {% endblock %}
{% block mainContent %} {% block mainContent %}

View file

@ -17,30 +17,33 @@
{% endif %} {% endif %}
<div id="post-options"> <div id="post-options">
<button id="option-menu-pin" class="option-inactive post-option-btn" data-active="{{ menu }}" title='Pin to Menu'> <button id="option-menu-pin" class="option-inactive post-option-btn" data-active="{{ menu }}" title='Pin to Menu'>
<svg id="option-page-icon" viewbox="0 0 20 20" class="icons"> <svg id="option-page-icon" viewbox="0 0 20 20" class="icons">
<use id="option-page-icon" xlink:href="/assets/images/global/sprite.svg#entypo-add-to-list"/> <use id="option-page-icon" xlink:href="/assets/images/global/sprite.svg#entypo-add-to-list"/>
</svg> </svg>
</button> </button>
<button id="option-feature" class="option-inactive post-option-btn" data-active="{{ featured }}" title='Feature'> <button id="option-feature" class="option-inactive post-option-btn" data-active="{{ featured }}" title='Feature'>
<svg id="option-feature-icon" viewbox="0 0 20 20" class="icons"> <svg id="option-feature-icon" viewbox="0 0 20 20" class="icons">
<use id="option-feature-icon" xlink:href="/assets/images/global/sprite.svg#entypo-star"/> <use id="option-feature-icon" xlink:href="/assets/images/global/sprite.svg#entypo-star"/>
</svg> </svg>
</button> </button>
<button id="option-published" class="option-inactive post-option-btn" data-active="{{ published }}" title='Published'> <button id="option-published" class="option-inactive post-option-btn" data-active="{{ published }}" title='Published'>
<svg id="option-published-icon" viewbox="0 0 20 20" class="icons"> <svg id="option-published-icon" viewbox="0 0 20 20" class="icons">
<use id="option-published-icon" xlink:href="/assets/images/global/sprite.svg#entypo-eye"/> <use id="option-published-icon" xlink:href="/assets/images/global/sprite.svg#entypo-eye"/>
</svg> </svg>
</button> </button>
<label>View Template</label> <div id="layouts">
<select> <label>Page Layouts</label>
{% for view in views %} <select id="page-templates">
{% if view == page['layout'] %} {% for view in views %}
<option value={{ view }} selected>{{ view }}</option> {% if view == page['layout'] %}
{% else %} <option value={{ view }} selected>{{ view }}</option>
<option value={{ view }}>{{ view }}</option> {% else %}
{% endif %} <option value={{ view }}>{{ view }}</option>
{% endif %}
{% endfor %}
</select> {% endfor %}
</select>
</div>
</div> </div>

View file

@ -12,6 +12,7 @@
</section> </section>
<article> <article>
<div class="page"> <div class="page">
THIS IS A CUSTOM TEMPLATE <br />
<p>{{content | raw}}</p> <p>{{content | raw}}</p>
<div> <div>

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View file

@ -56,6 +56,7 @@ export default class PostActions {
"published", "published",
document.getElementById("option-published").getAttribute("data-active") document.getElementById("option-published").getAttribute("data-active")
); );
pageInfo.append("layout", document.getElementById('page-templates').value);
pageInfo.append( pageInfo.append(
"form_token", "form_token",
document.getElementById("form_token").value document.getElementById("form_token").value

View file

@ -236,6 +236,21 @@
background: $tertiary background: $tertiary
svg svg
fill: $primary fill: $primary
#layouts
padding: 7px 0 0 0
label
color: $primary
font-size: 1em
select
background: $primary
color: $secondary
border-radius: 3px
border-color: $primary
margin: 5px 0 0 0
width: 100%
padding: 5px
font-size: 1em
#featured-image-upload, #post-image-upload #featured-image-upload, #post-image-upload
display: none display: none