#10 center credits title (#43)

FabDonRixos · Dec 1, 2024 · a714212 · a714212
2 parents 42f9b83 + 2b74137
commit a714212
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 3 deletions.
diff --git a/logo/logo.sketch b/logo/logo.sketch
diff --git a/src/artworks/0_artworks-list/artworksList.tsx b/src/artworks/0_artworks-list/artworksList.tsx
@@ -17,7 +17,7 @@ export interface IArtworkItem {
     textColor?: `#${string}`;
     full?: boolean; // Only use this if you really have no other but to claim more space.
     oneLink?: ILink;
-    editedAt?: Date;
+    editedAt: Date;
 }
 
 const artworksList: IArtworkItem[] = [

diff --git a/src/website/artwork/Artwork.tsx b/src/website/artwork/Artwork.tsx
@@ -34,7 +34,9 @@ export default function Artwork({ artwork }: ArtWrapperProps): ReactElement {
                     )}
                 </div>
                 <h1>{artwork.titel}</h1>
-                {artwork.editedAt && <span>{artwork.editedAt.toLocaleDateString()}</span>}
+                {artwork.editedAt && (
+                    <span className={style.component_date}>{artwork.editedAt.toLocaleDateString()}</span>
+                )}
             </div>
         </div>
     );

diff --git a/src/website/artwork/artwork.module.scss b/src/website/artwork/artwork.module.scss
@@ -40,7 +40,7 @@
     justify-content: space-between;
     align-items: center;
     flex-wrap: wrap;
-    gap: 0.5rem;
+    gap: 0.5rem 1rem;
     border-top: #737373 1px solid;
     background-color: rgba(255, 255, 255, 0.25);
     color: var(--text-color);
@@ -66,6 +66,16 @@
         }
       }
     }
+
+    & .component_date {
+      text-align: right;
+    }
+
+    & .component_creator,
+    & .component_date {
+      flex: 1 0 20%;
+      white-space: nowrap;
+    }
   }
 
   @media (hover: none) {