deliveryman/beefast-website
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix style

Browse Source
This commit is contained in:
aaron 2025-03-02 14:13:50 +08:00
parent 8c712223b9
commit 07aa07bbb7
1 changed files with 20 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
src/components/HowToUse.vue
View File

@ -4,9 +4,9 @@
<div class="step-item" style="margin-top: 20px;"> <div class="step-item" style="margin-top: 20px;">
<div class="step-number">第一步</div> <div class="step-number">第一步</div>
<div class="step-content"> <div class="step-content">
<div class="step-title">选择开通小区</div> <div class="step-title">选择小区</div>
<div class="step-arrow">→</div> <div class="step-arrow">→</div>
<div class="step-description">小区未开通可申请</div> <div class="step-description">未开通小区可申请开通</div>
</div> </div>
</div> </div>
@ -132,7 +132,11 @@ export default {
.step-content { .step-content {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: flex-start;
width: 70%;
max-width: 300px;
margin: 0 auto;
text-align: left;
} }
.step-title { .step-title {
@ -147,7 +151,7 @@ export default {
color: #333333; color: #333333;
} }
.step-description { .step-description {
font-size: 16px; font-size: 16px;
color: #999999; color: #999999;
} }
@ -301,4 +305,16 @@ export default {
margin-top: 20px; margin-top: 20px;
} }
} }
@media (min-width: 414px) {
.step-content {
width: 60%;
}
}
@media (min-width: 768px) {
.step-content {
width: 50%;
}
}
</style> </style>