Mirror
/
zulip
mirror of https://github.com/zulip/zulip.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

css: Refactor Tippy popover CSS. 

The CSS for our first Tippy popover, actions_popover, incorrectly did
not split the CSS that is meant to be applied to all popovers from
that CSS that is only for that specific popover.

Reorganize this with some clarifying comments.
This commit is contained in:
Tim Abbott 2023-03-23 10:57:47 -07:00
parent cc7e29b96f
commit d3152800a6
2 changed files with 25 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
web/styles/components.css
View File

@ -100,10 +100,8 @@ i.zulip-icon.zulip-icon-bot {
}
.tippy-content {
/* This actually sets the
* default font size of only
* tooltips; popovers should define
* font-size of their own.
/* Set the default font size for tooltips. Popovers override this with
a rule looking at the data-theme.
*/
font-size: 12px;
}

36
web/styles/popovers.css
View File

@ -1,3 +1,26 @@
/*
Our Tippy popovers use the strangely named "light-border" Tippy
theme, so this block defines the common styling for all of our Tippy
popovers. (Tippy tooltips are defined in tooltips.css).
*/
.tippy-box[data-theme="light-border"] {
/* TODO: Clean this logic up after drop Bootstrap styling */
& ul.nav {
/* Override default padding of tippyjs */
margin: 0 -9px;
/* Override bootstrap defaults */
.nav-list > li > a {
padding: 3px 15px;
}
/* Override bootstrap defaults */
& hr {
margin: 5px 0;
}
}
}
.popover {
width: auto;
max-width: 100%;
@ -206,19 +229,6 @@ ul {
}
.actions_popover {
/* Override default padding of tippyjs */
margin: 0 -9px;
/* Override bootstrap defaults */
.nav-list > li > a {
padding: 3px 15px;
}
/* Override bootstrap defaults */
& hr {
margin: 5px 0;
}
.mark_as_unread {
.unread_count {
/* The icon for this menu item is in the form of an unread count from