diff --git a/client/src/routes/offers.tsx b/client/src/routes/offers.tsx
index d1ac1ae..98fd108 100644
--- a/client/src/routes/offers.tsx
+++ b/client/src/routes/offers.tsx
@@ -16,6 +16,8 @@ function Home() {
route('/search');
}
+ if (!offers) return
loading...
;
+
return (
{offers.map(OfferGroup)}
diff --git a/client/src/routes/search.tsx b/client/src/routes/search.tsx
index b50de6a..2394b89 100644
--- a/client/src/routes/search.tsx
+++ b/client/src/routes/search.tsx
@@ -104,7 +104,7 @@ const User = () => {
Data provided by Discogs.
-
+
{infoEl}
{results.map(Result)}
{topEl}
diff --git a/client/src/store.tsx b/client/src/store.tsx
index a25dd5d..053f377 100644
--- a/client/src/store.tsx
+++ b/client/src/store.tsx
@@ -11,7 +11,7 @@ export const userState = createSlice({
export const offersState = createSlice({
name: 'offers',
- initialState: [],
+ initialState: null,
reducers: {
set: (state, action) => action.payload
},
diff --git a/client/src/style/index.less b/client/src/style/index.less
index a216423..33e679b 100644
--- a/client/src/style/index.less
+++ b/client/src/style/index.less
@@ -201,7 +201,7 @@ body {
}
main {
- padding: 0 5% 0 5%;
+ padding: 0 var(--spacing-double) 0 var(--spacing-double);
}
button, [type=submit] {
@@ -283,13 +283,17 @@ article {
.search {
display: grid;
grid-template-columns: 1fr 2fr;
- grid-gap: calc(var(--spacing-double) * 2);
- article {
+ .results {
display: grid;
- padding: var(--spacing);
- margin-bottom: var(--spacing);
- grid-template-columns: 1fr 4fr min-content;
+ padding-left: var(--spacing);
+ grid-gap: var(--spacing);
+
+ article {
+ display: grid;
+ padding: var(--spacing);
+ grid-template-columns: 1fr 4fr min-content;
+ }
}
button {
@@ -309,8 +313,7 @@ article {
grid-template-columns:
1fr 1fr 1fr;
- grid-row-gap: var(--spacing);
- grid-column-gap: var(--spacing);
+ grid-gap: var(--spacing);
article {
display: grid;
@@ -425,6 +428,7 @@ header {
.offers {
display: grid;
grid-template-columns: 1fr 1fr;
+ grid-gap: var(--spacing);
.offer {
display: grid;
@@ -435,7 +439,6 @@ header {
"lines lines";
padding: var(--spacing);
- margin: var(--spacing-half);
background: var(--background-1);
.details {
@@ -526,6 +529,10 @@ header {
"contact"
"words";
}
+
+ main {
+ padding: 0 var(--spacing) 0 var(--spacing);
+ }
}
@media (max-width:1200px) {