diff --git a/src/components/Footer/__snapshots__/test.js.snap b/src/components/Footer/__snapshots__/test.js.snap index 84d9b51..0c60bc5 100644 --- a/src/components/Footer/__snapshots__/test.js.snap +++ b/src/components/Footer/__snapshots__/test.js.snap @@ -40,5 +40,10 @@ exports[`Footer rendering 1`] = ` +
+ example build id +
`; diff --git a/src/components/Footer/index.js b/src/components/Footer/index.js index fd3bade..aaa0bfa 100644 --- a/src/components/Footer/index.js +++ b/src/components/Footer/index.js @@ -1,7 +1,7 @@ import React from 'react'; import { translate, Trans } from 'react-i18next'; -import './style.css'; +import style from './style.css'; const Footer = () => ( ); diff --git a/src/components/Footer/style.css b/src/components/Footer/style.css index 4107fa5..21b16cb 100644 --- a/src/components/Footer/style.css +++ b/src/components/Footer/style.css @@ -1,11 +1,13 @@ @import url('../../globals.css'); footer { + display: flex; margin: var(--spacing-margin) 0; & ul { @apply --inline-list; @apply --with-separator; + flex: 1; } & img { @@ -13,4 +15,9 @@ footer { width: 80px; height: 15px; } + + & .buildId { + align-self: flex-end; + color: color(var(--color-brown) blend(var(--color-tan) 25%)); + } } diff --git a/src/components/Footer/test.js b/src/components/Footer/test.js index 3816e96..367587c 100644 --- a/src/components/Footer/test.js +++ b/src/components/Footer/test.js @@ -4,6 +4,10 @@ import { shallow } from 'enzyme'; import { Footer } from 'components/Footer'; describe('Footer', () => { + beforeEach(() => { + process.env.BUILD_ID = 'example build id'; + }); + test('rendering', () => { const component = shallow(