diff --git a/frontend/src/Search/Author/AddNewAuthorSearchResult.css b/frontend/src/Search/Author/AddNewAuthorSearchResult.css index 1c63d220e..960df8aa0 100644 --- a/frontend/src/Search/Author/AddNewAuthorSearchResult.css +++ b/frontend/src/Search/Author/AddNewAuthorSearchResult.css @@ -34,10 +34,20 @@ .content { flex: 0 1 100%; + overflow: hidden; +} + +.nameRow { + display: flex; +} + +.nameContainer { + display: flex; + align-items: flex-end; + flex: 0 1 auto; } .name { - display: flex; font-weight: 300; font-size: 36px; } @@ -47,6 +57,14 @@ color: $disabledColor; } +.icons { + display: flex; + align-items: center; + justify-content: space-between; + flex: 1 0 auto; + height: 55px; +} + .mbLink { composes: link from '~Components/Link/Link.css'; @@ -69,3 +87,10 @@ margin-top: 20px; text-align: justify; } + +@media only screen and (max-width: $breakpointMedium) { + .titleRow { + justify-content: space-between; + overflow: hidden; + } +} diff --git a/frontend/src/Search/Author/AddNewAuthorSearchResult.js b/frontend/src/Search/Author/AddNewAuthorSearchResult.js index 89753dc79..3403cb868 100644 --- a/frontend/src/Search/Author/AddNewAuthorSearchResult.js +++ b/frontend/src/Search/Author/AddNewAuthorSearchResult.js @@ -113,44 +113,49 @@ class AddNewAuthorSearchResult extends Component { }
-
- {authorName} +
+
+
+ {authorName} - { - !name.contains(year) && year ? - - ({year}) - : - null - } + { + !authorName.contains(year) && year ? + + ({year}) + : + null + } + { + !!disambiguation && + ({disambiguation}) + } +
+
- { - !!disambiguation && - ({disambiguation}) - } +
+ { + isExistingAuthor ? + : + null + } - { - isExistingAuthor ? + : - null - } - - - - + className={styles.mbLinkIcon} + name={icons.EXTERNAL_LINK} + size={28} + /> + +
diff --git a/frontend/src/Search/Book/AddNewBookSearchResult.css b/frontend/src/Search/Book/AddNewBookSearchResult.css index d28edcac5..87d987140 100644 --- a/frontend/src/Search/Book/AddNewBookSearchResult.css +++ b/frontend/src/Search/Book/AddNewBookSearchResult.css @@ -34,24 +34,37 @@ .content { flex: 0 1 100%; + overflow: hidden; } -.name { +.titleRow { display: flex; +} + +.titleContainer { + display: flex; + align-items: flex-end; + flex: 0 1 auto; +} + +.title { font-weight: 300; font-size: 36px; } -.authorName { - font-weight: 300; - font-size: 20px; -} - .year { margin-left: 10px; color: $disabledColor; } +.icons { + display: flex; + align-items: center; + justify-content: space-between; + flex: 1 0 auto; + height: 55px; +} + .mbLink { composes: link from '~Components/Link/Link.css'; @@ -74,3 +87,10 @@ margin-top: 20px; text-align: justify; } + +@media only screen and (max-width: $breakpointMedium) { + .titleRow { + justify-content: space-between; + overflow: hidden; + } +} diff --git a/frontend/src/Search/Book/AddNewBookSearchResult.js b/frontend/src/Search/Book/AddNewBookSearchResult.js index 47a4ddc68..6b254b5a5 100644 --- a/frontend/src/Search/Book/AddNewBookSearchResult.js +++ b/frontend/src/Search/Book/AddNewBookSearchResult.js @@ -112,52 +112,42 @@ class AddNewBookSearchResult extends Component { }
-
- {title} +
+
+
+ {title} - { - !!disambiguation && - ({disambiguation}) - } + { + !!disambiguation && + ({disambiguation}) + } +
+
- { - isExistingBook ? +
+ { + isExistingBook ? + : + null + } + + : - null - } - - - - - -
- -
- By: {author.authorName} - - { - isExistingAuthor ? - : - null - } + className={styles.mbLinkIcon} + name={icons.EXTERNAL_LINK} + size={28} + /> + +