0225236 4 months ago
parent
commit
f5829a4ef7
2 changed files with 28 additions and 10 deletions
  1. 8 7
      src/app/tab2/tab2.page.html
  2. 20 3
      src/app/tab2/tab2.page.scss

+ 8 - 7
src/app/tab2/tab2.page.html

@@ -28,8 +28,8 @@
   <div class="details-container">
   <div class="details-container">
     <!-- 装修公司详情页 -->
     <!-- 装修公司详情页 -->
     <div *ngIf="selectedSegment === 'company'">
     <div *ngIf="selectedSegment === 'company'">
-      <!-- 装修公司详情页 -->
-      <ion-card *ngFor="let company of companies">
+      <div *ngFor="let company of companies">
+      <ion-card class="Company-card">
         <ion-card-header><ion-card-title> {{ company.name }}</ion-card-title>
         <ion-card-header><ion-card-title> {{ company.name }}</ion-card-title>
       </ion-card-header>
       </ion-card-header>
         <ion-card-content>
         <ion-card-content>
@@ -46,7 +46,7 @@
             <ion-text>{{ company.description }}</ion-text>
             <ion-text>{{ company.description }}</ion-text>
           </ion-item>
           </ion-item>
           <!-- 公司服务 -->
           <!-- 公司服务 -->
-          <ion-card class="concept-card">
+          <ion-card class="company-card">
             <ion-card-header>
             <ion-card-header>
               公司服务:
               公司服务:
             </ion-card-header>
             </ion-card-header>
@@ -55,7 +55,7 @@
             </ion-card-content>
             </ion-card-content>
           </ion-card>
           </ion-card>
           <!-- 公司优势 -->
           <!-- 公司优势 -->
-          <ion-card class="concept-card">
+          <ion-card class="company-card">
             <ion-card-header>
             <ion-card-header>
               公司优势:
               公司优势:
             </ion-card-header>
             </ion-card-header>
@@ -64,12 +64,12 @@
             </ion-card-content>
             </ion-card-content>
           </ion-card>
           </ion-card>
           <!-- 公司案例 -->
           <!-- 公司案例 -->
-          <ion-card class="concept-card">
+          <ion-card class="company-card">
             <ion-card-header>
             <ion-card-header>
               公司案例:
               公司案例:
             </ion-card-header>
             </ion-card-header>
             <ion-card-content>
             <ion-card-content>
-              <ion-text>{{ company.cases }}</ion-text>
+              <ion-text [innerHTML]="formatHtmlContent(company.cases)"></ion-text>
             </ion-card-content>
             </ion-card-content>
           </ion-card>
           </ion-card>
           <!-- 底部按钮 -->
           <!-- 底部按钮 -->
@@ -80,11 +80,12 @@
         </ion-card-content>
         </ion-card-content>
       </ion-card>
       </ion-card>
     </div>
     </div>
+    </div>
 
 
     <!-- 设计机构详情页 -->
     <!-- 设计机构详情页 -->
     <div *ngIf="selectedSegment === 'design'">
     <div *ngIf="selectedSegment === 'design'">
     <div *ngFor="let designCompany of designCompanies">
     <div *ngFor="let designCompany of designCompanies">
-      <ion-card class="company-card">
+      <ion-card class="Angency-card">
         <ion-card-header>
         <ion-card-header>
           <ion-card-title>{{ designCompany.name }}</ion-card-title>
           <ion-card-title>{{ designCompany.name }}</ion-card-title>
           <ion-card-subtitle>星级评分: {{ designCompany.starRating }} | 评价数量: {{ designCompany.reviewCount }}</ion-card-subtitle>
           <ion-card-subtitle>星级评分: {{ designCompany.starRating }} | 评价数量: {{ designCompany.reviewCount }}</ion-card-subtitle>

+ 20 - 3
src/app/tab2/tab2.page.scss

@@ -1,3 +1,20 @@
-.details-container {
-    padding: 20px;
-  }
+
+  .company-card ion-card-header {
+    color: rgb(52, 160, 255); /* 将文字颜色设置为黑色 */
+  }
+  
+  .company-card ion-card-header{
+    font-size: 1.4em; /* 增大字号至1.2em(根据需要调整大小) */
+  }
+  .company-card {
+    background-color: #e0ffd2; /* 设置ion-card的背景颜色为灰色(根据需要调整颜色) */
+    color: rgb(0, 0, 0); /* 设置文本颜色为黑色 */
+  }
+  .Company-card {
+    background-color: #f9ffdb; /* 设置ion-card的背景颜色为灰色(根据需要调整颜色) */
+    color: rgb(0, 0, 0); /* 设置文本颜色为黑色 */
+  }
+  .info-item {
+  background-color: #f9ffdb; /* 设置info-item的背景颜色为灰色(根据需要调整颜色) */
+  color: rgb(0, 0, 0); /* 设置文本颜色为黑色 */
+}