RageStudio/comty
1
0
Fork 0
mirror of https://github.com/ragestudio/comty.git synced 2025-06-09 18:44:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

improve badges style

Browse Source
This commit is contained in:
srgooglo 2022-10-17 16:43:05 +02:00
parent f7989599de
commit a6f41d5fd2
3 changed files with 103 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
packages/app/src/pages/account/index.jsx
View File

@ -3,7 +3,7 @@ import * as antd from "antd"
import classnames from "classnames"
import Loadable from "react-loadable"
import { Icons } from "components/Icons"
import { Icons, createIconRender } from "components/Icons"
import { Image, Skeleton, FollowButton } from "components"
import { Session, User } from "models"
@ -65,9 +65,11 @@ const UserBadges = React.memo((props) => {
}
return () => badgesData.map((badge, index) => {
return <antd.Tag color={badge.color ?? "default"} key={index} id={badge.name} className="badge">
<span>{badge.label}</span>
</antd.Tag>
return <antd.Tooltip placement="bottom" title={badge.description ?? "An badge"}>
<antd.Tag color={badge.color ?? "default"} key={index} id={badge.name} icon={createIconRender(badge.icon)} className="badge">
<span>{badge.label}</span>
</antd.Tag>
</antd.Tooltip>
})
},
loading: antd.Skeleton,

2
packages/app/src/pages/account/index.less
View File

@ -145,8 +145,6 @@
position: relative;
z-index: 140;
height: 5vh;
display: flex;
flex-direction: row;

97
packages/app/src/theme/fixments.less
View File

@ -263,4 +263,101 @@
svg {
color: var(--ant-success-color) !important;
}
}
// FIX TAGS COLORS
.ant-tag-red {
svg,
span {
color: #cf1322 !important;
}
}
.ant-tag-volcano {
svg,
span {
color: #d4380d !important;
}
}
.ant-tag-orange {
svg,
span {
color: #d46b08 !important;
}
}
.ant-tag-gold {
svg,
span {
color: #d48806 !important;
}
}
.ant-tag-yellow {
svg,
span {
color: #d4b106 !important;
}
}
.ant-tag-lime {
svg,
span {
color: #7cb305 !important;
}
}
.ant-tag-green {
svg,
span {
color: #389e0d !important;
}
}
.ant-tag-cyan {
svg,
span {
color: #08979c !important;
}
}
.ant-tag-blue {
svg,
span {
color: #096dd9 !important;
}
}
.ant-tag-geekblue {
svg,
span {
color: #1d39c4 !important;
}
}
.ant-tag-purple {
svg,
span {
color: #531dab !important;
}
}
.ant-tag-magenta {
svg,
span {
color: #c41d7f !important;
}
}