root/regexper-static
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Adding an environment banner to the page

Browse Source 
To prevent testing local changes in production
This commit is contained in:
Jeff Avallone 2018-02-11 09:12:48 -05:00
parent 84df219d7f
commit bbdacca1da
4 changed files with 23 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/PageTemplate.js
View File

@ -18,7 +18,7 @@ const PageTemplate = ({ title, children }) => (
<title>Regexper{ title && (' - ' + title) }</title> <title>Regexper{ title && (' - ' + title) }</title>
</head> </head>
<body> <body>
<header id="main"> <header id="main" data-banner={ process.env.BANNER }>
<h1> <h1>
<a href="/">Regexper</a> <a href="/">Regexper</a>
</h1> </h1>

2
src/components/__snapshots__/PageTemplate.test.js.snap
View File

@ -24,6 +24,7 @@ exports[`PageTemplate rendering 1`] = `
</head> </head>
<body> <body>
<header <header
data-banner={undefined}
id="main" id="main"
> >
<h1> <h1>
@ -102,6 +103,7 @@ exports[`PageTemplate rendering with title 1`] = `
</head> </head>
<body> <body>
<header <header
data-banner={undefined}
id="main" id="main"
> >
<h1> <h1>

16
src/style.css
View File

@ -33,6 +33,22 @@ body {
position: relative; position: relative;
} }
#main:after {
content: attr(data-banner);
pointer-events: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: var(--header-height);
line-height: var(--header-height);
text-transform: uppercase;
text-align: center;
font-size: calc(var(--header-height) * 0.7);
font-weight: bold;
opacity: 0.2;
}
#main h1 { #main h1 {
font-family: 'Bangers', 'cursive'; font-family: 'Bangers', 'cursive';
font-size: 4rem; font-size: 4rem;

5
webpack.common.js
View File

@ -38,7 +38,10 @@ module.exports = {
}, },
plugins: [ plugins: [
new webpack.EnvironmentPlugin({ new webpack.EnvironmentPlugin({
NODE_ENV: 'development' NODE_ENV: 'development',
GA_PROPERTY: null,
SENTRY_KEY: null,
BANNER: process.env.NODE_ENV === 'production' ? null : (process.env.NODE_ENV || 'development')
}), }),
new webpack.optimize.CommonsChunkPlugin({ new webpack.optimize.CommonsChunkPlugin({
name: 'common', name: 'common',