Merge branch 'main' into fix/9240-registry-header-accessibility-updat…

…es-desktop
ORCID · May 23, 2024 · dc1bd87 · dc1bd87
2 parents f14d830 + 0ec743a
commit dc1bd87
Show file tree

Hide file tree

Showing 8 changed files with 75 additions and 46 deletions.
diff --git a/src/app/cdk/trusted-summary/component/summary-panel/summary-panel.component.html b/src/app/cdk/trusted-summary/component/summary-panel/summary-panel.component.html
@@ -118,7 +118,7 @@
       tabindex="0"
       (click)="goToActivitySection(activitySection)"
       (keydown)="goToActivitySection(activitySection, $event)"
-      [attr.aria-label]="ariaLabelMore"
+      [attr.aria-label]="ariaLabelActivitySection"
       >+ {{ count - 3 }}
       <ng-container *ngIf="count - 3 === 1">{{
         moreLabelSingular

diff --git a/src/app/cdk/trusted-summary/component/summary-panel/summary-panel.component.ts b/src/app/cdk/trusted-summary/component/summary-panel/summary-panel.component.ts
@@ -19,6 +19,7 @@ export class SummaryPanelComponent implements OnInit {
   @Input() count: number = 0
   @Input() moreLabel: string = ''
   @Input() moreLabelSingular: string = ''
+  @Input() ariaLabelActivitySection: string = ''
   @Input() showToPresent = true
   @Input() hoverEffect = false
   @Input() standaloneMode: boolean
@@ -29,7 +30,6 @@ export class SummaryPanelComponent implements OnInit {
 
   validatedSourceAriaLabel = $localize`:@@summary.validatedSource:Validated source`
   selftAssertedSource = $localize`:@@summary.selfAssertedSource:Self-asserted source`
-  ariaLabelMore: string
 
   constructor(@Inject(WINDOW) private _window: Window) {}
 
@@ -44,14 +44,6 @@ export class SummaryPanelComponent implements OnInit {
       this.activitiesToDisplay = this.activitySummary.slice(0, 3)
 
       this.acitivityCountOverflow = this.count > 3
-
-      if (this.standaloneMode) {
-        if (this.count - 3 > 1) {
-          this.ariaLabelMore = RecordUtil.appendOpensInNewTab(this.moreLabel)
-        } else {
-          this.ariaLabelMore = RecordUtil.appendOpensInNewTab(this.moreLabelSingular)
-        }
-      }
     }
   }
   goToUrl(url: string, event?: KeyboardEvent) {

diff --git a/src/app/cdk/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.ts b/src/app/cdk/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.ts
@@ -29,6 +29,7 @@ export class SummarySimplePanelComponent implements OnInit {
   @Input() count: number = 0
   @Input() moreLabel: string = ''
   @Input() moreLabelSingular: string = ''
+  @Input() ariaLabelActivitySection: string = ''
   @Input() hoverEffect = false
   @Input() overflowUrl: string = ''
   @Input() standaloneMode: boolean
@@ -38,7 +39,6 @@ export class SummarySimplePanelComponent implements OnInit {
   unsubscribe = new Subject()
   mobile: boolean
   acitivityCountOverflow = false
-  ariaLabelActivitySection: string
 
   validatedSourceAriaLabel = $localize`:@@summary.validatedSource:Validated source`
   selfAssertedSource = $localize`:@@summary.selfAssertedSource:Self-asserted source`
@@ -49,13 +49,6 @@ export class SummarySimplePanelComponent implements OnInit {
     this.acitivityCountOverflow = this.simpleActivities.length > 3
     this.simpleActivities = this.simpleActivities.slice(0, 3)
 
-    if (this.standaloneMode) {
-      if (this.count - 3 > 1) {
-        this.ariaLabelActivitySection = RecordUtil.appendOpensInNewTab(this.moreLabel)
-      } else {
-        this.ariaLabelActivitySection = RecordUtil.appendOpensInNewTab(this.moreLabelSingular)
-      }
-    }
   }
   goToUrl(url?: string, event?: KeyboardEvent) {
     if (!url) {

diff --git a/src/app/cdk/trusted-summary/component/trusted-summary/trusted-summary.component.html b/src/app/cdk/trusted-summary/component/trusted-summary/trusted-summary.component.html
@@ -138,6 +138,7 @@ <h1 class="orc-font-body-large">
           [count]="trustedSummary.employmentAffiliationsCount"
           [moreLabel]="labelMoreAffiliations"
           [moreLabelSingular]="labelMoreAffiliation"
+          [ariaLabelActivitySection]="ariaLabelAffiliations"
           [hoverEffect]="affiliationsHover"
           [standaloneMode]="standaloneMode"
           [activitySection]="'affiliations'"
@@ -305,6 +306,7 @@ <h3 class="orc-font-small-print" i18n="@@summary.keyDates">
           [count]="trustedSummary.professionalActivitiesCount"
           [moreLabel]="labelMoreProfessionalActivities"
           [moreLabelSingular]="labelMoreProfessionalActivitie"
+          [ariaLabelActivitySection]="ariaLabelProfessionalActivities"
           [standaloneMode]="standaloneMode"
           [activitySection]="'professional-activities'"
         ></app-summary-panel>
@@ -331,11 +333,12 @@ <h3 class="orc-font-small-print" i18n="@@summary.keyDates">
           [overflowUrl]="trustedSummary?.orcid + '#other-identifiers'"
           [moreLabel]="labelMoreOtherIdentifiers"
           [moreLabelSingular]="labelMoreOtherIdentifier"
+          [ariaLabelActivitySection]="ariaLabelIdentifiers"
           [hoverEffect]="externalIdentifiersHover"
           [standaloneMode]="standaloneMode"
           [activitySection]="'other-identifiers'"
           [trustedSummary]="trustedSummary"
-          *ngIf="!trustedSummary"
+          *ngIf="!loading"
         ></app-summary-simple-panel>
       </ng-container>
     </div>

diff --git a/src/app/cdk/trusted-summary/component/trusted-summary/trusted-summary.component.ts b/src/app/cdk/trusted-summary/component/trusted-summary/trusted-summary.component.ts
@@ -77,7 +77,7 @@ export class TrustedSummaryComponent implements OnInit, OnDestroy {
   modifiedToday: boolean
   creationDateWithOffset: any
   lastUpdateDate: any
-  loading = false
+  loading = true
 
   constructor(
     private _trustedSummary: TrustedSummaryService,
@@ -113,7 +113,7 @@ export class TrustedSummaryComponent implements OnInit, OnDestroy {
 
     this._trustedSummary.getSummary(this.orcid).subscribe((data) => {
       this.trustedSummary = data
-      this.loading = true
+      this.loading = false
 
       if (this.trustedSummary.creation) {
         this.creationDateWithOffset = this.dateWithOffset(

diff --git a/src/app/layout/footer/footer.component.html b/src/app/layout/footer/footer.component.html
@@ -19,52 +19,84 @@
         >
           <img src="./assets/vectors/orcid.logo.svg" alt="Orcid" />
         </a>
-        <a href="https://www.linkedin.com/company/orcid">
+        <a
+          href="https://www.linkedin.com/company/orcid"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
           <img
             src="./assets/vectors/social/Linkedin.svg"
             class="social"
             alt="{{linkedin}}"
           />
         </a>
-        <a href="https://www.facebook.com/ORCID.org">
+        <a
+          href="https://www.facebook.com/ORCID.org"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
           <img
             src="./assets/vectors/social/Facebook.svg"
             class="social"
             alt="{{facebook}}"
           />
         </a>
-        <a href="https://scicomm.xyz/@ORCID_Org">
+        <a
+          href="https://scicomm.xyz/@ORCID_Org"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
           <img
             src="./assets/vectors/social/Mastodon.svg"
             class="social"
             alt="{{mastodon}}"
           />
         </a>
-        <a href="https://vimeo.com/orcidvideos">
+        <a
+          href="https://vimeo.com/orcidvideos"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
           <img
             src="./assets/vectors/social/Vimeo.svg"
             class="social"
             alt="{{vimeo}}"
           />
         </a>
-        <a href="https://www.youtube.com/@orcid_org">
+        <a
+          href="https://www.youtube.com/@orcid_org"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
           <img
             src="./assets/vectors/social/Youtube.svg"
             class="social"
             alt="{{youtube}}"
           />
         </a>
-        <a href="{{ infoSiteBaseUrl }}blog/feed" class="social">
+        <a
+          href="{{ infoSiteBaseUrl }}blog/feed"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
           <img src="./assets/vectors/social/RSS.svg" class="social" alt="Rss" />
         </a>
-        <a href="https://github.com/ORCID" class="social">
+        <a
+          href="https://github.com/ORCID"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
           <img
             src="./assets/vectors/social/Github.svg"
             class="social"
             alt="{{github}}"
           />
         </a>
-        <a href="https://twitter.com/orcid_org">
+        <a
+          href="https://twitter.com/orcid_org"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
           <img
             src="./assets/vectors/social/Twitter.svg"
             class="social"
@@ -79,23 +111,27 @@
         class="CC0 orc-font-body-small"
         [ngClass]="{ 'col desktop': isDesktop }"
       >
-        <div [ngClass]="{ 'row mobile': !isDesktop }">
+        <div class='row mobile' *ngIf="!isDesktop">
           <img src="./assets/vectors/cc-zero.svg" alt="public domain" />
         </div>
-        <ng-container i18n="@@footer.copyright_cc0_1"
-          >The text of this website is published under a</ng-container
-        >&nbsp;<a
-          i18n="@@ngOrcid.copyright"
-          href="http://creativecommons.org/publicdomain/zero/1.0/"
-          rel="license noreferrer"
-          target="footer.copyright_cc0"
-          class="mat-button-font underline"
-          [attr.aria-label]="'CC0' + license"
-          >CC0 license.</a
-        >&nbsp;<ng-container i18n="@@footer.copyright_cc0_3"
-          >Images and marks are subject to copyright and trademark
-          protection</ng-container
-        ><ng-container i18n="@@common.period">.</ng-container>
+        <p>
+          <img src="./assets/vectors/cc-zero.svg" alt="public domain" *ngIf="isDesktop"/>
+
+          <ng-container i18n="@@footer.copyright_cc0_1"
+            >The text of this website is published under a</ng-container
+          >&nbsp;<a
+            i18n="@@ngOrcid.copyright"
+            href="http://creativecommons.org/publicdomain/zero/1.0/"
+            rel="license noreferrer"
+            target="footer.copyright_cc0"
+            class="mat-button-font underline"
+            [attr.aria-label]="'CC0' + license"
+            >CC0 license.</a
+          >&nbsp;<ng-container i18n="@@footer.copyright_cc0_3"
+            >Images and marks are subject to copyright and trademark
+            protection</ng-container
+          ><ng-container i18n="@@common.period">.</ng-container>
+        </p>
       </div>
     </div>
     <div

diff --git a/src/app/layout/footer/footer.component.scss b/src/app/layout/footer/footer.component.scss
@@ -60,10 +60,15 @@ footer.mobile {
 }
 
 .public-domain {
+  p {
+    margin: 0;
+  }
+
   img {
     object-fit: cover;
     height: 32px;
     margin-right: 8px;
+    vertical-align: middle;
   }
 
   .CC0 {
@@ -73,7 +78,6 @@ footer.mobile {
   .desktop {
     display: flex;
     align-items: center;
-    height: 32px;
   }
 
   .mobile {
@@ -84,7 +88,7 @@ footer.mobile {
 
 .links {
   > .url-lists {
-    justify-content: space-around;
+    justify-content: center;
 
     a {
       .columns-4 :host &,

diff --git a/src/app/layout/footer/footer.component.scss-theme.scss b/src/app/layout/footer/footer.component.scss-theme.scss
@@ -10,6 +10,7 @@
   footer {
     background-color: map-get($background, light-grey);
     a {
+      color: mat.get-color-from-palette($primary, 700)!important;
       font-weight: normal !important;
     }
     .social {