fix: consider reset css in BackgroundJobsPanel (SHRUI-213) (#1087)

* fix: adjust job row styles * fix: fix size of Icon
kufu · Oct 21, 2020 · 9bbc279 · 9bbc279
1 parent eeb9bda
commit 9bbc279
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 3 deletions.
diff --git a/src/components/BackgroundJobsPanel/BackgroundJobsPanel.tsx b/src/components/BackgroundJobsPanel/BackgroundJobsPanel.tsx
@@ -153,16 +153,17 @@ const Job = styled.li<{ themes: Theme }>(({ themes }) => {
   const { pxToRem, space } = themes.size
   return css`
     display: flex;
-    align-items: flex-start;
+    align-items: center;
     flex-wrap: nowrap;
-    line-height: 1rem;
+    line-height: normal;
     :not(:first-child) {
       margin-top: ${pxToRem(space.XS)};
     }
   `
 })
 const JobIconWrapper = styled.div`
   flex-shrink: 0;
+  line-height: 0;
 `
 const JobName = styled(OmittableJobText)<{ themes: Theme }>(({ themes }) => {
   const { font, pxToRem, space } = themes.size

diff --git a/src/components/BackgroundJobsPanel/JobIcon.tsx b/src/components/BackgroundJobsPanel/JobIcon.tsx
@@ -12,7 +12,7 @@ export const JobIcon: FC<Props> = ({ status }) => {
   const name = getIconName(status)
   const color = useIconColor(status)
 
-  return <Icon name={name} color={color} />
+  return <Icon name={name} color={color} size={16} />
 }
 
 function getIconName(status: Status): ComponentProps<typeof Icon>['name'] {

diff --git a/src/components/BackgroundJobsPanel/OmittableJobText.tsx b/src/components/BackgroundJobsPanel/OmittableJobText.tsx
@@ -35,6 +35,7 @@ const Wrapper = styled.div`
   overflow: hidden;
 `
 const Tooltip = styled(LightTooltip)`
+  display: block;
   text-overflow: ellipsis;
   overflow: hidden;
 `