From 1dba24d0b3260db975169620be487b4404116918 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Hugo=20Bara=C3=BAna?= <hugo.barauna@gmail.com>
Date: Thu, 5 Sep 2024 16:28:01 -0300
Subject: [PATCH] Design improvements in the outline (#2771)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: Jonatan Kłosko <jonatanklosko@gmail.com>
---
 lib/livebook_web/live/session_live/render.ex | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/lib/livebook_web/live/session_live/render.ex b/lib/livebook_web/live/session_live/render.ex
index 7a94c531a..754d7d083 100644
--- a/lib/livebook_web/live/session_live/render.ex
+++ b/lib/livebook_web/live/session_live/render.ex
@@ -495,11 +495,11 @@ defmodule LivebookWeb.SessionLive.Render do
         <div :for={section_item <- @data_view.sections_items} class="flex flex-col">
           <div class="flex justify-between items-center">
             <button
-              class="grow flex items-baseline gap-1 text-gray-500 hover:text-gray-900 text-left"
+              class="grow flex items-baseline gap-1 text-gray-600 hover:text-gray-900 text-left"
               data-el-outline-item
               data-section-id={section_item.id}
             >
-              <.remix_icon icon="h-2" class="text-lg font-normal leading-none" />
+              <.remix_icon icon="h-2" class="text-lg font-normal leading-none opacity-50" />
               <span><%= section_item.name %></span>
               <%!--
                 Note: the container has overflow-y auto, so we cannot set overflow-x visible,
@@ -525,13 +525,13 @@ defmodule LivebookWeb.SessionLive.Render do
           <ul :if={section_item.identifier_definitions != []} class="mt-2 ml-5 list-none items-center">
             <li :for={definition <- section_item.identifier_definitions}>
               <button
-                class="flex items-center max-w-full text-gray-500 hover:text-gray-900 text-sm gap-1"
+                class="flex items-center max-w-full text-gray-600 hover:text-gray-900 text-sm gap-1"
                 data-el-outline-definition-item
                 data-file={definition.file}
                 data-line={definition.line}
                 title={definition.label}
               >
-                <.remix_icon icon="braces-line" class="font-normal" />
+                <.remix_icon icon="braces-line" class="font-normal opacity-50" />
                 <span class="font-mono truncate">
                   <%= definition.label %>
                 </span>