diff sat_templates/templates/bulma/static/call.css @ 374:5646df8bd391

bulma (call): calling mode improvments: - instead of a "switch" button, there are now 2 button with only an icon, one for video call and the other for audio call, they appear on the same row as the search bar - search item can now be extended using "call" blocks, and options are used - call search items don't show group, and now display an "extra" menu (3 dots menu) with a dropdown to select audio or video call.
author Goffi <goffi@goffi.org>
date Tue, 15 Aug 2023 17:12:18 +0200
parents a603cf0fa5d1
children c573917ce388
line wrap: on
line diff
--- a/sat_templates/templates/bulma/static/call.css	Mon Aug 14 17:01:35 2023 +0200
+++ b/sat_templates/templates/bulma/static/call.css	Tue Aug 15 17:12:18 2023 +0200
@@ -74,15 +74,41 @@
     color: #999;
 }
 
-.dropdown .dropdown-menu {
-  display: none;
-}
-
-.dropdown.is-active .dropdown-menu {
-  display: block;
-}
-
 .call_status {
     padding-top: 1.3rem;
     padding-bottom: 1.3rem;
 }
+
+.dropdown-menu{
+    min-width: 0;
+}
+
+/* Hide the call button by default on larger screens */
+.card .dropdown-trigger {
+    opacity: 0;
+    transition: opacity 0.3s;
+}
+
+/* Show the button when the card is hovered */
+.card:hover .dropdown-trigger {
+    opacity: 1;
+}
+
+/* Ensure it's always visible on smaller screens */
+@media (max-width: 768px) {
+    .card .dropdown-trigger {
+        opacity: 1;
+    }
+}
+
+/* Position the button at the top right */
+.level-right {
+    position: absolute;
+    top: 0.5rem;
+    right: 0.5rem;
+}
+
+/* Add some spacing between the icon and the edges of the button */
+.icon-dot-3-vert {
+    margin: 0 0.5rem;
+}