paulononato/backstage
1
0
Fork 0
Code Issues Pull Requests Actions 47 Packages Projects Releases Wiki Activity

Refactored icons based on feedback

Browse Source 
Signed-off-by: Andre Wanlin <awanlin@rapidrtc.com>
This commit is contained in:
Andre Wanlin
2021-11-03 08:52:42 -05:00
parent 12d43328ea
commit a9b7481cd3
6 changed files with 72 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files
plugins/azure-devops/src/components/AzurePipelinesIcon/AzurePipelinesIcon.tsx
+20 -34
View File
@@ -14,41 +14,27 @@
* limitations under the License.
*/
import { makeStyles, useTheme } from '@material-ui/core';
import { SvgIcon, SvgIconProps } from '@material-ui/core';
import AzurePipelinesSvg from '../../icons/alt-azure-pipelines-icon.svg';
import React from 'react';
const useStyles = makeStyles({
darkMode: {
filter: 'invert(100%)',
},
lightMode: {
filter: 'invert(0%)',
},
});
export const AzurePipelinesIcon = ({
width,
height,
}: {
width: string;
height: string;
}) => {
const theme = useTheme();
const classes = useStyles();
return (
<img
src={AzurePipelinesSvg}
alt="Azure Pipelines"
width={width}
height={height}
className={
theme.palette.type.toString() === 'dark'
? classes.darkMode
: classes.lightMode
}
export const AzurePipelinesIcon = (props: SvgIconProps) => (
<SvgIcon {...props} viewBox="0 0 512 512">
<path
fill="none"
stroke="currentColor"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="32"
d="M461.81 53.81a4.4 4.4 0 00-3.3-3.39c-54.38-13.3-180 34.09-248.13 102.17a294.9 294.9 0 00-33.09 39.08c-21-1.9-42-.3-59.88 7.5-50.49 22.2-65.18 80.18-69.28 105.07a9 9 0 009.8 10.4l81.07-8.9a180.29 180.29 0 001.1 18.3 18.15 18.15 0 005.3 11.09l31.39 31.39a18.15 18.15 0 0011.1 5.3 179.91 179.91 0 0018.19 1.1l-8.89 81a9 9 0 0010.39 9.79c24.9-4 83-18.69 105.07-69.17 7.8-17.9 9.4-38.79 7.6-59.69a293.91 293.91 0 0039.19-33.09c68.38-68 115.47-190.86 102.37-247.95zM298.66 213.67a42.7 42.7 0 1160.38 0 42.65 42.65 0 01-60.38 0z"
/>
);
};
<path
fill="none"
stroke="currentColor"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="32"
d="M109.64 352a45.06 45.06 0 00-26.35 12.84C65.67 382.52 64 448 64 448s65.52-1.67 83.15-19.31A44.73 44.73 0 00160 402.32"
/>
</SvgIcon>
);
plugins/azure-devops/src/components/AzureReposIcon/AzureReposIcon.tsx
+50 -34
View File
@@ -14,41 +14,57 @@
* limitations under the License.
*/
import { makeStyles, useTheme } from '@material-ui/core';
import { SvgIcon, SvgIconProps } from '@material-ui/core';
import AzureReposSvg from '../../icons/alt-azure-repos-icon.svg';
import React from 'react';
const useStyles = makeStyles({
darkMode: {
filter: 'invert(100%)',
},
lightMode: {
filter: 'invert(0%)',
},
});
export const AzureReposIcon = ({
width,
height,
}: {
width: string;
height: string;
}) => {
const theme = useTheme();
const classes = useStyles();
return (
<img
src={AzureReposSvg}
alt="Azure Repos"
width={width}
height={height}
className={
theme.palette.type.toString() === 'dark'
? classes.darkMode
: classes.lightMode
}
export const AzureReposIcon = (props: SvgIconProps) => (
<SvgIcon {...props} viewBox="0 0 512 512">
<circle
fill="none"
stroke="currentColor"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="32"
cx="128"
cy="416"
r="48"
/>
);
};
<path
fill="none"
stroke="currentColor"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="32"
d="M128 144v224M288 160l-64-64 64-64"
/>
<circle
fill="none"
stroke="currentColor"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="32"
cx="128"
cy="96"
r="48"
/>
<circle
fill="none"
stroke="currentColor"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="32"
cx="384"
cy="416"
r="48"
/>
<path
fill="none"
stroke="currentColor"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="32"
d="M240 96h84a60 60 0 0160 60v212"
/>
</SvgIcon>
);
plugins/azure-devops/src/components/BuildTable/BuildTable.tsx
+1 -1
View File
@@ -234,7 +234,7 @@ export const BuildTable = ({ items, loading, error }: BuildTableProps) => {
}}
title={
<Box display="flex" alignItems="center">
<AzurePipelinesIcon width="30px" height="30px" />
<AzurePipelinesIcon style={{ fontSize: 30 }} />
<Box mr={1} />
Azure Pipelines - Builds ({items ? items.length : 0})
</Box>
plugins/azure-devops/src/components/PullRequestTable/PullRequestTable.tsx
+1 -1
View File
@@ -119,7 +119,7 @@ export const PullRequestTable = ({ defaultLimit }: PullRequestTableProps) => {
}}
title={
<Box display="flex" alignItems="center">
<AzureReposIcon width="30px" height="30px" />
<AzureReposIcon style={{ fontSize: 30 }} />
<Box mr={1} />
Azure Repos - Pull Requests ({items ? items.length : 0})
<Box position="absolute" right={320} top={20}>
plugins/azure-devops/src/icons/alt-azure-pipelines-icon.svg
-1
View File
@@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" class="ionicon" viewBox="0 0 512 512"><title>Rocket</title><path d="M461.81 53.81a4.4 4.4 0 00-3.3-3.39c-54.38-13.3-180 34.09-248.13 102.17a294.9 294.9 0 00-33.09 39.08c-21-1.9-42-.3-59.88 7.5-50.49 22.2-65.18 80.18-69.28 105.07a9 9 0 009.8 10.4l81.07-8.9a180.29 180.29 0 001.1 18.3 18.15 18.15 0 005.3 11.09l31.39 31.39a18.15 18.15 0 0011.1 5.3 179.91 179.91 0 0018.19 1.1l-8.89 81a9 9 0 0010.39 9.79c24.9-4 83-18.69 105.07-69.17 7.8-17.9 9.4-38.79 7.6-59.69a293.91 293.91 0 0039.19-33.09c68.38-68 115.47-190.86 102.37-247.95zM298.66 213.67a42.7 42.7 0 1160.38 0 42.65 42.65 0 01-60.38 0z" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32"/><path d="M109.64 352a45.06 45.06 0 00-26.35 12.84C65.67 382.52 64 448 64 448s65.52-1.67 83.15-19.31A44.73 44.73 0 00160 402.32" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32"/></svg>
Side by Side

Before

Width:  |  Height:  |  Size: 965 B

plugins/azure-devops/src/icons/alt-azure-repos-icon.svg
-1
View File
@@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" class="ionicon" viewBox="0 0 512 512"><title>Git Pull Request</title><circle cx="128" cy="416" r="48" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32"/><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M128 144v224M288 160l-64-64 64-64"/><circle cx="128" cy="96" r="48" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32"/><circle cx="384" cy="416" r="48" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32"/><path d="M240 96h84a60 60 0 0160 60v212" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32"/></svg>
Side by Side

Before

Width:  |  Height:  |  Size: 798 B