Fix/fixes

src/app/core/components/footer/footer.component.scss

@@ -1,30 +1,29 @@
 @use "assets/styles/mixins" as mix;
-@use "assets/styles/variables" as var;
 
 .footer-nav,
 .footer-secondary-nav {
-  color: var.$dark-blue-1;
+  color: var(--dark-blue-1);
   padding: 0 1.5rem;
 
   .separator {
     margin: 0 mix.rem(6px);
   }
 
   a {
-    color: var.$dark-blue-1;
+    color: var(--dark-blue-1);
     text-align: center;
   }
 
   .social-link {
-    background-color: var.$pr-blue-1;
+    background-color: var(--pr-blue-1);
     border-radius: mix.rem(6px);
-    color: var.$white;
+    color: var(--white);
     padding: mix.rem(6px);
     width: mix.rem(36px);
     height: mix.rem(36px);
 
     &:hover {
-      background-color: var.$pr-blue-3;
+      background-color: var(--pr-blue-3);
       text-decoration: none;
     }
   }
@@ -35,13 +34,13 @@
 }
 
 .footer-nav {
-  background-color: var.$bg-blue-3;
+  background-color: var(--bg-blue-3);
 
   .footer-socials {
-    gap: mix.rem(8px);
+    gap: 0.5rem;
   }
 }
 
 .footer-secondary-nav {
-  background: var.$bg-blue-2;
+  background: var(--bg-blue-2);
 }

src/app/core/components/forbidden-page/forbidden-page.component.scss

@@ -1,5 +1,4 @@
 @use "assets/styles/mixins" as mix;
