Fix Bug 57753 - badge Revision is not visible clearly on dark theme
This commit is contained in:
parent
a5650bcf48
commit
d445b9e05d
@ -2517,7 +2517,7 @@ const Dark = {
|
|||||||
|
|
||||||
badge: {
|
badge: {
|
||||||
color: black,
|
color: black,
|
||||||
stroke: "#474747",
|
stroke: "#858585",
|
||||||
fill: "#858585",
|
fill: "#858585",
|
||||||
defaultFill: black,
|
defaultFill: black,
|
||||||
badgeFill: "#F58D31",
|
badgeFill: "#F58D31",
|
||||||
|
@ -0,0 +1,3 @@
|
|||||||
|
<svg width="56" height="18" viewBox="0 0 56 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M1 17.5C0.908082 17.5 0.823367 17.4757 0.750323 17.4334L0.499921 17.8662C0.348169 17.7784 0.221631 17.6518 0.133829 17.5001L0.566608 17.2497C0.524346 17.1766 0.5 17.0919 0.5 17V15.9333H0V14.8667H0.5V12.7333H0V11.6667H0.5V9.53333H0V8.46667H0.5V6.33333H0V5.26667H0.5V3.13333H0V2.06667H0.5V1C0.5 0.908082 0.524346 0.823367 0.566608 0.750323L0.133828 0.499921C0.221631 0.348169 0.348168 0.221631 0.49992 0.133829L0.750323 0.566608C0.823366 0.524346 0.908081 0.5 1 0.5H1.98156V0H2.96313V0.5H4.92625V0H5.90782V0.5H7.87094V0H8.85251V0.5H10.8156V0H11.7972V0.5H13.7603V0H14.7419V0.5H16.705V0H17.6866V0.5H19.6497V0H20.6313V0.5H22.5944V0H23.576V0.5H25.5391V0H26.5207V0.5H28.4838V0H29.4653V0.5H31.4285V0H32.41V0.5H34.3732V0H35.3547V0.5H37.3178V0H38.2994V0.5H40.2625V0H41.2441V0.5H43.2072V0H44.1888V0.5H46.1519V0H47.1335V0.5H49.0966V0H50.0782V0.5H52.0413V0H53.0229V0.5H54.0044C54.1157 0.5 54.2134 0.534414 54.2931 0.591202L54.5833 0.184012C54.7517 0.304053 54.88 0.474401 54.9487 0.66949L54.4771 0.83568C54.5097 0.927971 54.5157 1.03144 54.4849 1.13833L54.2467 1.96574L54.7272 2.10407L54.489 2.93148L54.0085 2.79315L53.5321 4.44797L54.0126 4.5863L53.7744 5.4137L53.2939 5.27538L52.8175 6.9302L53.298 7.06852L53.0598 7.89593L52.5793 7.75761L52.3411 8.58502C52.3151 8.67527 52.2977 8.76735 52.2891 8.86005L52.7869 8.9067C52.7811 8.96876 52.7811 9.03124 52.7869 9.0933L52.2891 9.13995C52.2977 9.23265 52.3151 9.32473 52.3411 9.41498L52.5793 10.2424L53.0598 10.1041L53.298 10.9315L52.8175 11.0698L53.2939 12.7246L53.7744 12.5863L54.0126 13.4137L53.5321 13.552L54.0085 15.2069L54.489 15.0685L54.7272 15.8959L54.2467 16.0343L54.4849 16.8617C54.5157 16.9686 54.5097 17.072 54.4771 17.1643L54.9487 17.3305C54.88 17.5256 54.7517 17.6959 54.5833 17.816L54.2931 17.4088C54.2134 17.4656 54.1157 17.5 54.0044 17.5H53.0229V18H52.0413V17.5H50.0782V18H49.0966V17.5H47.1335V18H46.1519V17.5H44.1888V18H43.2072V17.5H41.2441V18H40.2625V17.5H38.2994V18H37.3179V17.5H35.3547V18H34.3732V17.5H32.41V18H31.4285V17.5H29.4653V18H28.4838V17.5H26.5207V18H25.5391V17.5H23.576V18H22.5944V17.5H20.6313V18H19.6497V17.5H17.6866V18H16.705V17.5H14.7419V18H13.7603V17.5H11.7972V18H10.8156V17.5H8.85251V18H7.87094V17.5H5.90782V18H4.92626V17.5H2.96313V18H1.98156V17.5H1Z" stroke="#A3A9AE" stroke-linejoin="round" stroke-dasharray="2 1"/>
|
||||||
|
</svg>
|
After Width: | Height: | Size: 2.3 KiB |
@ -1,6 +1,36 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
|
import styled, { css } from "styled-components";
|
||||||
import Text from "@appserver/components/text";
|
import Text from "@appserver/components/text";
|
||||||
import Box from "@appserver/components/box";
|
import Box from "@appserver/components/box";
|
||||||
|
import VersionSvg from "../../../../../public/images/versionrevision_active.react.svg";
|
||||||
|
|
||||||
|
const StyledVersionSvg = styled(VersionSvg)`
|
||||||
|
path {
|
||||||
|
fill: ${(props) =>
|
||||||
|
!props.isVersion
|
||||||
|
? props.theme.filesVersionHistory.badge.defaultFill
|
||||||
|
: props.index === 0
|
||||||
|
? props.theme.filesVersionHistory.badge.fill
|
||||||
|
: props.theme.filesVersionHistory.badge.badgeFill};
|
||||||
|
|
||||||
|
stroke: ${(props) =>
|
||||||
|
!props.isVersion
|
||||||
|
? props.theme.filesVersionHistory.badge.stroke
|
||||||
|
: props.index === 0
|
||||||
|
? props.theme.filesVersionHistory.badge.fill
|
||||||
|
: props.theme.filesVersionHistory.badge.badgeFill};
|
||||||
|
|
||||||
|
stroke-dasharray: ${(props) => (props.isVersion ? "2 0" : "3 1")};
|
||||||
|
stroke-linejoin: ${(props) => (props.isVersion ? "unset" : "round")};
|
||||||
|
|
||||||
|
${(props) =>
|
||||||
|
props.isVersion &&
|
||||||
|
css`
|
||||||
|
stroke-width: 2;
|
||||||
|
`}
|
||||||
|
}
|
||||||
|
`;
|
||||||
|
|
||||||
const VersionBadge = ({
|
const VersionBadge = ({
|
||||||
className,
|
className,
|
||||||
isVersion,
|
isVersion,
|
||||||
@ -11,29 +41,7 @@ const VersionBadge = ({
|
|||||||
...rest
|
...rest
|
||||||
}) => (
|
}) => (
|
||||||
<Box className={className} marginProp="0 8px" displayProp="flex" {...rest}>
|
<Box className={className} marginProp="0 8px" displayProp="flex" {...rest}>
|
||||||
<svg
|
<StyledVersionSvg isVersion={isVersion} theme={theme} index={index} />
|
||||||
width="55"
|
|
||||||
height="18"
|
|
||||||
viewBox="0 0 55 18"
|
|
||||||
fill="none"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
stroke={isVersion ? "none" : theme.filesVersionHistory.badge.stroke}
|
|
||||||
strokeDasharray={isVersion ? "none" : "2px"}
|
|
||||||
strokeWidth={isVersion ? "none" : "2px"}
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
fillRule="evenodd"
|
|
||||||
clipRule="evenodd"
|
|
||||||
d="M0 1C0 0.447716 0.447715 0 1 0L53.9994 0C54.6787 0 55.1603 0.662806 54.9505 1.3089L52.5529 8.6911C52.4877 8.89187 52.4877 9.10813 52.5529 9.3089L54.9505 16.6911C55.1603 17.3372 54.6787 18 53.9994 18H0.999999C0.447714 18 0 17.5523 0 17V1Z"
|
|
||||||
fill={
|
|
||||||
!isVersion
|
|
||||||
? theme.filesVersionHistory.badge.defaultFill
|
|
||||||
: index === 0
|
|
||||||
? theme.filesVersionHistory.badge.fill
|
|
||||||
: theme.filesVersionHistory.badge.badgeFill
|
|
||||||
}
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
<Text
|
<Text
|
||||||
className="version_badge-text"
|
className="version_badge-text"
|
||||||
color={theme.filesVersionHistory.badge.color}
|
color={theme.filesVersionHistory.badge.color}
|
||||||
|
Loading…
Reference in New Issue
Block a user