From 5fc45a0e3b144b5e87845d068940afb90c3646a6 Mon Sep 17 00:00:00 2001 From: href Date: Fri, 3 Sep 2021 04:02:43 +0200 Subject: assets.. --- assets/css/chat.css | 45 +++++++++++++++++++++++++++++++++++++++++++++ assets/css/dropdown.css | 26 ++++++++++++++++++++++++++ 2 files changed, 71 insertions(+) create mode 100644 assets/css/chat.css create mode 100644 assets/css/dropdown.css (limited to 'assets/css') diff --git a/assets/css/chat.css b/assets/css/chat.css new file mode 100644 index 0000000..2e2cf53 --- /dev/null +++ b/assets/css/chat.css @@ -0,0 +1,45 @@ +.phx-disconnected > .chat { + .disconnected { + @display block; + } +} +.phx-error > .chat { + .phx-errored { + @display block; + } +} + +.chat { + @apply h-screen max-h-screen; + + .disconnected, .phx-errored { @apply hidden; } + + .body { + @apply grid h-3/4 grid-cols-10; + + .log { + @apply h-full max-w-full col-span-9 h-96 gap-4; + + .time-component { + @apply inline-block font-mono text-sm flex-none cursor-default; + } + + li.event { + .time-component { @apply text-gray-700 dark:text-gray-300; }; + .nick { @apply text-gray-700 dark:text-gray-700; } + } + + } + + aside { + @apply px-4 pt-4 bg-gray-100 text-sm; + .user.dropdown { + .content { + @apply z-40 origin-top-right absolute right-full mr-4 -mt-4 bg-gray-50 w-80 py-4 px-4 rounded-md shadow-xl ring-1 ring-black ring-opacity-5 focus:outline-none; + } + } + } + + } + +} diff --git a/assets/css/dropdown.css b/assets/css/dropdown.css new file mode 100644 index 0000000..57adb3b --- /dev/null +++ b/assets/css/dropdown.css @@ -0,0 +1,26 @@ +/* + * == DROPDOWN + */ + +.dropdown { + position: relative; + summary { + list-style: none; + cursor: pointer; + &::-webkit-details-marker { + display: none; + } + .content { + position: absolute; + } + details[open] summary::before { + position: fixed; + top: 0; + right: 0; + bottom: 0; + left: 0; + content: ""; + cursor: default; + } + } +} -- cgit v1.2.3