Merge pull request #466 from kevinschweikert/ks/logger-colors

Request Logger colors

Author: SteffenDE

assets/css/app/_variables.scss

@@ -29,6 +29,7 @@ $color-green: #4db167;
 $color-blue: #5d89c7;
 $color-purple: $color-elixir;
 $color-yellow: #f9bc14;
+$color-red: #fa412d;
 $color-orange: $color-phoenix;
 $color-dark-gray: shade-color($color-gray, 4);
 $color-light-gray: tint-color($color-gray, 6);

assets/css/app/components/_logs_card.scss

@@ -17,8 +17,19 @@
         background-color: change-color($color-gray-warm-100, $alpha: 0.5);
       }
 
+      &.log-level-notice, &.log-level-info {
+      }
+
       &.log-level-debug {
-        color: change-color($text-color, $alpha: 0.75);
+        color: change-color($color-blue, $alpha: 0.75);
+      }
+
+      &.log-level-warning, &.log-level-warn {
+        color: change-color($color-yellow);
+      }
+
+      &.log-level-error, &.log-level-critical, &.log-level-alert, &.log-level-emergency {
+        color: change-color($color-red);
       }
     }
 

dev.exs

@@ -193,6 +193,7 @@ end
 
 defmodule DemoWeb.PageController do
   import Plug.Conn
+  require Logger
 
   def init(opts), do: opts
 
@@ -208,6 +209,19 @@ defmodule DemoWeb.PageController do
     content(conn, "<p>Hello, #{name}!</p>")
   end
 
+  def call(conn, :logs) do
+    Logger.notice("This is a notice")
+    Logger.debug("This is a debug message")
+    Logger.info("This is an info")
+    Logger.warning("This is a warning")
+    Logger.error("This is an error")
+    Logger.critical("This is a critical message")
+    Logger.alert("This is an alert")
+    Logger.emergency("This is an emergency")
+
+    content(conn, "Logs will show in request logger")
+  end
+
   def call(conn, :get) do
     json(conn, %{
       args: conn.params,
@@ -469,6 +483,7 @@ defmodule DemoWeb.Router do
     get "/get", DemoWeb.PageController, :get
     get "/hello", DemoWeb.PageController, :hello
     get "/hello/:name", DemoWeb.PageController, :hello
+    get "/logs", DemoWeb.PageController, :logs
 
     live_dashboard("/dashboard",
       env_keys: ["USER", "ROOTDIR"],
@@ -498,7 +513,7 @@ defmodule DemoWeb.Router do
 
   def put_csp(conn, _opts) do
     style_nonce = nonce()
-    script_nonce = noonce()
+    script_nonce = nonce()
 
     conn
     |> assign(:style_csp_nonce, style_nonce)

lib/phoenix/live_dashboard/pages/request_logger_page.ex

@@ -83,7 +83,7 @@ defmodule Phoenix.LiveDashboard.RequestLoggerPage do
         <div class="card-body">
           <div id="logger-messages" phx-update="stream">
             <%= for {id, {message, level}} <- @streams.messages do %>
-              <pre id={id} class={"log-level#{level} text-wrap"}><%= message %></pre>
+              <pre id={id} class={"log-level-#{level} text-wrap"}><%= message %></pre>
             <% end %>
           </div>
           <!-- Autoscroll ON/OFF checkbox -->