【私域操盘手】 操盘手端UI - 场景获客

This commit is contained in:
柳清爽
2025-03-24 16:28:04 +08:00
parent c7bd865dad
commit 4e96b79acb
8 changed files with 233 additions and 48 deletions

View File

@@ -3,11 +3,12 @@
<!-- 顶部导航栏 --> <!-- 顶部导航栏 -->
<view class="header"> <view class="header">
<view class="back-icon" @click="goBack"> <view class="back-icon" @click="goBack">
<u-icon name="arrow-left" size="26"></u-icon> <u-icon name="arrow-left" size="42" color="black"></u-icon>
</view> </view>
<view class="title">场景获客</view> <view class="title">场景获客</view>
<view class="header-icons"> <view class="header-icons">
<u-icon name="plus" size="26" class="icon-add" @click="createNewPlan"></u-icon> <u-icon name="plus" size="30" color="#fff" class="icon-add" @click="createNewPlan"></u-icon>
<text>新建计划</text>
</view> </view>
</view> </view>
@@ -25,7 +26,7 @@
<view class="data-value">156</view> <view class="data-value">156</view>
</view> </view>
<view class="data-trend up"> <view class="data-trend up">
<u-icon name="arrow-up-fill" size="16" color="#2fc25b"></u-icon> <image src="/static/images/icons/trend-up.svg" style="width: 32rpx; height: 32rpx;"></image>
<text>+12.5%</text> <text>+12.5%</text>
</view> </view>
</view> </view>
@@ -43,7 +44,7 @@
<view class="data-value">89</view> <view class="data-value">89</view>
</view> </view>
<view class="data-trend up"> <view class="data-trend up">
<u-icon name="arrow-up-fill" size="16" color="#2fc25b"></u-icon> <image src="/static/images/icons/trend-up.svg" style="width: 32rpx; height: 32rpx;"></image>
<text>+8.3%</text> <text>+8.3%</text>
</view> </view>
</view> </view>
@@ -61,7 +62,7 @@
<view class="data-value">42</view> <view class="data-value">42</view>
</view> </view>
<view class="data-trend up"> <view class="data-trend up">
<u-icon name="arrow-up-fill" size="16" color="#2fc25b"></u-icon> <image src="/static/images/icons/trend-up.svg" style="width: 32rpx; height: 32rpx;"></image>
<text>+15.8%</text> <text>+15.8%</text>
</view> </view>
</view> </view>
@@ -79,7 +80,7 @@
<view class="data-value">234</view> <view class="data-value">234</view>
</view> </view>
<view class="data-trend up"> <view class="data-trend up">
<u-icon name="arrow-up-fill" size="16" color="#2fc25b"></u-icon> <image src="/static/images/icons/trend-up.svg" style="width: 32rpx; height: 32rpx;"></image>
<text>+15.7%</text> <text>+15.7%</text>
</view> </view>
</view> </view>
@@ -97,7 +98,7 @@
<view class="data-value">167</view> <view class="data-value">167</view>
</view> </view>
<view class="data-trend up"> <view class="data-trend up">
<u-icon name="arrow-up-fill" size="16" color="#2fc25b"></u-icon> <image src="/static/images/icons/trend-up.svg" style="width: 32rpx; height: 32rpx;"></image>
<text>+10.2%</text> <text>+10.2%</text>
</view> </view>
</view> </view>
@@ -115,7 +116,7 @@
<view class="data-value">145</view> <view class="data-value">145</view>
</view> </view>
<view class="data-trend up"> <view class="data-trend up">
<u-icon name="arrow-up-fill" size="16" color="#2fc25b"></u-icon> <image src="/static/images/icons/trend-up.svg" style="width: 32rpx; height: 32rpx;"></image>
<text>+11.2%</text> <text>+11.2%</text>
</view> </view>
</view> </view>
@@ -129,9 +130,9 @@
</view> </view>
<!-- AI智能加友 --> <!-- AI智能加友 -->
<view class="channel-card" @click="navigateToDetail('ai-friend')"> <view class="channel-card channel-card-xw" @click="navigateToDetail('ai-friend')">
<view class="channel-icon bg-blue"> <view class="channel-icon">
<u-icon name="star" size="28" color="#ffffff"></u-icon> <image src="/static/images/icons/aipa.svg" mode="aspectFit" class="ai-icon"></image>
</view> </view>
<view class="channel-name">AI智能加友</view> <view class="channel-name">AI智能加友</view>
<view class="channel-desc">智能分析目标用户画像自动筛选优质客户</view> <view class="channel-desc">智能分析目标用户画像自动筛选优质客户</view>
@@ -141,35 +142,35 @@
<view class="data-value">245</view> <view class="data-value">245</view>
</view> </view>
<view class="data-trend up"> <view class="data-trend up">
<u-icon name="arrow-up-fill" size="16" color="#2fc25b"></u-icon> <image src="/static/images/icons/trend-up.svg" style="width: 32rpx; height: 32rpx;"></image>
<text>+18.5%</text> <text>+18.5%</text>
</view> </view>
</view> </view>
</view> </view>
<!-- AI群引流 --> <!-- AI智能群控 -->
<view class="channel-card" @click="navigateToDetail('ai-group')"> <view class="channel-card channel-card-xw" @click="navigateToDetail('ai-group')">
<view class="channel-icon bg-blue"> <view class="channel-icon">
<u-icon name="star" size="28" color="#ffffff"></u-icon> <image src="/static/images/icons/aipa.svg" mode="aspectFit" class="ai-icon"></image>
</view> </view>
<view class="channel-name">AI群引流</view> <view class="channel-name">AI智能群控</view>
<view class="channel-desc">智能推聊互动提高群活跃度和转化率</view> <view class="channel-desc">一键管理多个群聊自动回复数据分析</view>
<view class="channel-data"> <view class="channel-data">
<view class="data-item"> <view class="data-item">
<view class="data-label">今日</view> <view class="data-label">今日</view>
<view class="data-value">178</view> <view class="data-value">128</view>
</view> </view>
<view class="data-trend up"> <view class="data-trend up">
<u-icon name="arrow-up-fill" size="16" color="#2fc25b"></u-icon> <image src="/static/images/icons/trend-up.svg" style="width: 32rpx; height: 32rpx;"></image>
<text>+15.2%</text> <text>+9.7%</text>
</view> </view>
</view> </view>
</view> </view>
<!-- AI场景转化 --> <!-- AI场景转化 -->
<view class="channel-card" @click="navigateToDetail('ai-convert')"> <view class="channel-card channel-card-xw" @click="navigateToDetail('ai-convert')">
<view class="channel-icon bg-blue"> <view class="channel-icon">
<u-icon name="star" size="28" color="#ffffff"></u-icon> <image src="/static/images/icons/aipa.svg" mode="aspectFit" class="ai-icon"></image>
</view> </view>
<view class="channel-name">AI场景转化</view> <view class="channel-name">AI场景转化</view>
<view class="channel-desc">多场景智能营销提升获客转化效果</view> <view class="channel-desc">多场景智能营销提升获客转化效果</view>
@@ -179,7 +180,7 @@
<view class="data-value">134</view> <view class="data-value">134</view>
</view> </view>
<view class="data-trend up"> <view class="data-trend up">
<u-icon name="arrow-up-fill" size="16" color="#2fc25b"></u-icon> <image src="/static/images/icons/trend-up.svg" style="width: 32rpx; height: 32rpx;"></image>
<text>+14.3%</text> <text>+14.3%</text>
</view> </view>
</view> </view>
@@ -277,7 +278,7 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.scenarios-container { .scenarios-container {
min-height: 100vh; min-height: 100vh;
background-color: #f5f5f5; background-color: #f9fafb;
position: relative; position: relative;
padding-bottom: 150rpx; /* 为底部导航栏预留空间 */ padding-bottom: 150rpx; /* 为底部导航栏预留空间 */
} }
@@ -286,26 +287,43 @@ export default {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
padding: 40rpx; padding: 25rpx 30rpx;
background-color: #fff; background-color: #fff;
position: relative; border-bottom: 1px solid #e5e5e5;
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 999;
.back-icon { .back-icon {
width: 48rpx; width: 60rpx;
color: #000;
padding: 10rpx;
border-radius: 50%;
&:active {
background-color: rgba(0, 0, 0, 0.05);
}
} }
.title { .title {
position: absolute; position: absolute;
left: 50%;
transform: translateX(-50%);
font-size: 40rpx; font-size: 40rpx;
font-weight: bold; font-weight: bold;
color: #333; color: #2563EB;
float: left;
margin-left: 70rpx;
} }
.header-icons { .header-icons {
display: flex; display: flex;
align-items: center; align-items: center;
background-color: #2563EB;
border-radius: 20rpx;
padding: 15rpx 30rpx;
color: #fff;
text-indent: 15rpx;
} }
} }
@@ -313,19 +331,25 @@ export default {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
padding: 15rpx; padding: 15rpx;
margin-top: 130rpx; // 添加顶部边距为固定header留出空间
.channel-card { .channel-card {
width: calc(50% - 15rpx); width: calc(50% - 30rpx);
margin: 7.5rpx; margin: 15rpx;
background-color: #fff; background-color: #fff;
border-radius: 16rpx; border-radius: 35rpx;
padding: 20rpx 15rpx; padding: 35rpx 20rpx;
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.05); box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.05);
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
box-sizing: border-box; box-sizing: border-box;
// AI智能获客栏目下的卡片特殊背景色
.section-title + & {
background-color: #F8FBFF;
}
.channel-icon { .channel-icon {
width: 80rpx; width: 80rpx;
height: 80rpx; height: 80rpx;
@@ -358,13 +382,16 @@ export default {
&.bg-wechat { &.bg-wechat {
background-color: #07c160; background-color: #07c160;
} }
&.bg-purple {
background-color: #8a2be2;
}
} }
.channel-name { .channel-name {
font-size: 28rpx; font-size: 30rpx;
font-weight: bold; color: #2563EB;
color: #333; margin: 15rpx;
margin-bottom: 15rpx;
} }
.channel-desc { .channel-desc {
@@ -372,7 +399,7 @@ export default {
color: #666; color: #666;
text-align: center; text-align: center;
margin-bottom: 15rpx; margin-bottom: 15rpx;
height: 68rpx; height: 80rpx;
display: -webkit-box; display: -webkit-box;
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
-webkit-line-clamp: 2; -webkit-line-clamp: 2;
@@ -381,21 +408,34 @@ export default {
.channel-data { .channel-data {
width: 100%; width: 100%;
padding: 0 10rpx;
display: flex; display: flex;
justify-content: space-between; flex-direction: column;
align-items: center; align-items: center;
.data-item { .data-item {
display: flex; display: flex;
align-items: center; align-items: center;
margin-bottom: 10rpx;
.data-label { .data-label {
display: flex;
align-items: center;
font-size: 24rpx; font-size: 24rpx;
color: #999; color: #999;
&::before {
content: '';
display: inline-block;
width: 36rpx;
height: 36rpx;
margin-right: 6rpx;
background: url('/static/images/icons/user-label.svg') no-repeat center/contain;
}
} }
.data-value { .data-value {
font-size: 32rpx; font-size: 38rpx;
font-weight: bold; font-weight: bold;
color: #333; color: #333;
} }
@@ -404,7 +444,8 @@ export default {
.data-trend { .data-trend {
display: flex; display: flex;
align-items: center; align-items: center;
font-size: 22rpx; font-size: 28rpx;
text-indent: 15rpx;
&.up { &.up {
color: #2fc25b; color: #2fc25b;
@@ -416,6 +457,20 @@ export default {
} }
} }
} }
.channel-card-xw {
background-color: #F8FBFF !important;
border: 6rpx solid #DBEAFE !important;
.channel-icon {
background: none !important;
.ai-icon {
width: 90rpx;
height: 90rpx;
}
}
}
} }
.section-title { .section-title {
@@ -436,12 +491,12 @@ export default {
} }
.beta-tag { .beta-tag {
font-size: 22rpx; font-size: 25rpx;
color: #4080ff; color: #4080ff;
background-color: #ecf5ff; background-color: #ecf5ff;
padding: 2rpx 10rpx; padding: 5rpx 20rpx;
border-radius: 10rpx; border-radius: 20rpx;
margin-left: 10rpx; margin-left: 20rpx;
} }
} }
</style> </style>

View File

@@ -0,0 +1,33 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<!-- 转化漏斗 -->
<path d="M24 24H56L44 44V56L36 60V44L24 24Z"
stroke="#4080ff"
stroke-width="3"
fill="none"/>
<!-- 数据流动线 -->
<path d="M28 28L32 32M36 28L40 32M44 28L48 32"
stroke="#4080ff"
stroke-width="2"
stroke-linecap="round"/>
<!-- 转化指示箭头 -->
<path d="M34 48L40 52L46 48"
stroke="#4080ff"
stroke-width="2.5"
stroke-linecap="round"
stroke-linejoin="round"/>
<!-- 外圈效果 -->
<circle cx="40" cy="40" r="28"
stroke="#4080ff"
stroke-width="2"
stroke-dasharray="4 4"
fill="none"/>
<!-- 装饰点 -->
<circle cx="32" cy="32" r="2" fill="#4080ff"/>
<circle cx="40" cy="32" r="2" fill="#4080ff"/>
<circle cx="48" cy="32" r="2" fill="#4080ff"/>
</svg>

After

Width:  |  Height:  |  Size: 978 B

View File

@@ -0,0 +1,27 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<!-- 大脑图形 -->
<path d="M40 20C48.8366 20 56 27.1634 56 36C56 44.8366 48.8366 52 40 52C31.1634 52 24 44.8366 24 36C24 27.1634 31.1634 20 40 20Z"
stroke="#4080ff"
stroke-width="3"
fill="none"/>
<!-- 连接线路 -->
<path d="M32 32C36 36 44 36 48 32M36 40C40 44 44 40 48 44"
stroke="#4080ff"
stroke-width="3"
stroke-linecap="round"/>
<!-- 圆点装饰 -->
<circle cx="32" cy="32" r="2" fill="#4080ff"/>
<circle cx="48" cy="32" r="2" fill="#4080ff"/>
<circle cx="36" cy="44" r="2" fill="#4080ff"/>
<circle cx="48" cy="44" r="2" fill="#4080ff"/>
<!-- 外圈光环效果 -->
<circle cx="40" cy="36" r="24"
stroke="#4080ff"
stroke-width="2"
stroke-dasharray="4 4"
fill="none"/>
</svg>

After

Width:  |  Height:  |  Size: 947 B

View File

@@ -0,0 +1,51 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<!-- 中心控制器 -->
<rect x="32" y="32" width="16" height="16" rx="4"
stroke="#4080ff"
stroke-width="3"
fill="none"/>
<!-- 连接的设备 -->
<circle cx="24" cy="24" r="6"
stroke="#4080ff"
stroke-width="2.5"
fill="none"/>
<circle cx="56" cy="24" r="6"
stroke="#4080ff"
stroke-width="2.5"
fill="none"/>
<circle cx="24" cy="56" r="6"
stroke="#4080ff"
stroke-width="2.5"
fill="none"/>
<circle cx="56" cy="56" r="6"
stroke="#4080ff"
stroke-width="2.5"
fill="none"/>
<!-- 连接线 -->
<line x1="28" y1="28" x2="32" y2="32"
stroke="#4080ff"
stroke-width="2"
stroke-linecap="round"/>
<line x1="52" y1="28" x2="48" y2="32"
stroke="#4080ff"
stroke-width="2"
stroke-linecap="round"/>
<line x1="28" y1="52" x2="32" y2="48"
stroke="#4080ff"
stroke-width="2"
stroke-linecap="round"/>
<line x1="52" y1="52" x2="48" y2="48"
stroke="#4080ff"
stroke-width="2"
stroke-linecap="round"/>
<!-- 脉冲圆环 -->
<circle cx="40" cy="40" r="28"
stroke="#4080ff"
stroke-width="2"
stroke-dasharray="4 4"
fill="none"/>
</svg>

After

Width:  |  Height:  |  Size: 1.4 KiB

View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 45 41" width="45" height="41"><g stroke-width="2" fill="none" stroke-linecap="butt" stroke="#95bcfb" data-c-stroke="95bcfb"><path d="M 26.80 15.12 A 1.41 1.41 0.0 0 1 25.89 14.20 L 23.36 6.16 A 1.41 1.41 0.0 0 0 20.67 6.16 L 18.11 14.19 A 1.41 1.41 0.0 0 1 17.19 15.10 L 9.15 17.63 A 1.41 1.41 0.0 0 0 9.15 20.32 L 17.18 22.88 A 1.41 1.41 0.0 0 1 18.09 23.80 L 20.62 31.84 A 1.41 1.41 0.0 0 0 23.31 31.84 L 25.87 23.81 A 1.41 1.41 0.0 0 1 26.79 22.90 L 34.83 20.37 A 1.41 1.41 0.0 0 0 34.83 17.68 L 26.80 15.12"/><path d="M28.11 10.25Q28.11 11.47 30.14 11.46A.56.56 0 0 1 30.7 12.03Q30.69 13.98 31.99 13.98 33.29 13.98 33.28 12.04A.56.56 0 0 1 33.85 11.47Q35.88 11.49 35.88 10.26 35.88 9.04 33.85 9.05A.56.56 0 0 1 33.29 8.48Q33.31 6.54 32 6.53 30.7 6.53 30.71 8.48A.56.56 0 0 1 30.14 9.04Q28.11 9.03 28.11 10.25M14.4003 27.0011A.76.76 0 0 0 14.3853 25.9265L12.507 24.0999A.76.76 0 0 0 11.4323 24.1149L9.6197 25.9789A.76.76 0 0 0 9.6347 27.0535L11.513 28.8801A.76.76 0 0 0 12.5877 28.8651L14.4003 27.0011M12.63 19.45Q15.63 19.39 18.39 20.52A3.79 3.77-86.1 0 1 20.62 23.09L21.72 27.43A.3.3 0 0 0 22.31 27.41Q22.75 25.03 23.51 22.75C24.4 20.07 27.56 19.89 30.66 19.23A.27.27 0 0 0 30.63 18.69Q28.17 18.46 25.31 17.32C23.17 16.47 22.95 12.98 22.35 10.8A.31.31 0 0 0 21.75 10.8C21.19 12.95 20.54 17.14 18.1 17.65Q13.95 18.52 12.56 19.17A.15.15 0 0 0 12.63 19.45"/></g><path fill="#eff6ff" d="M 45.00 0.00 L 45.00 41.00 L 0.00 41.00 L 0.00 0.00 L 45.00 0.00 Z M 26.80 15.12 A 1.41 1.41 0.0 0 1 25.89 14.20 L 23.36 6.16 A 1.41 1.41 0.0 0 0 20.67 6.16 L 18.11 14.19 A 1.41 1.41 0.0 0 1 17.19 15.10 L 9.15 17.63 A 1.41 1.41 0.0 0 0 9.15 20.32 L 17.18 22.88 A 1.41 1.41 0.0 0 1 18.09 23.80 L 20.62 31.84 A 1.41 1.41 0.0 0 0 23.31 31.84 L 25.87 23.81 A 1.41 1.41 0.0 0 1 26.79 22.90 L 34.83 20.37 A 1.41 1.41 0.0 0 0 34.83 17.68 L 26.80 15.12 Z M 28.11 10.25 Q 28.11 11.47 30.14 11.46 A 0.56 0.56 0.0 0 1 30.70 12.03 Q 30.69 13.98 31.99 13.98 Q 33.29 13.98 33.28 12.04 A 0.56 0.56 0.0 0 1 33.85 11.47 Q 35.88 11.49 35.88 10.26 Q 35.88 9.04 33.85 9.05 A 0.56 0.56 0.0 0 1 33.29 8.48 Q 33.31 6.54 32.00 6.53 Q 30.70 6.53 30.71 8.48 A 0.56 0.56 0.0 0 1 30.14 9.04 Q 28.11 9.03 28.11 10.25 Z M 14.4003 27.0011 A 0.76 0.76 0.0 0 0 14.3853 25.9265 L 12.5070 24.0999 A 0.76 0.76 0.0 0 0 11.4323 24.1149 L 9.6197 25.9789 A 0.76 0.76 0.0 0 0 9.6347 27.0535 L 11.5130 28.8801 A 0.76 0.76 0.0 0 0 12.5877 28.8651 L 14.4003 27.0011 Z" data-c-fill="eff6ff" fill-opacity="0"/><path fill="#3b82f6" d="M 26.80 15.12 L 34.83 17.68 A 1.41 1.41 0.0 0 1 34.83 20.37 L 26.79 22.90 A 1.41 1.41 0.0 0 0 25.87 23.81 L 23.31 31.84 A 1.41 1.41 0.0 0 1 20.62 31.84 L 18.09 23.80 A 1.41 1.41 0.0 0 0 17.18 22.88 L 9.15 20.32 A 1.41 1.41 0.0 0 1 9.15 17.63 L 17.19 15.10 A 1.41 1.41 0.0 0 0 18.11 14.19 L 20.67 6.16 A 1.41 1.41 0.0 0 1 23.36 6.16 L 25.89 14.20 A 1.41 1.41 0.0 0 0 26.80 15.12 Z M 12.63 19.45 Q 15.63 19.39 18.39 20.52 A 3.79 3.77 -86.1 0 1 20.62 23.09 L 21.72 27.43 A 0.30 0.30 0.0 0 0 22.31 27.41 Q 22.75 25.03 23.51 22.75 C 24.40 20.07 27.56 19.89 30.66 19.23 A 0.27 0.27 0.0 0 0 30.63 18.69 Q 28.17 18.46 25.31 17.32 C 23.17 16.47 22.95 12.98 22.35 10.80 A 0.31 0.31 0.0 0 0 21.75 10.80 C 21.19 12.95 20.54 17.14 18.10 17.65 Q 13.95 18.52 12.56 19.17 A 0.15 0.15 0.0 0 0 12.63 19.45 Z" data-c-fill="3b82f6"/><path fill="#3b82f6" d="M 32.00 6.53 Q 33.31 6.54 33.29 8.48 A 0.56 0.56 0.0 0 0 33.85 9.05 Q 35.88 9.04 35.88 10.26 Q 35.88 11.49 33.85 11.47 A 0.56 0.56 0.0 0 0 33.28 12.04 Q 33.29 13.98 31.99 13.98 Q 30.69 13.98 30.70 12.03 A 0.56 0.56 0.0 0 0 30.14 11.46 Q 28.11 11.47 28.11 10.25 Q 28.11 9.03 30.14 9.04 A 0.56 0.56 0.0 0 0 30.71 8.48 Q 30.70 6.53 32.00 6.53 Z" data-c-fill="3b82f6"/><path fill="#eff6ff" d="M 12.56 19.17 Q 13.95 18.52 18.10 17.65 C 20.54 17.14 21.19 12.95 21.75 10.80 A 0.31 0.31 0.0 0 1 22.35 10.80 C 22.95 12.98 23.17 16.47 25.31 17.32 Q 28.17 18.46 30.63 18.69 A 0.27 0.27 0.0 0 1 30.66 19.23 C 27.56 19.89 24.40 20.07 23.51 22.75 Q 22.75 25.03 22.31 27.41 A 0.30 0.30 0.0 0 1 21.72 27.43 L 20.62 23.09 A 3.79 3.77 -86.1 0 0 18.39 20.52 Q 15.63 19.39 12.63 19.45 A 0.15 0.15 0.0 0 1 12.56 19.17 Z" data-c-fill="eff6ff" fill-opacity="0"/><rect fill="#3b82f6" x="-2.07" y="-2.06" transform="rotate(44.2 -26.614 28.034)" width="4.14" height="4.12" rx=".76" data-c-fill="3b82f6"/></svg>

After

Width:  |  Height:  |  Size: 4.3 KiB

View File

@@ -0,0 +1,5 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="8" cy="8" r="6.5" stroke="#999999" stroke-width="1.5" stroke-dasharray="1 2"/>
<circle cx="8" cy="8" r="2" fill="#999999"/>
</svg>

After

Width:  |  Height:  |  Size: 282 B

View File

@@ -0,0 +1,5 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M3 17L9 11L13 15L21 7" stroke="#2fc25b" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M14 7H21V14" stroke="#2fc25b" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>

After

Width:  |  Height:  |  Size: 370 B

View File

@@ -0,0 +1,8 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="12" cy="8" r="4" stroke="#999999" stroke-width="1.5" fill="none"/>
<path d="M6 20C6 16.6863 8.68629 14 12 14C15.3137 14 18 16.6863 18 20"
stroke="#999999"
stroke-width="1.5"
stroke-linecap="round"/>
</svg>

After

Width:  |  Height:  |  Size: 384 B