livebook/lib/livebook_web/live/modal_component.ex
Jonatan Kłosko 90e7941fe4
Redesign (#80)
* Update cell actions

* Add new focus indicator

* Update headings typography

* Update cell actions and insert buttons

* Add sidebar menu

* Add settings modal

* Update homepage

* Update settings dialog

* Rename classes

* Add floating menu

* Update icon colors on hover

* Fix homepage tests

* Format assets source

* Update monaco editor

* Fix editor width on resize

* Add more padding to the notebook content

* Update settings dialog title

* Show reevaluate button when the cell is in evaluated state

* Show section actions on focus or hover only

* Pre-fill runtime selector with the current configuration

* Ignore cmd + enter in Markdown cells
2021-03-20 14:10:15 +01:00

42 lines
1.2 KiB
Elixir

defmodule LivebookWeb.ModalComponent do
use LivebookWeb, :live_component
@impl true
def render(assigns) do
~L"""
<div class="fixed z-40 inset-0"
id="<%= @id %>">
<!-- Modal container -->
<div class="h-screen flex items-center justify-center p-4">
<!-- Overlay -->
<div class="absolute inset-0 bg-gray-500 opacity-75 z-0"
aria-hidden="true"
phx-capture-click="close"
phx-window-keydown="close"
phx-key="escape"
phx-target="#<%= @id %>"
phx-page-loading></div>
<!-- Modal box -->
<div class="relative max-h-full overflow-y-auto bg-white rounded-lg shadow-xl"
role="dialog"
aria-modal="true">
<%= live_patch to: @return_to, class: "absolute top-6 right-6 text-gray-400 flex space-x-1 items-center" do %>
<span class="text-sm">(esc)</span>
<%= remix_icon("close-line", class: "text-2xl") %>
<% end %>
<%= live_component @socket, @component, @opts %>
</div>
</div>
</div>
"""
end
@impl true
def handle_event("close", _params, socket) do
{:noreply, push_patch(socket, to: socket.assigns.return_to)}
end
end