Merge pull request #21067 from overleaf/mf-new-gallery-search-result

[web] Implement new gallery search result

GitOrigin-RevId: afc33a07b5ea533b681acf18bd31112a2f48866a
This commit is contained in:
M Fahru 2024-10-21 12:47:54 -07:00 committed by Copybot
parent c37e6a17fb
commit 0811e46b6c
4 changed files with 80 additions and 2 deletions

View file

@ -2,3 +2,4 @@
@import 'variables';
@import 'variable-overrides';
@import 'themes-common-variables';
@import 'templates-search';

View file

@ -0,0 +1 @@
$templates-search-max-width: 885px;

View file

@ -21,4 +21,76 @@
}
}
}
.search-hits {
margin-top: var(--spacing-16);
display: flex;
flex-direction: column;
gap: var(--spacing-08);
.search-hit {
display: flex;
gap: var(--spacing-08);
.search-image {
a {
display: flex;
align-items: flex-start;
justify-content: center;
height: 100%;
width: 100%;
img {
width: 185px;
box-shadow: 0 2px 4px 0 rgba(30 37 48 / 16%);
}
}
}
.search-title {
margin-bottom: var(--spacing-04);
max-width: $templates-search-max-width;
a {
@include heading-md;
color: var(--content-primary);
text-decoration: none;
&:hover {
text-decoration: underline;
}
}
}
.search-highlight {
max-width: $templates-search-max-width;
}
.gallery-official {
margin-left: var(--spacing-06);
vertical-align: text-top;
}
.search-hit-tags {
list-style: none;
margin: 0;
padding-left: 0;
display: flex;
gap: var(--spacing-04);
li a {
@include body-sm;
color: var(--color-primary-dark);
text-decoration: none;
&:hover {
text-decoration: underline;
color: var(--green-50);
}
}
}
}
}
}

View file

@ -41,10 +41,14 @@
}
.gallery-header {
max-width: 885px;
// padding: 0 is added when the screen size is much bigger than the $templates-search-max-width
// to remove unwanted padding
@include media-breakpoint-up(xl) {
padding: 0;
}
@include media-breakpoint-up(lg) {
padding: 0;
max-width: $templates-search-max-width;
}
}