added styled page layout selector, page renders selected layout

brain/data/Render.inc.php

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

brain/views/dash/page-edit.twig

@@ -30,7 +30,7 @@
 {% endblock %}
 
 {% 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 %}
 
   {% block mainContent %}

brain/views/dash/partials/options.twig

@@ -17,30 +17,33 @@
 {% endif %}
 
 <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>

content/themes/fipamo-default/page-custom.twig

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

src/com/actions/PageActions.js

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

src/styles/main/_posts.sass

@@ -236,6 +236,21 @@
                             background: $tertiary
                             svg
                                 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
                         display: none