Some change to search result display; display 'Beta' for science theme

usnistgov · Sep 4, 2024 · aaed795 · aaed795
1 parent 270bd68
commit aaed795
Show file tree

Hide file tree

Showing 7 changed files with 25 additions and 14 deletions.
diff --git a/angular/src/app/landing/landingbody.component.html b/angular/src/app/landing/landingbody.component.html
@@ -7,7 +7,7 @@
             <a name="identity" #identity></a>
             <!-- <div style="margin-left: -10px;"> -->
             <div>
-                <pdr-resource-id [record]="md" [inBrowser]="inBrowser" [theme]="theme">
+                <pdr-resource-id [record]="md" [inBrowser]="inBrowser" [theme]="theme" [collection]="collection">
                 </pdr-resource-id>
 
                 <!-- description: abstract, keywords, research areas, etc. -->

diff --git a/angular/src/app/landing/resultitem/resultitem.component.css b/angular/src/app/landing/resultitem/resultitem.component.css
@@ -4,9 +4,8 @@
 
 .item-title {
         display: table; /* table display*/
-        border-spacing:15px;
+        border-spacing:10px;
         width: 100%; 
-        background-color: #12659c;
         color: #fff !important;
         border-radius: 10px 10px 0 0;
 }

diff --git a/angular/src/app/landing/resultitem/resultitem.component.html b/angular/src/app/landing/resultitem/resultitem.component.html
@@ -1,7 +1,7 @@
 <div class="result-contsiner">
         <div class="item-title" [style.background-color]="colorScheme.default">
                 <!-- Title button -->
-                <a class="btn-parent title-btn" style="color: white;" href="{{PDRAPIURL}}{{resultItem.ediid}}" target="_blank" rel="noopener">
+                <a class="btn-parent title-btn" style="color: white;width: fit-content;" href="{{PDRAPIURL}}{{resultItem.ediid}}" target="_blank" rel="noopener">
                         <i class="pi pi-arrow-up-right btn-icon"></i>
                         <span style="display: table-cell;">
                                 {{resultItem.title.trim()}}

diff --git a/angular/src/app/landing/searchresult/searchresult.component.ts b/angular/src/app/landing/searchresult/searchresult.component.ts
@@ -79,7 +79,7 @@ export class SearchresultComponent implements OnInit {
         if(this.mouseDragging) {
             let diff = this.mouse.x - this.prevMouseX;
             this.filterWidth = this.prevFilterWidth + diff;
-            this.filterWidth = this.filterWidth < 40? 49 : this.filterWidth > 500? 500 : this.filterWidth;
+            this.filterWidth = this.filterWidth < 40? 39 : this.filterWidth > 500? 500 : this.filterWidth;
             this.filterWidthStr = this.filterWidth + 'px';
         }
 

diff --git a/angular/src/app/landing/sections/resourceidentity.component.css b/angular/src/app/landing/sections/resourceidentity.component.css
@@ -19,13 +19,16 @@
     padding-right: 1em;
 }
 
-.version {
-    background-color:var(--science-theme-background-default);
+.beta-label {
     margin-left: 0.5em; 
     color: white;
-    font-size: 12px;
-    vertical-align: top;
-    margin-top: .2em;
+    position:relative;
+    top: 0px;
+    left: 0px;
+    font-weight: bold;
+    font-size: small;
+    border-radius: 5px;
+    padding: 2px 6px 2px 2px;
 }
 
 #ispartof {

diff --git a/angular/src/app/landing/sections/resourceidentity.component.html b/angular/src/app/landing/sections/resourceidentity.component.html
@@ -2,7 +2,7 @@
     <div style="width:100%">
         <span class="recordType">
             <b>{{recordType}}</b>
-            <span *ngIf="theme == scienceTheme" class="badge version"> Beta</span>
+            <span *ngIf="isScienceTheme" class="w3-badge beta-label" [style.background-color]="colorScheme.default"> Beta</span>
         </span>
         <br>
         <app-title [record]="record" [inBrowser]="inBrowser"></app-title>

diff --git a/angular/src/app/landing/sections/resourceidentity.component.ts b/angular/src/app/landing/sections/resourceidentity.component.ts
@@ -6,7 +6,8 @@ import { VersionComponent } from '../version/version.component';
 import { GoogleAnalyticsService } from '../../shared/ga-service/google-analytics.service';
 import { EditStatusService } from '../../landing/editcontrol/editstatus.service';
 import { LandingConstants } from '../../landing/constants';
-import { Themes, ThemesPrefs } from '../../shared/globals/globals';
+import { ColorScheme, Themes, ThemesPrefs } from '../../shared/globals/globals';
+import { CollectionService } from '../../shared/collection-service/collection.service';
 
 /**
  * a component that lays out the "identity" section of a landing page
@@ -29,29 +30,37 @@ export class ResourceIdentityComponent implements OnChanges {
     isPartOf: string[] = null;
     scienceTheme = Themes.SCIENCE_THEME;
     defaultTheme = Themes.DEFAULT_THEME;
-
+    colorScheme: ColorScheme;
+
     // passed in by the parent component:
     @Input() record: NerdmRes = null;
     @Input() inBrowser: boolean = false;
     @Input() theme: string;
+    @Input() collection: string;
 
     /**
      * create an instance of the Identity section
      */
     constructor(private cfg: AppConfig,
                 public editstatsvc: EditStatusService,
-                private gaService: GoogleAnalyticsService)
+                private gaService: GoogleAnalyticsService,
+                public collectionService: CollectionService)
     { }
 
     ngOnInit(): void {
         this.EDIT_MODES = LandingConstants.editModes;
+        this.colorScheme = this.collectionService.getColorScheme(this.collection);
 
         // Watch current edit mode set by edit controls
         this.editstatsvc.watchEditMode((editMode) => {
             this.editMode = editMode;
         });
     }
 
+    get isScienceTheme() {
+        return this.theme == this.scienceTheme;
+    }
+
     /**
      * Decide if currently in view only mode
      */