github/overleaf
1
0
Fork 0
mirror of https://github.com/overleaf/overleaf.git synced 2025-04-22 10:36:57 +00:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #14840 from overleaf/ii-project-dashboard-action-items

Browse source 
[web] Adjust projects table column widths and action icons

GitOrigin-RevId: 5fea20efa27993485abe7cfa72a0141181efe7ba
This commit is contained in:
ilkin-overleaf 2023-09-15 16:59:36 +03:00 • committed by Copybot
parent fb4b6e0e41
commit 570d16ed42
11 changed files with 39 additions and 29 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
services/web/frontend/js/features/project-list/components/table/cells/action-buttons/archive-project-button.tsx
View file

@ -75,7 +75,7 @@ const ArchiveProjectButtonTooltip = memo(function ArchiveProjectButtonTooltip({
aria-label={text}
onClick={handleOpenModal}
>
<Icon type="inbox" />
<Icon type="inbox" fw />
</button>
</Tooltip>
)}

2
services/web/frontend/js/features/project-list/components/table/cells/action-buttons/copy-project-button.tsx
View file

@ -74,7 +74,7 @@ const CopyProjectButtonTooltip = memo(function CopyProjectButtonTooltip({
aria-label={text}
onClick={handleOpenModal}
>
<Icon type="files-o" />
<Icon type="files-o" fw />
</button>
</Tooltip>
)}

2
services/web/frontend/js/features/project-list/components/table/cells/action-buttons/delete-project-button.tsx
View file

@ -73,7 +73,7 @@ const DeleteProjectButtonTooltip = memo(function DeleteProjectButtonTooltip({
aria-label={text}
onClick={handleOpenModal}
>
<Icon type="ban" />
<Icon type="ban" fw />
</button>
</Tooltip>
)}

2
services/web/frontend/js/features/project-list/components/table/cells/action-buttons/download-project-button.tsx
View file

@ -47,7 +47,7 @@ const DownloadProjectButtonTooltip = memo(
aria-label={text}
onClick={downloadProject}
>
<Icon type="cloud-download" />
<Icon type="cloud-download" fw />
</button>
</Tooltip>
)}

2
services/web/frontend/js/features/project-list/components/table/cells/action-buttons/leave-project-button.tsx
View file

@ -72,7 +72,7 @@ const LeaveProjectButtonTooltip = memo(function LeaveProjectButtonTooltip({
aria-label={text}
onClick={handleOpenModal}
>
<Icon type="sign-out" />
<Icon type="sign-out" fw />
</button>
</Tooltip>
)}

2
services/web/frontend/js/features/project-list/components/table/cells/action-buttons/trash-project-button.tsx
View file

@ -72,7 +72,7 @@ const TrashProjectButtonTooltip = memo(function TrashProjectButtonTooltip({
aria-label={text}
onClick={handleOpenModal}
>
<Icon type="trash" />
<Icon type="trash" fw />
</button>
</Tooltip>
)}

2
services/web/frontend/js/features/project-list/components/table/cells/action-buttons/unarchive-project-button.tsx
View file

@ -51,7 +51,7 @@ const UnarchiveProjectButtonTooltip = memo(
aria-label={text}
onClick={handleUnarchiveProject}
>
<Icon type="reply" />
<Icon type="reply" fw />
</button>
</Tooltip>
)}

2
services/web/frontend/js/features/project-list/components/table/cells/action-buttons/untrash-project-button.tsx
View file

@ -49,7 +49,7 @@ const UntrashProjectButtonTooltip = memo(function UntrashProjectButtonTooltip({
aria-label={text}
onClick={handleUntrashProject}
>
<Icon type="reply" />
<Icon type="reply" fw />
</button>
</Tooltip>
)}

4
services/web/frontend/js/features/project-list/components/table/project-list-table.tsx
View file

@ -14,8 +14,8 @@ function SortBtn({ onClick, text, iconType, screenReaderText }: SortBtnProps) {
onClick={onClick}
aria-label={screenReaderText}
>
{text}
{iconType ? <Icon className="tablesort" type={iconType} /> : null}
<span className="tablesort-text">{text}</span>
{iconType && <Icon type={iconType} />}
</button>
)
}

41
services/web/frontend/stylesheets/app/project-list-react.less
View file

@ -149,6 +149,7 @@
display: flex;
align-items: center;
width: 100%;
&:hover {
background-color: @ol-blue-gray-0;
}
@ -421,6 +422,7 @@
color: @ol-type-color;
padding: 0;
font-weight: bold;
max-width: 100%;
&:hover,
&:focus {
@ -429,6 +431,12 @@
}
}
thead th,
.table-header-sort-btn {
overflow: hidden;
text-overflow: ellipsis;
}
.dash-cell-checkbox {
width: 5%;
line-height: 1.55;
@ -440,26 +448,19 @@
.dash-cell-name {
width: 50%;
overflow: hidden;
text-overflow: ellipsis;
}
.dash-cell-owner {
width: 20%;
overflow: hidden;
text-overflow: ellipsis;
}
.dash-cell-date {
width: 25%;
overflow: hidden;
text-overflow: ellipsis;
}
.dash-cell-actions {
display: none;
text-align: right;
white-space: nowrap;
}
.dash-cell-date-owner {
@ -517,20 +518,20 @@
}
.dash-cell-name {
width: 48%;
width: 45%;
}
.dash-cell-owner {
width: 13%;
width: 16%;
}
.dash-cell-date {
width: 15%;
width: 21%;
}
.dash-cell-actions {
display: table-cell;
width: 21%;
width: 15%;
}
.project-tools {
@ -544,7 +545,7 @@
}
.dash-cell-name {
width: 50%;
width: 46%;
}
.dash-cell-owner {
@ -556,7 +557,13 @@
}
.dash-cell-actions {
width: 18%;
width: 22%;
}
tbody {
.dash-cell-actions {
white-space: nowrap;
}
}
}
@ -566,7 +573,7 @@
}
.dash-cell-name {
width: 50%;
width: 46%;
}
.dash-cell-owner {
@ -578,7 +585,7 @@
}
.dash-cell-actions {
width: 13%;
width: 17%;
}
}
@ -588,7 +595,7 @@
}
.dash-cell-name {
width: 50%;
width: 49%;
}
.dash-cell-owner {
@ -600,7 +607,7 @@
}
.dash-cell-actions {
width: 13%;
width: 14%;
}
}

7
services/web/frontend/stylesheets/app/project-list.less
View file

@ -208,8 +208,7 @@ input.project-list-table-select-item[type='checkbox'] {
}
}
.action-btn {
padding: 0 0.3em;
margin-left: 0.2em;
padding: 0 0.2em;
}
.first-project {
@ -466,6 +465,10 @@ i.tablesort {
padding-left: 8px;
}
.tablesort-text {
padding-right: 8px;
}
.tag-label {
margin-left: @line-height-computed / 4;
position: relative;