Merge pull request #21945 from overleaf/td-bs5-file-tree-font-size

Reduce file tree font size to 14px in Bootstrap 5

GitOrigin-RevId: 27289b00fa3def01ccf410649430e3826ac0b1bb
This commit is contained in:
Tim Down 2024-11-25 14:15:54 +00:00 committed by Copybot
parent 8cd6a0b2f1
commit 794f4782c4
2 changed files with 28 additions and 39 deletions

View file

@ -4,6 +4,8 @@
--file-tree-item-color: var(--content-primary-dark);
--file-tree-bg: var(--bg-dark-tertiary);
--file-tree-item-selected-color: var(--content-primary-dark);
--file-tree-item-dragging-bg: #{rgb($bg-dark-secondary, 0.9)};
--file-tree-item-dragging-preview-bg: #{rgb($bg-accent-01, 0.6)};
--file-tree-line-height: 2.05;
}
@ -12,6 +14,7 @@
--file-tree-item-color: var(--content-secondary);
--file-tree-bg: var(--bg-light-primary);
--file-tree-item-selected-color: var(--bg-light-primary);
--file-tree-item-dragging-bg: #{rgb($bg-light-tertiary, 0.9)};
}
.ide-react-file-tree-panel {
@ -75,7 +78,6 @@
flex-direction: column;
height: 100%;
> file-tree-root,
.file-tree-inner {
position: relative;
display: flex;
@ -84,6 +86,7 @@
overflow-y: auto;
width: inherit;
height: inherit;
font-size: var(--font-size-02);
&.no-toolbar {
top: 0;
@ -92,7 +95,7 @@
// TODO; Consolidate with "Project files" in Overleaf
h3 {
font-size: 1rem;
font-size: var(--font-size-03);
border-bottom: 1px solid var(--border-primary);
padding-bottom: var(--spacing-02);
margin: var(--spacing-05);
@ -128,25 +131,6 @@
}
}
&-history {
.entity-name {
padding-left: var(--spacing-03);
&.deleted {
text-decoration: line-through;
}
}
.loading {
padding-left: var(--spacing-03);
color: var(--content-primary-dark);
.material-symbols {
color: var(--content-primary-dark);
}
}
}
ul.file-tree-list {
margin: 0;
overflow: hidden auto;
@ -173,19 +157,24 @@
user-select: none;
}
.entity > .entity-name > button {
background-color: transparent;
border: 0;
padding: 0;
.entity > .entity-name {
display: flex;
align-items: center;
&.item-name-button {
color: inherit;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
text-align: left;
padding-right: var(--spacing-09);
white-space: pre;
& > button {
background-color: transparent;
border: 0;
padding: 0;
&.item-name-button {
color: inherit;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
text-align: left;
padding-right: var(--spacing-09);
white-space: pre;
}
}
}
@ -242,7 +231,7 @@
top: 4px;
width: 0;
left: -5px;
font-size: 12px;
font-size: var(--font-size-01);
}
}
}
@ -317,7 +306,6 @@
.menu-button {
position: absolute;
right: 0;
top: 3px;
}
.rename-input {
@ -413,9 +401,9 @@
li
.entity.file-tree-entity-dragging
.entity-name {
background-color: fade(var(--file-tree-item-hover-bg), 90%);
background-color: var(--file-tree-item-dragging-bg);
@include fake-full-width-bg(fade(var(--file-tree-item-hover-bg), 90%));
@include fake-full-width-bg(var(--file-tree-item-dragging-bg));
color: var(--file-tree-item-color);
@ -455,7 +443,7 @@
.dnd-draggable-preview-item {
color: var(--file-tree-item-selected-color);
background-color: fade(var(--file-tree-item-selected-bg), 60%);
background-color: var(--file-tree-item-dragging-preview-bg);
width: 75%;
padding-left: var(--spacing-08);
line-height: 2.05;
@ -490,7 +478,7 @@
}
.toggle-file-type-button {
font-size: 80%;
font-size: var(--font-size-02);
margin-top: calc(var(--spacing-05) * -1);
.btn {

View file

@ -441,6 +441,7 @@ history-root {
max-height: 100%;
ul.history-file-tree-list {
font-size: var(--font-size-02);
margin: 0;
overflow: hidden auto;