-@use "assets/styles/variables" as var;
 
 :host {
   @include mix.flex-center;
@@ -9,9 +8,9 @@
 
 .container {
   position: relative;
-  background: var.$white;
-  border-radius: mix.rem(12px);
-  box-shadow: 0 2px 4px var.$grey-outline;
-  color: var.$dark-blue-1;
+  background: var(--white);
+  border-radius: 0.75rem;
+  box-shadow: 0 2px 4px var(--grey-outline);
+  color: var(--dark-blue-1);
   max-width: mix.rem(448px);
 }

src/app/core/components/nav-menu/nav-menu.component.html

@@ -1,13 +1,12 @@
 <nav class="nav-menu">
-  <p-panelMenu [model]="menuItems" [multiple]="false">
+  <p-panelMenu [model]="mainMenuItems()" [multiple]="false">
     <ng-template #item let-item>
-      @if (item.label !== 'navigation.registriesSubRoutes.registryDetails') {
+      @if (item.id !== 'registry-details') {
         <a
           [routerLink]="item.routerLink"
           routerLinkActive="active"
           [routerLinkActiveOptions]="item.routerLinkActiveOptions"
           class="nav-link flex align-items-center"
-          [class.mt-5]="item.label === 'navigation.settings' || item.label === 'navigation.myProjects'"
           (click)="goToLink(item)"
         >
           @if (item.icon) {
@@ -24,7 +23,7 @@
           }
         </a>
 
-        @if (item.label === 'navigation.myProjects' && !isRegistryRoute() && isProjectRoute()) {
+        @if (item.id === 'my-projects' && !isRegistryRoute() && isProjectRoute()) {
           <div class="ml-4">
             <p-panelMenu [model]="myProjectMenuItems" [multiple]="false">
               <ng-template #item let-item>
@@ -52,7 +51,7 @@
         }
       }
 
-      @if (item.label === 'navigation.registriesSubRoutes.registryDetails' && isRegistryRoute()) {
+      @if (item.id === 'registry-details' && isRegistryRoute()) {
         <p-panelMenu [model]="registrationMenuItems" [multiple]="false" class="border-none">
           <ng-template #item let-item>
             <a

src/app/core/components/nav-menu/nav-menu.component.scss

@@ -1,16 +1,10 @@
-@use "assets/styles/mixins" as mix;
-
 .nav-menu {
   width: 250px;
   max-width: 250px;
 
   .active {
     background-color: var(--dark-blue-2);
-    border-radius: mix.rem(8px);
+    border-radius: 0.5rem;
     font-weight: 700;
   }
-
-  ::ng-deep li[aria-label="navigation.registriesSubRoutes.registryDetails"] {
-    border-left-color: transparent !important;
-  }
 }

src/app/core/components/nav-menu/nav-menu.component.ts

@@ -19,14 +19,18 @@ import { IconComponent } from '@osf/shared/components';
   styleUrl: './nav-menu.component.scss',
 })
 export class NavMenuComponent {
+  closeMenu = output<void>();
+
   private readonly router = inject(Router);
   private readonly route = inject(ActivatedRoute);
 
   protected readonly menuItems = MENU_ITEMS;
   protected readonly myProjectMenuItems = PROJECT_MENU_ITEMS;
   protected readonly registrationMenuItems = REGISTRATION_MENU_ITEMS;
 
-  closeMenu = output<void>();
+  protected readonly mainMenuItems = computed(() =>
+    this.isCollectionsRoute() ? this.menuItems : this.menuItems.filter((item) => item.routerLink !== '/collections')
+  );
 
   protected readonly currentRoute = toSignal(
     this.router.events.pipe(

src/app/core/components/page-not-found/page-not-found.component.scss

@@ -1,5 +1,4 @@
 @use "assets/styles/mixins" as mix;
-@use "assets/styles/variables" as var;
 
 :host {
   @include mix.flex-center;
@@ -9,9 +8,9 @@
 
 .container {
   position: relative;
-  background: var.$white;
-  border-radius: mix.rem(12px);
-  box-shadow: 0 2px 4px var.$grey-outline;
-  color: var.$dark-blue-1;
+  background: var(--white);
+  border-radius: 0.75rem;
+  box-shadow: 0 2px 4px var(--grey-outline);
+  color: var(--dark-blue-1);
   max-width: mix.rem(448px);
 }

src/app/core/components/request-access/request-access.component.scss

@@ -1,5 +1,4 @@
 @use "assets/styles/mixins" as mix;
-@use "assets/styles/variables" as var;
 
 :host {
   @include mix.flex-center;
@@ -9,13 +8,13 @@
 
 .container {
   position: relative;
-  background: var.$white;
-  border-radius: mix.rem(12px);
-  box-shadow: 0 2px 4px var.$grey-outline;
-  color: var.$dark-blue-1;
+  background: var(--white);
+  border-radius: 0.75rem;
+  box-shadow: 0 2px 4px var(--grey-outline);
+  color: var(--dark-blue-1);
   max-width: mix.rem(448px);
 
   .comment-input {
-    font-size: mix.rem(14px);
+    font-size: 0.875rem;
   }
 }

src/app/core/components/topnav/topnav.component.html

@@ -14,6 +14,7 @@
     class="topnav-btn custom-light-hover flex"
     [icon]="isDrawerVisible() ? 'fas fa-close fa-2xl' : 'fas fa-bars fa-2xl'"
     severity="contrast"
+    ariaLabel="Toggle"
     (onClick)="toggleMenuVisibility()"
   ></p-button>
 </section>

src/app/core/constants/nav-items.constant.ts

@@ -5,19 +5,21 @@ export const MENU_ITEMS: MenuItem[] = [
     routerLink: '/home',
     label: 'navigation.home',
     icon: 'osf-icon-home',
-    routerLinkActiveOptions: { exact: true },
+    routerLinkActiveOptions: { exact: false },
   },
   {
     routerLink: '/search',
     label: 'navigation.searchOsf',
     icon: 'osf-icon-search',
-    routerLinkActiveOptions: { exact: true },
+    routerLinkActiveOptions: { exact: false },
   },
   {
+    id: 'my-projects',
     routerLink: '/my-projects',
     label: 'navigation.myProjects',
     icon: 'osf-icon-my-projects',
     routerLinkActiveOptions: { exact: true },
+    styleClass: 'mt-5',
   },
   {
     label: 'navigation.registries',
@@ -35,47 +37,47 @@ export const MENU_ITEMS: MenuItem[] = [
         routerLinkActiveOptions: { exact: true },
       },
       {
+        id: 'registry-details',
         routerLink: '/registry-overview',
         label: 'navigation.registriesSubRoutes.registryDetails',
         routerLinkActiveOptions: { exact: true },
       },
     ],
   },
   {
-    routerLink: '/preprints',
     label: 'navigation.preprints',
     icon: 'osf-icon-preprints',
     routerLinkActiveOptions: { exact: true },
     items: [
       {
-        routerLink: '/preprints',
+        routerLink: '/preprints/overview',
         label: 'navigation.preprintsSubRoutes.overview',
-        routerLinkActiveOptions: { exact: true },
+        routerLinkActiveOptions: { exact: false },
       },
       {
         routerLink: '/my-preprints',
         label: 'navigation.preprintsSubRoutes.myPreprints',
-        routerLinkActiveOptions: { exact: true },
+        routerLinkActiveOptions: { exact: false },
       },
     ],
   },
   {
     routerLink: '/my-profile',
     label: 'navigation.profile',
     icon: 'osf-icon-profile',
-    routerLinkActiveOptions: { exact: true },
+    routerLinkActiveOptions: { exact: false },
   },
   {
     routerLink: '/institutions',
     label: 'navigation.institutions',
     icon: 'osf-icon-institutions',
-    routerLinkActiveOptions: { exact: true },
+    routerLinkActiveOptions: { exact: false },
   },
   {
     routerLink: '/collections',
     label: 'navigation.collections',
     icon: 'osf-icon-collections',
-    routerLinkActiveOptions: { exact: true },
+    routerLinkActiveOptions: { exact: false },
   },
   {
     routerLink: '/meetings',
@@ -87,6 +89,7 @@ export const MENU_ITEMS: MenuItem[] = [
     label: 'navigation.settings',
     icon: 'osf-icon-settings',
     routerLinkActiveOptions: { exact: true },
+    styleClass: 'mt-5',
     items: [
       {
         routerLink: '/settings/profile-settings',

src/app/features/meetings/components/index.ts

@@ -0,0 +1 @@
+export { MeetingsFeatureCardComponent } from './meetings-feature-card/meetings-feature-card.component';

src/app/features/meetings/components/meetings-feature-card/meetings-feature-card.component.html

@@ -0,0 +1,7 @@
+<p-card>
+  <div class="flex flex-column align-items-center justify-content-center gap-4 lg:h-18rem">
+    <img [src]="iconSrc()" [alt]="iconAlt()" class="w-8rem h-8rem" />
+    <h2>{{ titleKey() | translate }}</h2>
+    <p class="text-center">{{ descriptionKey() | translate }}</p>
+  </div>
+</p-card>

src/app/features/meetings/components/meetings-feature-card/meetings-feature-card.component.spec.ts

@@ -0,0 +1,22 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { MeetingsFeatureCardComponent } from './meetings-feature-card.component';
+
+describe('MeetingsFeatureCardComponent', () => {
+  let component: MeetingsFeatureCardComponent;
+  let fixture: ComponentFixture<MeetingsFeatureCardComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [MeetingsFeatureCardComponent],
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(MeetingsFeatureCardComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/features/meetings/components/meetings-feature-card/meetings-feature-card.component.ts

@@ -0,0 +1,19 @@
+import { TranslatePipe } from '@ngx-translate/core';
+
+import { Card } from 'primeng/card';
+
+import { ChangeDetectionStrategy, Component, input } from '@angular/core';
+
+@Component({
+  selector: 'osf-meetings-feature-card',
+  imports: [Card, TranslatePipe],
+  templateUrl: './meetings-feature-card.component.html',
+  styleUrl: './meetings-feature-card.component.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class MeetingsFeatureCardComponent {
+  iconSrc = input.required<string>();
+  iconAlt = input.required<string>();
+  titleKey = input.required<string>();
+  descriptionKey = input.required<string>();
+}

src/app/features/meetings/constants/index.ts

@@ -1,2 +1,4 @@
 export * from './meeting-submissions-table.constants';
+export * from './meetings-feature-cards.constants';
 export * from './meetings-fields.constants';
+export * from './partner-organizations.constants';

src/app/features/meetings/constants/meetings-feature-cards.constants.ts

@@ -0,0 +1,22 @@
+import { MeetingFeatureCard } from '../models';
+
+export const MEETINGS_FEATURE_CARDS: MeetingFeatureCard[] = [
+  {
+    iconSrc: 'assets/icons/colored/discover.svg',
+    iconAlt: 'Discover',
+    titleKey: 'meetings.landing.features.discover.title',
+    descriptionKey: 'meetings.landing.features.discover.description',
+  },
+  {
+    iconSrc: 'assets/icons/colored/share.svg',
+    iconAlt: 'Share',
+    titleKey: 'meetings.landing.features.share.title',
+    descriptionKey: 'meetings.landing.features.share.description',
+  },
+  {
+    iconSrc: 'assets/icons/colored/enhance.svg',
+    iconAlt: 'Enhance',
+    titleKey: 'meetings.landing.features.enhance.title',
+    descriptionKey: 'meetings.landing.features.enhance.description',
+  },
+];

src/app/features/meetings/constants/partner-organizations.constants.ts

@@ -0,0 +1,32 @@
+import { PartnerOrganization } from '../models';
+
+export const PARTNER_ORGANIZATIONS: PartnerOrganization[] = [
+  {
+    name: 'APS',
+    url: 'http://www.psychologicalscience.org/',
+    imageSrc: 'assets/icons/colored/aps.svg',
+    alt: 'APS',
+    height: 90,
+  },
+  {
+    name: 'BITSS',
+    url: 'http://www.bitss.org/',
+    imageSrc: 'assets/icons/colored/bitss.svg',
+    alt: 'BITSS',
+    height: 90,
+  },
+  {
+    name: 'NRAO',
+    url: 'http://www.nrao.edu/',
+    imageSrc: 'assets/icons/colored/nrao.svg',
+    alt: 'NRAO',
+    height: 90,
+  },
+  {
+    name: 'SPSP',
+    url: 'http://www.spsp.org/',
+    imageSrc: 'assets/icons/colored/spsp.svg',
+    alt: 'SPSP',
+    height: 90,
+  },
+];