Fix news page's tab and paragraph styling (CSCTTV-3972)

CSCfi · Sep 5, 2024 · 760e63b · 760e63b
1 parent 70279ac
commit 760e63b
Show file tree

Hide file tree

Showing 2 changed files with 41 additions and 5 deletions.
diff --git a/src/app/portal/components/news/news-card/news-card.component.html b/src/app/portal/components/news/news-card/news-card.component.html
@@ -53,19 +53,19 @@ <h3 [innerHTML]="_fundingCall.name"></h3>
     </div>
   </mat-card-content>
 
-  <mat-card-actions
+  <!--<mat-card-actions
     *ngIf="!dense && !itemTypeFundingCalls"
     [ngClass]="isHomepage ? '' : 'ms-0 me-0'"
   >
     <div class="row">
-      <!-- <div class="col pl-0" [ngClass]="item.mediaUri?.length > 0 ? 'link' : ''">
+      &lt;!&ndash; <div class="col pl-0" [ngClass]="item.mediaUri?.length > 0 ? 'link' : ''">
                 <a class="org-link" href="{{item.url}}" target="_blank" aria-label="Lue koko uutinen organisaation verkkosivuilla"><ng-container i18n="@@readOriginialNews">Lue koko uutinen organisaation verkkosivuilla </ng-container><fa-icon icon="external-link-alt"></fa-icon></a>
-            </div> -->
+            </div> &ndash;&gt;
       <div *ngIf="item.mediaUri?.length > 0" class="col pe-0 text-end">
-        <!-- <img [src]="item.mediaUri | safeUrl"> -->
+        &lt;!&ndash; <img [src]="item.mediaUri | safeUrl"> &ndash;&gt;
       </div>
     </div>
-  </mat-card-actions>
+  </mat-card-actions>-->
 
   <mat-card-footer>
     <!-- News footer -->

diff --git a/src/migration-mdc.scss b/src/migration-mdc.scss
@@ -103,3 +103,39 @@ body app-news-card mat-card.mat-mdc-card {
 app-search-bar > div > div > div > form > div > div.input-group > button > span.mdc-button__label > span {
   font-weight: 500;
 }
+
+// New's page's tab sizes
+#main-content > div > mat-tab-group > mat-tab-header {
+  width: 325px;
+  // border-bottom: solid red 2px;
+}
+
+// New's page's horizontal line between tabs and content
+/*.mat-mdc-tab .mdc-tab__text-label {
+  border: 1px solid red;
+}*/
+
+// New's page's tab labels
+/*.mat-mdc-tab-labels {
+  color: black !important;
+  font-size: 14px;
+}*/
+
+.mat-mdc-tab .mdc-tab__text-label {
+  color: black !important;
+  font-size: 0.88rem;
+}
+
+/*.mat-mdc-card-content {
+  padding: 0;
+}*/
+
+app-news-card mat-card-content p:last-child {
+  margin-top: 0 !important;
+}
+
+.mat-mdc-card-content {
+  font-size: 0.88rem;
+  padding-left: 0 !important;
+  margin-bottom: 1.10rem !important;
+}