Mirrors/super-productivity
1
0
Fork 0
mirror of https://github.com/johannesjo/super-productivity.git synced 2026-07-18 00:46:45 +00:00
Code Issues Projects Releases Wiki Activity

feat: improve styling for work-view sections

Browse source
This commit is contained in:
Johannes Millan 2025-07-11 12:32:19 +02:00
parent 808502f6eb
commit 63165b2b2c
3 changed files with 23 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/app/features/tasks/task-list/task-list.component.scss
View file

@ -35,9 +35,9 @@
.no-tasks {
position: absolute;
text-align: center;
top: 0;
top: 50%;
left: 50%;
transform: translate(-50%, 0);
transform: translate(-50%, -50%);
width: 90%;
color: var(--text-color-muted);

9
src/app/features/work-view/work-view.component.html
View file

@ -196,7 +196,7 @@
@if (laterTodayTasks().length > 0 && isOnTodayList()) {
<div
@expand
style="margin-top: 16px"
class="collapsible-section"
>
<collapsible
[title]="
@ -267,9 +267,11 @@
doneTasks()?.length === 0
? (workContextService.doneTodayArchived$ | async)
: 0;
<div @expand>
<div
@expand
class="collapsible-section"
>
<collapsible
style="margin-top: 16px"
[title]="
(T.WW.DONE_TASKS | translate) +
' (' +
@ -312,6 +314,7 @@
}
</div>
</div>
@if (isShowBacklog()) {
<div
#splitBottomEl

22
src/app/features/work-view/work-view.component.scss
View file

@ -304,28 +304,35 @@ finish-day-btn,
}
}
// Unified collapsible section styles
.collapsible-section {
margin-top: 16px;
&:first-child {
margin-top: 0;
}
}
:host ::ng-deep .collapsible-header {
font-size: 16px;
margin-top: 0;
padding: 8px;
padding-bottom: 4px;
justify-content: flex-start;
padding: 12px 8px;
justify-content: center;
//margin-bottom: 10px;
border-bottom: 1px solid transparent;
border-bottom: 2px solid var(--extra-border-color);
border-bottom: 2px solid transparent;
.collapsible-title {
flex-grow: 0;
margin-left: -10px;
opacity: 0.8;
}
}
:host collapsible.isExpanded ::ng-deep .collapsible-header {
border-bottom: 1px solid var(--extra-border-color);
border-bottom: 2px solid var(--extra-border-color);
}
.overdue-tasks {
margin-top: 16px;
}
.overdue-btn-wrapper {
@ -334,4 +341,5 @@ finish-day-btn,
justify-content: center;
align-items: center;
padding-bottom: 8px;
padding-top: 8px;
}