diff --git a/client/src/components/atoms/Modal.module.scss b/client/src/components/atoms/Modal.module.scss
index 6b80b0e..313ed8a 100644
--- a/client/src/components/atoms/Modal.module.scss
+++ b/client/src/components/atoms/Modal.module.scss
@@ -16,14 +16,14 @@
.modal {
padding: $spacer;
border-radius: $border-radius;
- background: $brand-white;
+ background: $body-background;
margin: $spacer auto;
max-width: $break-point--small;
position: relative;
animation: moveUp .2s ease-out backwards;
@media (min-width: $break-point--small) {
- padding: $spacer * 2 $spacer;
+ padding: $spacer * 2 $spacer * 1.5;
}
&:focus {
diff --git a/client/src/components/atoms/Modal.test.tsx b/client/src/components/atoms/Modal.test.tsx
new file mode 100644
index 0000000..a9861eb
--- /dev/null
+++ b/client/src/components/atoms/Modal.test.tsx
@@ -0,0 +1,14 @@
+import React from 'react'
+import { render } from '@testing-library/react'
+import Modal from './Modal'
+
+describe('Modal', () => {
+ it('renders without crashing', () => {
+ const { container } = render(
+ null}>
+ Hello
+
+ )
+ expect(container.firstChild).toBeInTheDocument()
+ })
+})
diff --git a/client/src/components/templates/Asset/Report.module.scss b/client/src/components/templates/Asset/Report.module.scss
index ab68549..9ef1d26 100644
--- a/client/src/components/templates/Asset/Report.module.scss
+++ b/client/src/components/templates/Asset/Report.module.scss
@@ -11,10 +11,10 @@
}
.info {
+ background: $brand-white;
padding: $spacer;
border: 1px solid $brand-grey-lighter;
border-radius: $border-radius;
- margin-bottom: $spacer;
h3 {
font-size: $font-size-base;
diff --git a/client/src/components/templates/Asset/Report.tsx b/client/src/components/templates/Asset/Report.tsx
index b49f8d2..a37193f 100644
--- a/client/src/components/templates/Asset/Report.tsx
+++ b/client/src/components/templates/Asset/Report.tsx
@@ -45,6 +45,7 @@ export default class Report extends PureComponent<
name="comment"
label="Comment"
help="Briefly describe what is wrong with this asset."
+ required
/>