t/tetratto
1
0
Fork 0
Code Issues Pull requests Projects Releases 4 Packages Wiki Activity Actions

add: journals + notes

Browse source
This commit is contained in:
trisua 2025-06-19 15:48:04 -04:00
parent c08a26ae8d
commit c1568ad866
26 changed files with 1431 additions and 265 deletions
Download patch file Download diff file Expand all files Collapse all files

225
crates/app/src/public/html/chats/app.lisp
View file

@ -1,7 +1,7 @@
(text "{% extends \"root.html\" %} {% block head %}")
(title
(text "Chats - {{ config.name }}"))
(link ("rel" "stylesheet") ("data-turbo-temporary" "true") ("href" "/css/chats.css?v=tetratto-{{ random_cache_breaker }}"))
(text "{% endblock %} {% block body %} {{ macros::nav(selected=\"chats\", hide_user_menu=true) }}")
(nav
("class" "chats_nav")
@ -16,7 +16,6 @@
(b
(text "{{ text \"chats:label.my_chats\" }}"))
(text "{%- endif %}")))
(div
("class" "flex")
(div
@ -87,7 +86,7 @@
(text "{{ components::user_plate(user=user, show_menu=true) }}"))
(text "{% if channel -%}")
(div
("class" "w-full flex flex-col gap-2")
("class" "w-full flex flex-col gap-2 padded_section")
("id" "stream")
("style" "padding: var(--pad-4)")
(turbo-frame
@ -110,225 +109,6 @@
("title" "Send")
(text "{{ icon \"send-horizontal\" }}"))))
(text "{%- endif %}")
(style
(text ":root {
--list-bar-width: 64px;
--channels-bar-width: 256px;
--sidebar-height: calc(100dvh - 42px);
--channel-header-height: 48px;
}
html,
body {
overflow: hidden;
}
.name.shortest {
max-width: 165px;
overflow-wrap: normal;
}
.send_button {
width: 48px;
height: 48px;
}
.send_button .icon {
width: 2em;
height: 2em;
}
a.channel_icon {
width: 48px;
height: 48px;
min-height: 48px;
}
a.channel_icon .icon {
min-width: 24px;
height: 24px;
}
a.channel_icon.small {
width: 24px;
height: 24px;
min-height: 24px;
}
a.channel_icon.small .icon {
min-width: 12px;
height: 12px;
}
a.channel_icon:has(img) {
padding: 0;
}
a.channel_icon img {
min-width: 48px;
min-height: 48px;
}
a.channel_icon img,
a.channel_icon:has(.icon) {
transition:
outline 0.25s,
background 0.15s !important;
}
a.channel_icon:not(.selected):hover img,
a.channel_icon:not(.selected):hover:has(.icon) {
outline: solid 1px var(--color-text);
}
a.channel_icon.selected img,
a.channel_icon.selected:has(.icon) {
outline: solid 2px var(--color-text);
}
nav {
background: var(--color-raised);
color: var(--color-text-raised) !important;
height: 42px;
position: sticky !important;
}
nav::after {
display: block;
position: absolute;
background: var(--color-super-lowered);
height: 1px;
width: calc(100% - var(--list-bar-width));
bottom: 0;
left: var(--list-bar-width);
content: \"\";
}
nav .content_container {
max-width: 100% !important;
width: 100%;
}
.chats_nav {
display: none;
padding: 0;
}
.chats_nav button {
justify-content: flex-start;
width: 100% !important;
flex-direction: row !important;
font-size: 16px !important;
margin-top: -4px;
}
.chats_nav button svg {
margin-right: var(--pad-4);
}
.sidebar {
background: var(--color-raised);
color: var(--color-text-raised);
border-right: solid 1px var(--color-super-lowered);
padding: 0.4rem;
width: max-content;
height: var(--sidebar-height);
overflow: auto;
transition: left 0.15s;
z-index: 1;
}
.sidebar .title:not(.dropdown *) {
padding: var(--pad-4);
border-bottom: solid 1px var(--color-super-lowered);
}
.sidebar#channels_list {
width: var(--channels-bar-width);
background: var(--color-surface);
color: var(--color-text);
}
#stream {
width: calc(
100dvw - var(--list-bar-width) - var(--channels-bar-width)
) !important;
height: var(--sidebar-height);
}
.message {
transition: background 0.15s;
box-shadow: none;
position: relative;
}
.message:hover {
background: var(--color-raised);
}
.message:hover .hidden,
.message:focus .hidden,
.message:active .hidden {
display: flex !important;
}
.message.grouped {
padding: var(--pad-1) var(--pad-4) var(--pad-1) calc(var(--pad-4) + var(--pad-2) + 42px);
}
turbo-frame {
display: contents;
}
.channel_header {
height: var(--channel-header-height);
}
.members_list_half {
padding-top: var(--pad-4);
border-top: solid 1px var(--color-super-lowered);
}
.channels_list_half:not(.no_members),
.members_list_half {
overflow: auto;
height: calc(
(var(--sidebar-height) - var(--channel-header-height) - 8rem) /
2
);
}
@media screen and (max-width: 900px) {
:root {
--sidebar-height: calc(100dvh - 42px * 2);
}
.message.grouped {
padding: var(--pad-1) var(--pad-4) var(--pad-1) calc(var(--pad-4) + var(--pad-2) + 31px);
}
body:not(.sidebars_shown) .sidebar {
position: absolute;
left: -200%;
}
body.sidebars_shown .sidebar {
position: absolute;
}
#stream {
width: 100dvw !important;
height: var(--sidebar-height);
}
nav::after {
width: 100dvw;
left: 0;
}
.chats_nav {
display: flex;
}
}"))
(script
(text "window.CURRENT_PAGE = Number.parseInt(\"{{ page }}\");
window.VIEWING_SINGLE = \"{{ message }}\".length > 0;
@ -684,5 +464,4 @@
}
}, 100);"))
(text "{%- endif %}"))
(text "{% endblock %}")