Update view templates

ethancrawford · ethancrawford · commit a60d3d69f252 · 2021-09-08T21:46:08.000+08:00
This changes edits the styling of the view slightly with bootstrap and removes
the default Phoenix styles. We also change the TOML documentation metadata
structure slightly so that sliding information is included _within_ a synth/fx's
data, not along-side it as an adjacent key/value.
diff --git a/etc/doc/templates/slides.toml.erb b/etc/doc/templates/slides.toml.erb
@@ -1,4 +1,4 @@
-[sliding]
+[<%= key %>.sliding]
 slide_label = "<%= t_('Slide Options') %>"
 slide_description = '''
 <%=
@@ -17,7 +17,7 @@ slide_opts = {
 }
 -%>
 <% slide_opts.each do |name, attributes| %>
-[[sliding.slide_opts]]
+[[<%= key %>.sliding.slide_opts]]
 name = "<%= name %>"
 default = "<%= attributes[:default] %>"
 doc = '''
diff --git a/etc/docs/assets/css/app.scss b/etc/docs/assets/css/app.scss
@@ -1,5 +1,4 @@
 /* This file is for your main application css. */
-@import "./phoenix.css";
 
 /* LiveView specific classes for your customizations */
 .phx-no-feedback.invalid-feedback,
diff --git a/etc/docs/assets/css/phoenix.css b/etc/docs/assets/css/phoenix.css
diff --git a/etc/docs/lib/docs_web/templates/layout/live.html.leex b/etc/docs/lib/docs_web/templates/layout/live.html.leex
@@ -1,4 +1,4 @@
-<main role="main" class="container">
+<main role="main" class="container-fluid">
   <p class="alert alert-info" role="alert"
     phx-click="lv:clear-flash"
     phx-value-key="info"><%= live_flash(@flash, :info) %></p>
diff --git a/etc/docs/lib/docs_web/templates/layout/root.html.leex b/etc/docs/lib/docs_web/templates/layout/root.html.leex
@@ -7,24 +7,11 @@
     <%= csrf_meta_tag() %>
     <%= live_title_tag assigns[:page_title] || "Docs", suffix: " · Phoenix Framework" %>
     <link phx-track-static rel="stylesheet" href="<%= Routes.static_path(@conn, "/css/app.css") %>"/>
+    <link phx-track-static rel="stylesheet" href="<%= Routes.static_path(@conn, "/css/bootstrap.min.css") %>"/>
     <script defer phx-track-static type="text/javascript" src="<%= Routes.static_path(@conn, "/js/app.js") %>"></script>
   </head>
   <body>
-    <header>
-      <section class="container">
-        <nav role="navigation">
-          <ul>
-            <li><a href="https://hexdocs.pm/phoenix/overview.html">Get Started</a></li>
-            <%= if function_exported?(Routes, :live_dashboard_path, 2) do %>
-              <li><%= link "LiveDashboard", to: Routes.live_dashboard_path(@conn, :home) %></li>
-            <% end %>
-          </ul>
-        </nav>
-        <a href="https://phoenixframework.org/" class="phx-logo">
-          <img src="<%= Routes.static_path(@conn, "/images/phoenix.png") %>" alt="Phoenix Framework Logo"/>
-        </a>
-      </section>
-    </header>
     <%= @inner_content %>
+    <script defer phx-track-static type="text/javascript" src="<%= Routes.static_path(@conn, "/js/bootstrap.bundle.min.js") %>"></script>
   </body>
 </html>

Original file line number	Diff line number	Diff line change
`@@ -1,5 +1,4 @@`
`1`	`1`	`/* This file is for your main application css. */`
`2`		`-@import "./phoenix.css";`
`3`	`2`
`4`	`3`	`/* LiveView specific classes for your customizations */`
`5`	`4`	`.phx-no-feedback.invalid-feedback,`
Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-<main role="main" class="container">`
	`1`	`+<main role="main" class="container-fluid">`
`2`	`2`	`<p class="alert alert-info" role="alert"`
`3`	`3`	`phx-click="lv:clear-flash"`
`4`	`4`	`phx-value-key="info"><%= live_flash(@flash, :info) %></p>`