hookehuyr

fix

...@@ -44,8 +44,8 @@ ...@@ -44,8 +44,8 @@
44 <swiper-slide v-for="(item, index) in solution_list" :key="index"> 44 <swiper-slide v-for="(item, index) in solution_list" :key="index">
45 <div @click="goToSolution(item)" class="card" style="margin-bottom: 1rem;"> 45 <div @click="goToSolution(item)" class="card" style="margin-bottom: 1rem;">
46 <img :src="item.cover" alt="学校图片" class="card-image"> 46 <img :src="item.cover" alt="学校图片" class="card-image">
47 - <div class="card-content"> 47 + <div class="card-content xs">
48 - <div class="card-title"> 48 + <div class="card-title-xs">
49 <span>{{ item.category_name }}</span> 49 <span>{{ item.category_name }}</span>
50 <!-- <i class="el-icon-right"></i> --> 50 <!-- <i class="el-icon-right"></i> -->
51 </div> 51 </div>
...@@ -244,14 +244,26 @@ export default { ...@@ -244,14 +244,26 @@ export default {
244 244
245 .card-content { 245 .card-content {
246 padding: 15px; 246 padding: 15px;
247 - padding-bottom: 0; 247 + &.xs {
248 + padding-bottom: 0;
249 + }
248 .card-title { 250 .card-title {
249 - // display: flex; 251 + display: flex;
250 - // align-items: center; 252 + align-items: center;
251 - // justify-content: space-between; 253 + justify-content: space-between;
254 + font-size: 1rem;
255 + color: @secondary-color;
256 + margin-bottom: 10px;
257 + font-weight: bold;
258 + span {
259 + white-space: nowrap; /* 不换行 */
260 + overflow: hidden; /* 隐藏超出部分 */
261 + text-overflow: ellipsis; /* 用省略号表示被截断的部分 */
262 + }
263 + }
264 + .card-title-xs {
252 font-size: 1rem; 265 font-size: 1rem;
253 color: @secondary-color; 266 color: @secondary-color;
254 - // margin-bottom: 10px;
255 font-weight: bold; 267 font-weight: bold;
256 span { 268 span {
257 min-height: calc(2 * 1.5em); /* 假设行高为 1.5em */ 269 min-height: calc(2 * 1.5em); /* 假设行高为 1.5em */
......