aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--main/data/chat_input.ui37
-rw-r--r--main/data/main_window.ui2
-rw-r--r--main/data/style.css118
3 files changed, 113 insertions, 44 deletions
diff --git a/main/data/chat_input.ui b/main/data/chat_input.ui
index c440d815..1f6396d6 100644
--- a/main/data/chat_input.ui
+++ b/main/data/chat_input.ui
@@ -4,7 +4,6 @@
<template class="DinoUiChatInputView">
<property name="hexpand">True</property>
<property name="orientation">vertical</property>
- <property name="margin-top">4</property>
<child>
<object class="GtkBox" id="unavailable_box">
<property name="margin_start">14</property>
@@ -27,15 +26,24 @@
</object>
</child>
<child>
+ <object class="GtkLabel" id="chat_input_status">
+ <property name="xalign">0</property>
+ <property name="margin_bottom">3</property>
+ <property name="margin_start">14</property>
+ <property name="margin_end">14</property>
+ <property name="wrap">True</property>
+ <attributes>
+ <attribute name="scale" value="0.8"></attribute>
+ </attributes>
+ <style>
+ <class name="chat-input-status"/>
+ </style>
+ </object>
+ </child>
+ <child>
<object class="GtkBox" id="outer_box">
- <property name="margin_start">14</property>
- <property name="margin_end">14</property>
<style>
<class name="dino-chatinput"/>
- <class name="card"/>
- <class name="toolbar"/>
- <class name="activatable"/>
- <class name="compact-card-toolbar"/>
</style>
<child>
<object class="GtkButton" id="file_button">
@@ -126,20 +134,5 @@
</child>
</object>
</child>
- <child>
- <object class="GtkLabel" id="chat_input_status">
- <property name="xalign">0</property>
- <property name="margin_bottom">3</property>
- <property name="margin_start">14</property>
- <property name="margin_end">14</property>
- <property name="wrap">True</property>
- <attributes>
- <attribute name="scale" value="0.8"></attribute>
- </attributes>
- <style>
- <class name="chat-input-status"/>
- </style>
- </object>
- </child>
</template>
</interface>
diff --git a/main/data/main_window.ui b/main/data/main_window.ui
index 806db779..c2f911c2 100644
--- a/main/data/main_window.ui
+++ b/main/data/main_window.ui
@@ -30,8 +30,6 @@
<child type="top">
<object class="GtkBox" id="conversation_list_toolbar">
<property name="spacing">6</property>
- <property name="margin-start">6</property>
- <property name="margin-end">6</property>
<style>
<class name="toolbar"/>
<class name="dino-conversation-list-toolbar"/>
diff --git a/main/data/style.css b/main/data/style.css
index c84551e6..3c8043b7 100644
--- a/main/data/style.css
+++ b/main/data/style.css
@@ -9,9 +9,37 @@ statuspage {
opacity: 0.5;
}
+window.dino-main,
+window.dino-main > *,
+window.dino-main navigation-split-view,
+window.dino-main navigation-split-view > .sidebar-pane,
+window.dino-main navigation-split-view > .content-pane,
+window.dino-main toolbarview,
+window.dino-main .dino-conversation {
+ margin: 0;
+ padding: 0;
+}
+
+window.dino-main {
+ outline: none;
+}
+
window.dino-main headerbar.dino-chat-headerbar,
window.dino-main .dino-conversation-list-toolbar {
min-height: 44px;
+ margin: 0;
+ background-color: @window_bg_color;
+ background-image: none;
+}
+
+window.dino-main .dino-conversation-list-toolbar {
+ border-bottom: none;
+ box-shadow: 0 3px 12px alpha(black, 0.18);
+}
+
+window.dino-main headerbar.dino-chat-headerbar {
+ border-bottom: none;
+ box-shadow: 0 3px 12px alpha(black, 0.18);
}
window.dino-main headerbar.dino-chat-headerbar > windowhandle > box,
@@ -20,6 +48,45 @@ window.dino-main .dino-conversation-list-toolbar {
padding-bottom: 0;
}
+window.dino-main .dino-conversation-list-toolbar {
+ padding-left: 6px;
+ padding-right: 6px;
+}
+
+window.dino-main headerbar button,
+window.dino-main .dino-conversation-list-toolbar entry,
+window.dino-main .dino-conversation-list-toolbar button,
+window.dino-main .navigation-sidebar > row,
+window.dino-main box.dino-chatinput,
+window.dino-main box.dino-chatinput button,
+window.dino-main popover > contents,
+window.dino-main popover row {
+ border-radius: 0;
+}
+
+window.dino-main button.circular,
+window.dino-main box.dino-chatinput button.circular {
+ border-radius: 999em;
+}
+
+window.dino-main .navigation-sidebar {
+ margin: 0;
+ padding: 0;
+}
+
+window.dino-main .navigation-sidebar > row {
+ margin: 0;
+}
+
+window.dino-main navigation-split-view > .sidebar-pane,
+window.dino-main navigation-split-view > .content-pane {
+ margin: 0;
+}
+
+window.dino-main navigation-split-view > .content-pane {
+ border-left: 1px solid color-mix(in srgb, @window_bg_color 92%, @theme_fg_color);
+}
+
window.dino-main .dino-conversation undershoot,
window.dino-main .dino-conversation viewport /* Some themes set this */ {
background: none;
@@ -94,7 +161,7 @@ window.dino-main .dino-conversation .message-box.edit-mode:hover {
}
window.dino-main .dino-conversation .message-box.edit-mode frame {
- border-radius: 3px;
+ border-radius: 0;
padding: 0 7px;
}
@@ -120,7 +187,7 @@ window.dino-main .dino-quote:hover {
window.dino-main .code-block {
background: alpha(@theme_fg_color, 0.06);
border: 1px solid alpha(@theme_fg_color, 0.12);
- border-radius: 8px;
+ border-radius: 0;
}
window.dino-main .code-block-header {
@@ -150,14 +217,14 @@ window.dino-main .code-block-content {
}
picture.avatar {
- border-radius: 3px;
+ border-radius: 0;
}
/* Overlay Toolbar */
.compact-card-toolbar {
padding: 2px;
- border-radius: 6px;
+ border-radius: 0;
border-spacing: 0;
}
@@ -171,7 +238,7 @@ picture.avatar {
window.dino-main .file-box-outer,
window.dino-main .call-box-outer {
background: @theme_base_color;
- border-radius: 8px;
+ border-radius: 0;
border: 1px solid var(--border-color);
}
@@ -182,7 +249,7 @@ window.dino-main .call-box {
window.dino-main .file-image-widget {
border: 1px solid alpha(@theme_fg_color, 0.1);
- border-radius: 6px;
+ border-radius: 0;
}
window.dino-main .file-image-widget .file-box-outer {
@@ -202,13 +269,13 @@ window.dino-main .file-image-widget .file-box-outer button:hover {
}
.dino-main .file-image-widget picture {
- border-radius: 6px;
+ border-radius: 0;
}
.dino-main .file-details {
color: white;
background: alpha(black, 0.3);
- border-radius: 5px;
+ border-radius: 0;
padding: 5px 10px;
}
@@ -238,6 +305,7 @@ window.dino-main .multiparty-participants {
min-height: 16px;
min-width: 30px;
padding: 4px;
+ border-radius: 999em;
}
.dino-main .reaction-grid button.own-reaction,
@@ -287,22 +355,32 @@ image.dino-status-online, image.dino-status-chat {
background-color: var(--shade-color);
opacity: 80%;
padding: 12px;
- border-radius: 6px 6px 0 0;
+ border-radius: 0;
}
/* Chat Input*/
-/* These rules are direved from the libadwaita style for activateable entry rows */
-window.dino-main box.dino-chatinput.activatable {
- outline: 0 solid transparent;
- outline-offset: 5px;
- transition: outline-color 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94), outline-width 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94), outline-offset 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94), background-color 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94), background-image 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94), border-radius 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
+window.dino-main box.dino-chatinput {
+ margin: 0;
+ padding: 2px;
+ background-color: shade(@view_bg_color, 0.96);
+ background-image: none;
+ border: none;
+ box-shadow: 0 -3px 12px alpha(black, 0.18);
+ outline: none;
+}
+
+window.dino-main box.dino-chatinput button.dino-attach-button {
+ background-image: none;
+ border: none;
+ box-shadow: none;
+ outline: none;
}
-window.dino-main box.dino-chatinput.activatable:focus-within {
- outline-offset: -1px;
- outline-width: 2px;
- outline-color: color-mix(in srgb, var(--accent-color) 50%, transparent);
+window.dino-main box.dino-chatinput > separator {
+ min-width: 0;
+ background: none;
+ border: none;
}
.dino-chatinput textview,
@@ -319,7 +397,7 @@ window.dino-main box.dino-chatinput.activatable:focus-within {
}
window.dino-main .image-round-corners picture {
- border-radius: 8px;
+ border-radius: 0;
}
window.dino-main .file-remove-button {
@@ -451,7 +529,7 @@ box.dino-input-error .chat-input-status.input-status-highlight-once {
.dino-call-window .text-no-controls {
color: black;
background: white;
- border-radius: 5px;
+ border-radius: 0;
padding: 5px 10px;
}