sdz/ks-app-employment-service
Template
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

一体机放大效果开发

Browse Source
This commit is contained in:
冯辉
2026-03-12 17:10:34 +08:00
parent 0c63175816
commit e7ef23ad5d
83 changed files with 3034 additions and 2899 deletions
Download Patch File Download Diff File Expand all files Collapse all files

102
pages/service/components/SkillDevelopment.vue
View File

@@ -94,17 +94,17 @@ const store = useSkillDevelopmentStore();
<style lang="scss" scoped>
.skill-development {
padding: 10rpx 28rpx 20rpx;
padding: 15rpx 42rpx 30rpx;
background-color: #EBF4FF;
min-height: 95%;
}
.query-section {
background-color: #FFFFFF;
border-radius: 16rpx;
padding: 28rpx;
margin-bottom: 20rpx;
box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.08);
border-radius: 24rpx;
padding: 42rpx;
margin-bottom: 30rpx;
box-shadow: 0 6rpx 18rpx rgba(0, 0, 0, 0.08);
.section-title {
margin-top: 0;
@@ -113,39 +113,39 @@ const store = useSkillDevelopmentStore();
.content-section {
background-color: #FFFFFF;
border-radius: 16rpx;
padding: 28rpx;
margin-bottom: 20rpx;
border-radius: 24rpx;
padding: 42rpx;
margin-bottom: 30rpx;
box-sizing: border-box;
overflow: visible;
box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.08);
box-shadow: 0 6rpx 18rpx rgba(0, 0, 0, 0.08);
}
.input-group {
display: flex;
flex-direction: column;
gap: 20rpx;
margin-bottom: 24rpx;
gap: 30rpx;
margin-bottom: 36rpx;
}
.input-label {
font-size: 28rpx;
font-size: 42rpx;
color: #000000;
font-weight: 500;
}
.input-field {
background-color: #F5F5F5;
border: 1rpx solid #E0E0E0;
border-radius: 12rpx;
padding: 20rpx 24rpx;
font-size: 28rpx;
border: 2rpx solid #E0E0E0;
border-radius: 18rpx;
padding: 30rpx 36rpx;
font-size: 42rpx;
color: #666666;
}
.path-summary {
margin-top: 16rpx;
font-size: 24rpx;
margin-top: 24rpx;
font-size: 36rpx;
color: #666666;
text-align: center;
}
@@ -155,12 +155,12 @@ button::after {
}
.section-title {
font-size: 32rpx;
font-size: 48rpx;
color: #000000;
display: flex;
align-items: center;
gap: 12rpx;
margin-bottom: 24rpx;
gap: 18rpx;
margin-bottom: 36rpx;
.content-section & {
margin-top: 0;
@@ -170,15 +170,15 @@ button::after {
.career-paths {
display: grid;
grid-auto-flow: column;
gap: 20px;
padding-bottom: 10px;
gap: 30px;
padding-bottom: 15px;
.career-path-item {
display: flex;
flex-direction: column;
align-items: center;
width: 80px;
padding: 5px;
width: 120px;
padding: 8px;
font-weight: 700;
cursor: pointer;
@@ -187,9 +187,9 @@ button::after {
display: flex;
justify-content: center;
align-items: center;
width: 48px;
height: 48px;
font-size: 20px;
width: 72px;
height: 72px;
font-size: 30px;
color: #fff;
border-radius: 50%;
@@ -208,9 +208,9 @@ button::after {
inset: 0;
z-index: 1;
background: #6c64e7;
border: 3px solid #fff;
border: 5px solid #fff;
border-radius: 50%;
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.3);
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}
&:after {
@@ -219,14 +219,14 @@ button::after {
top: 50%;
right: 50%;
z-index: 0;
width: 100px;
border-bottom: 4px solid #ccc;
width: 150px;
border-bottom: 6px solid #ccc;
}
}
.career-label {
margin-top: 10px;
font-size: 16px;
margin-top: 15px;
font-size: 24px;
text-align: center;
color: #6c64e7;
}
@@ -256,7 +256,7 @@ button::after {
&:first-child {
.career-index {
font-size: 16px;
font-size: 24px;
&:after {
display: none;
@@ -266,7 +266,7 @@ button::after {
&:last-child {
.career-index {
font-size: 16px;
font-size: 24px;
}
}
}
@@ -276,33 +276,33 @@ button::after {
<style lang="scss" scoped>
.title-text {
font-size: 32rpx;
font-size: 48rpx;
font-weight: 600;
color: #167CF1;
}
.skill-card {
margin-bottom: 14px;
margin-bottom: 21px;
box-sizing: border-box;
font-weight: 700;
.skill-list {
display: flex;
flex-direction: column;
gap: 20rpx;
gap: 30rpx;
}
.skill-item {
width: 100%;
max-width: 796rpx;
min-height: 162rpx;
line-height: 40rpx;
border-radius: 20rpx;
max-width: 1194rpx;
min-height: 243rpx;
line-height: 60rpx;
border-radius: 30rpx;
background-color: rgba(239, 239, 239, 1);
color: rgba(16, 16, 16, 1);
font-size: 28rpx;
font-size: 42rpx;
text-align: center;
padding: 24rpx;
padding: 36rpx;
box-sizing: border-box;
display: flex;
flex-direction: column;
@@ -312,22 +312,22 @@ button::after {
}
.skill-label {
margin-bottom: 10px;
font-size: 16px;
margin-bottom: 15px;
font-size: 24px;
color: #94a3b8;
}
.skill-detail {
display: flex;
flex-direction: column;
gap: 8px;
gap: 12px;
.skill-detail-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 8px;
border-radius: 3px;
padding: 12px;
border-radius: 5px;
background: #c1d2ea;
}
@@ -341,7 +341,7 @@ button::after {
.skill-detail-item-value {
width: 45%;
padding-left: 6px;
padding-left: 9px;
color: #4f46e5;
box-sizing: border-box;