align line-actions, scale with terminal font size (#382)

This commit is contained in:
Mike Sawka 2024-03-05 14:36:39 -08:00 committed by GitHub
parent 01dc6144ac
commit c078f017ed
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 11 additions and 7 deletions

View File

@ -144,8 +144,6 @@ svg.icon {
} }
.scrollbar-hide-until-hover { .scrollbar-hide-until-hover {
overflow: scroll;
&::-webkit-scrollbar-thumb, &::-webkit-scrollbar-thumb,
&::-webkit-scrollbar-track { &::-webkit-scrollbar-track {
display: none; display: none;

View File

@ -147,14 +147,17 @@
.line-actions { .line-actions {
position: absolute; position: absolute;
right: calc(var(--termpad) * 2);
top: 0;
font-size: 14px;
color: var(--line-actions-inactive-color); color: var(--line-actions-inactive-color);
border-radius: 4px; border-radius: 4px;
padding-left: 4px; padding-left: 4px;
padding-right: 4px; padding-right: 4px;
line-height: 1.2; font-size: var(--termfontsize);
line-height: var(--termlineheight);
// we want to align to 2nd line of meta. that's 2xPad + 1xLineHightSm
// height of actions is 1xLineHeight + 8px (2x2px padding on icons)
top: calc(var(--termpad) * 2 + var(--termlineheight-sm) - var(--termlineheight) - 8px);
right: calc(var(--termpad) * 2 + var(--termlineheight-sm) - var(--termlineheight) - 8px);
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@ -171,7 +174,7 @@
color: var(--line-actions-active-color); color: var(--line-actions-active-color);
} }
padding: 4px; padding: 4px 4px;
cursor: pointer; cursor: pointer;
} }

View File

@ -63,6 +63,7 @@
.middle { .middle {
padding: 4px 6px 8px 6px; padding: 4px 6px 8px 6px;
border-bottom: 1px solid var(--app-border-color); border-bottom: 1px solid var(--app-border-color);
overflow-y: auto;
.item { .item {
&.active { &.active {
background-color: var(--sidebar-highlight-color); background-color: var(--sidebar-highlight-color);

View File

@ -98,6 +98,8 @@
display: flex; display: flex;
flex-direction: row; flex-direction: row;
position: relative; position: relative;
border-top: 2px solid transparent;
.background { .background {
// This applies a transparency mask to the background color, as set above, so that it will blend with whatever the theme's background color is. // This applies a transparency mask to the background color, as set above, so that it will blend with whatever the theme's background color is.
z-index: 1; z-index: 1;