Skip to content

Commit

Permalink
fix: font sizes and sidebar icons (#2461)
Browse files Browse the repository at this point in the history
* fix: font sizes

* fix: sidebar icons
  • Loading branch information
aaryan610 authored Oct 17, 2023
1 parent 732e33f commit 4bd7363
Show file tree
Hide file tree
Showing 13 changed files with 32 additions and 27 deletions.
21 changes: 13 additions & 8 deletions packages/tailwind-config-custom/tailwind.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -18,14 +18,19 @@ module.exports = {
theme: {
// scale down font sizes to 90% of default
fontSize: {
xs: "0.65rem",
sm: "0.7rem",
base: "0.8rem",
xl: "1rem",
"2xl": "1.25rem",
"3xl": "1.563rem",
"4xl": "1.953rem",
"5xl": "2.441rem",
xs: "0.675rem",
sm: "0.7875rem",
base: "0.9rem",
lg: "1.0125rem",
xl: "1.125rem",
"2xl": "1.35rem",
"3xl": "1.6875rem",
"4xl": "2.25rem",
"5xl": "2.7rem",
"6xl": "3.375rem",
"7xl": "4.05rem",
"8xl": "5.4rem",
"9xl": "7.2rem",
},
// scale down spacing to 90% of default
padding: {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -220,7 +220,7 @@ export const IssuePropertyAssignee: React.FC<IIssuePropertyAssignee> = observer(
}
>
<div className="flex items-center gap-1 w-full px-1">
<div className="flex-shrink-0 w-[18px] h-[18px] rounded-sm flex justify-center items-center text-white capitalize relative overflow-hidden">
<div className="flex-shrink-0 w-4 h-4 rounded-sm flex justify-center items-center text-white capitalize relative overflow-hidden">
{option && option.avatar ? (
<img
src={option.avatar}
Expand Down
2 changes: 1 addition & 1 deletion web/components/labels/single-label-group.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -163,7 +163,7 @@ export const SingleLabelGroup: React.FC<Props> = ({

<div className="flex items-center">
<button className="flex items-center justify-start gap-2" onClick={handleLabelDelete}>
<X className="h-[18px] w-[18px] text-custom-sidebar-text-400 flex-shrink-0" />
<X className="h-4 w-4 text-custom-sidebar-text-400 flex-shrink-0" />
</button>
</div>
</div>
Expand Down
2 changes: 1 addition & 1 deletion web/components/notifications/notification-popover.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -75,7 +75,7 @@ export const NotificationPopover = () => {
: "text-custom-sidebar-text-200 hover:bg-custom-sidebar-background-80"
} ${store?.theme?.sidebarCollapsed ? "justify-center" : ""}`}
>
<Bell className="h-[18px] w-[18px]" />
<Bell className="h-4 w-4" />
{store?.theme?.sidebarCollapsed ? null : <span>Notifications</span>}
{totalNotificationCount && totalNotificationCount > 0 ? (
store?.theme?.sidebarCollapsed ? (
Expand Down
4 changes: 2 additions & 2 deletions web/components/pages/single-page-block.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -303,8 +303,8 @@ export const SinglePageBlock: React.FC<Props> = ({ block, projectDetails, showBl
className="absolute top-4 -left-0 hidden rounded p-0.5 group-hover:!flex"
{...provided.dragHandleProps}
>
<MoreVertical className="h-[18px]" />
<MoreVertical className="-ml-2.5 h-[18px]" />
<MoreVertical className="h-4" />
<MoreVertical className="-ml-2.5 h-4" />
</button>
<div
ref={actionSectionRef}
Expand Down
2 changes: 1 addition & 1 deletion web/components/project/publish-project/modal.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -390,7 +390,7 @@ export const PublishProjectModal: React.FC<Props> = observer(() => {
}}
>
<div className="text-sm">{option.label}</div>
<div className={`w-[18px] h-[18px] relative flex justify-center items-center`}>
<div className={`w-4 h-4 relative flex justify-center items-center`}>
{value.length > 0 && value.includes(option.key) && (
<Check className="h-5 w-5" />
)}
Expand Down
2 changes: 1 addition & 1 deletion web/components/project/sidebar-list-item.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -298,7 +298,7 @@ export const ProjectSidebarListItem: React.FC<Props> = observer((props) => {
leaveFrom="transform scale-100 opacity-100"
leaveTo="transform scale-95 opacity-0"
>
<Disclosure.Panel className={`space-y-2 mt-1 ${isCollapsed ? "" : "ml-[2.25rem]"}`}>
<Disclosure.Panel className={`space-y-1 mt-1 ${isCollapsed ? "" : "ml-[2.25rem]"}`}>
{navigation(workspaceSlug as string, project?.id).map((item) => {
if (
(item.name === "Cycles" && !project.cycle_view) ||
Expand Down
10 changes: 5 additions & 5 deletions web/components/project/sidebar-list.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -116,7 +116,7 @@ export const ProjectSidebarList: FC = observer(() => {
/>
<div
ref={containerRef}
className={`h-full overflow-y-auto px-4 space-y-3 pt-3 ${
className={`h-full overflow-y-auto px-4 space-y-2 ${
isScrolled ? "border-t border-custom-sidebar-border-300" : ""
}`}
>
Expand All @@ -125,15 +125,15 @@ export const ProjectSidebarList: FC = observer(() => {
{(provided) => (
<div ref={provided.innerRef} {...provided.droppableProps}>
{orderedFavProjects && orderedFavProjects.length > 0 && (
<Disclosure as="div" className="flex flex-col space-y-2" defaultOpen={true}>
<Disclosure as="div" className="flex flex-col" defaultOpen={true}>
{({ open }) => (
<>
{!isCollapsed && (
<div className="group flex justify-between items-center text-xs p-1.5 rounded text-custom-sidebar-text-400 hover:bg-custom-sidebar-background-80 w-full">
<Disclosure.Button
as="button"
type="button"
className="group flex items-center gap-1 px-1.5 text-xs font-semibold text-custom-sidebar-text-400 text-left hover:bg-custom-sidebar-background-80 rounded w-full whitespace-nowrap"
className="group flex items-center gap-1 px-1.5 text-sm font-semibold text-custom-sidebar-text-400 text-left hover:bg-custom-sidebar-background-80 rounded w-full whitespace-nowrap"
>
Favorites
{open ? (
Expand Down Expand Up @@ -190,15 +190,15 @@ export const ProjectSidebarList: FC = observer(() => {
{(provided) => (
<div ref={provided.innerRef} {...provided.droppableProps}>
{orderedJoinedProjects && orderedJoinedProjects.length > 0 && (
<Disclosure as="div" className="flex flex-col space-y-2" defaultOpen={true}>
<Disclosure as="div" className="flex flex-col" defaultOpen={true}>
{({ open }) => (
<>
{!isCollapsed && (
<div className="group flex justify-between items-center text-xs p-1.5 rounded text-custom-sidebar-text-400 hover:bg-custom-sidebar-background-80 w-full">
<Disclosure.Button
as="button"
type="button"
className="group flex items-center gap-1 px-1.5 text-xs font-semibold text-custom-sidebar-text-400 text-left hover:bg-custom-sidebar-background-80 rounded w-full whitespace-nowrap"
className="group flex items-center gap-1 px-1.5 text-sm font-semibold text-custom-sidebar-text-400 text-left hover:bg-custom-sidebar-background-80 rounded w-full whitespace-nowrap"
>
Projects
{open ? (
Expand Down
2 changes: 1 addition & 1 deletion web/components/web-view/issue-attachments.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -189,7 +189,7 @@ export const IssueAttachments: React.FC<Props> = (props) => {
setAttachmentDeleteModal(true);
}}
>
<X className="w-[18px] h-[18px] text-custom-text-400" />
<X className="w-4 h-4 text-custom-text-400" />
</button>
)}
</div>
Expand Down
4 changes: 2 additions & 2 deletions web/components/web-view/issue-link-list.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -115,15 +115,15 @@ export const IssueLinks: React.FC<Props> = (props) => {
setSelectedLink(link.id);
}}
>
<Pencil className="w-[18px] h-[18px] text-custom-text-400" />
<Pencil className="w-4 h-4 text-custom-text-400" />
</button>
<button
type="button"
onClick={() => {
setDeleteSelected(link.id);
}}
>
<X className="w-[18px] h-[18px] text-custom-text-400" />
<X className="w-4 h-4 text-custom-text-400" />
</button>
</div>
)}
Expand Down
4 changes: 2 additions & 2 deletions web/components/web-view/sub-issues.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -135,7 +135,7 @@ export const SubIssueList: React.FC<Props> = (props) => {
setIssueSelectedForDelete(subIssue);
}}
>
<X className="w-[18px] h-[18px] text-custom-text-400" />
<X className="w-4 h-4 text-custom-text-400" />
</button>
</div>
))}
Expand All @@ -146,7 +146,7 @@ export const SubIssueList: React.FC<Props> = (props) => {
onClick={() => setIsBottomSheetOpen(true)}
className="flex items-center gap-x-1 mt-3"
>
<PlusIcon className="w-[18px] h-[18px] text-custom-text-400" />
<PlusIcon className="w-4 h-4 text-custom-text-400" />
<p className="text-sm text-custom-text-400">Add sub issue</p>
</button>
</div>
Expand Down
2 changes: 1 addition & 1 deletion web/components/workspace/sidebar-menu.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -60,7 +60,7 @@ export const WorkspaceSidebarMenu = observer(() => {
: "text-custom-sidebar-text-200 hover:bg-custom-sidebar-background-80 focus:bg-custom-sidebar-background-80"
} ${themeStore?.sidebarCollapsed ? "justify-center" : ""}`}
>
{<link.Icon className="h-[18px] w-[18px]" />}
{<link.Icon className="h-4 w-4" />}
{!themeStore?.sidebarCollapsed && link.name}
</div>
</Tooltip>
Expand Down
2 changes: 1 addition & 1 deletion web/pages/[workspaceSlug]/workspace-views/issues.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ const WorkspaceView = () => (
<WorkspaceAuthorizationLayout
breadcrumbs={
<div className="flex gap-2 items-center">
<CheckCircle className="h-[18px] w-[18px] stroke-[1.5]" />
<CheckCircle className="h-4 w-4 stroke-[1.5]" />
<span className="text-sm font-medium">Workspace issues</span>
</div>
}
Expand Down

2 comments on commit 4bd7363

@vercel
Copy link

@vercel vercel bot commented on 4bd7363 Oct 17, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

plane-sh-dev – ./space/

plane-space-dev.vercel.app
plane-sh-dev-git-develop-plane.vercel.app
plane-sh-dev-plane.vercel.app

@vercel
Copy link

@vercel vercel bot commented on 4bd7363 Oct 17, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

plane-dev – ./web/

plane-dev-git-develop-plane.vercel.app
crew42.plane.so
plane-dev-plane.vercel.app
plane-dev.vercel.app

Please sign in to comment.