diff --git a/src/icons/logo-white.svg b/src/icons/logo-white.svg new file mode 100644 index 00000000..bc94adec --- /dev/null +++ b/src/icons/logo-white.svg @@ -0,0 +1,9 @@ + + React Logo + + + + + + + \ No newline at end of file diff --git a/src/icons/logo.svg b/src/icons/logo.svg index d1ec3a75..546bb417 100644 --- a/src/icons/logo.svg +++ b/src/icons/logo.svg @@ -1 +1,9 @@ -logo \ No newline at end of file + + React Logo + + + + + + + \ No newline at end of file diff --git a/src/pages/index.js b/src/pages/index.js index 0df1abcb..9c3c4173 100644 --- a/src/pages/index.js +++ b/src/pages/index.js @@ -18,6 +18,7 @@ import createOgUrl from 'utils/createOgUrl'; import loadScript from 'utils/loadScript'; import {babelURL} from 'site-constants'; import ReactDOM from 'react-dom'; +import logoWhiteSvg from 'icons/logo-white.svg'; class Home extends Component { constructor(props, context) { @@ -99,10 +100,20 @@ class Home extends Component { maxWidth: 1500, // Positioning of background logo marginLeft: 'auto', marginRight: 'auto', - backgroundImage: 'url(/large-logo.svg)', - backgroundRepeat: 'no-repeat', - backgroundPosition: '100% 100px', - backgroundSize: '50% auto', + position: 'relative', + '::before': { + content: ' ', + position: 'absolute', + top: 0, + left: 0, + bottom: 0, + right: 0, + backgroundImage: `url(${logoWhiteSvg})`, + backgroundRepeat: 'no-repeat', + backgroundPosition: '100% 100px', + backgroundSize: '50% auto', + opacity: 0.05, + }, }, }}> diff --git a/static/large-logo.svg b/static/large-logo.svg deleted file mode 100644 index 6bd38ac2..00000000 --- a/static/large-logo.svg +++ /dev/null @@ -1 +0,0 @@ -large-logo \ No newline at end of file