Browse Source

fix(ui): dark mode bugs (#27409)

* fix(ui): dark mode bugs

* fixed issue owners panel
Robin Rendle 3 years ago
parent
commit
93a42d99db

+ 2 - 0
static/app/components/stream/group.tsx

@@ -750,6 +750,7 @@ const MenuItemCount = styled(({value, ...p}) => (
   </div>
 ))`
   ${menuItemStatStyles};
+  color: ${p => p.theme.subText};
 `;
 
 const MenuItemPercent = styled('div')`
@@ -761,6 +762,7 @@ const MenuItemText = styled('div')`
   font-weight: normal;
   text-align: left;
   padding-right: ${space(1)};
+  color: ${p => p.theme.textColor};
 `;
 
 const ChartWrapper = styled('div')`

+ 3 - 2
static/app/styles/global.tsx

@@ -187,10 +187,11 @@ const styles = (theme: Theme, isDark: boolean) => css`
         }
         .dropdown-menu {
           color: ${theme.textColor};
-          background-color: ${theme.background};
+          background-color: ${theme.background} !important;
+          border: 1px solid ${theme.gray400};
           &:after,
           &:before {
-            border-bottom-color: ${theme.background};
+            border-top-color: ${theme.gray400} !important;
           }
         }
         .context-summary .context-item.darwin .context-item-icon,

+ 4 - 4
static/app/views/settings/project/projectOwnership/rulesPanel.tsx

@@ -114,11 +114,11 @@ const RulesHeader = styled('div')`
   grid-template-columns: 2fr 1fr;
   grid-template-rows: 45px 1fr 1fr 1fr 1fr;
   grid-template-areas: 'title tag' 'repository repository' '. .' '. .' 'detail detail';
-  border: 1px solid #c6becf;
+  border: 1px solid ${p => p.theme.border};
   border-radius: 4px 0 0 4px;
   border-right: none;
   box-shadow: 0 2px 0 rgb(37 11 54 / 4%);
-  background-color: #ffffff;
+  background-color: ${p => p.theme.background};
 `;
 const TitleContainer = styled('div')`
   grid-area: title;
@@ -141,14 +141,14 @@ const ReadOnlyTag = styled(Tag)`
 const Repository = styled('div')`
   grid-area: repository;
   padding-left: calc(${space(2)} + ${space(3)});
-  color: #9386a0;
+  color: ${p => p.theme.textColor};
   font-size: 14px;
 `;
 const Detail = styled('div')`
   grid-area: detail;
   align-self: end;
   padding: 0 ${space(2)} ${space(2)} ${space(2)};
-  color: #9386a0;
+  color: ${p => p.theme.textColor};
   font-size: 14px;
   line-height: 1.4;
 `;