diff --git a/styles/form.css b/styles/form.css index 3dc4edf..4c71028 100644 --- a/styles/form.css +++ b/styles/form.css @@ -1,3 +1,7 @@ +.shopping-form { + margin-bottom: 32px; +} + .shopping-form-inputs { display: flex; margin-bottom: 24px; diff --git a/styles/items.css b/styles/items.css new file mode 100644 index 0000000..1e7dcd1 --- /dev/null +++ b/styles/items.css @@ -0,0 +1,22 @@ +.shopping-result { + max-width: 416px; +} + +.shopping-result-head, +.shopping-item { + display: grid; + grid-template-columns: 3fr 1fr; + padding: 8px 16px; +} + +.shopping-result-head { + background: var(--gray-100); +} + +.shopping-items { + list-style: none; +} + +.shopping-item:nth-child(even) { + background: var(--gray-100); +} \ No newline at end of file diff --git a/styles/main.css b/styles/main.css index 103007e..71e6607 100644 --- a/styles/main.css +++ b/styles/main.css @@ -1,6 +1,7 @@ @import "global.css"; @import "variables.css"; @import "form.css"; +@import "items.css"; .shopping-container { max-width: 1200px;