From bff7e6a82f3f6769e4759dde2c0012585043710b Mon Sep 17 00:00:00 2001 From: Ricardo Wurmus Date: Tue, 31 Mar 2020 00:11:48 +0200 Subject: css: Add bubble tab to the left of messages on wide screens. --- assets/css/screen.css | 28 ++++++++++++++++++++++++++++ 1 file changed, 28 insertions(+) diff --git a/assets/css/screen.css b/assets/css/screen.css index fbf0e59..fdcf9b7 100644 --- a/assets/css/screen.css +++ b/assets/css/screen.css @@ -194,6 +194,34 @@ table { font-style: italic; } +@media (min-width: 768px) { + .message .card-header:before { + content: ""; + border-color: transparent; + border-right-color: #ddd; + border-style: solid solid outset; + border-width: 10px; + height: 0; + width: 0; + margin-left: -40px; + top: calc(1rem - 1px); + position: absolute; + } + .message .card:before { + content: ""; + border-color: transparent; + border-right-color: #f8f9fa; + border-style: solid solid outset; + border-width: 9px; + height: 0; + width: 0; + left: -18px; + top: 1rem; + position: absolute; + z-index: 10; + } +} + .message .from .address { font-weight: bold; } -- cgit v1.2.3