Update all call-sites to asset files (static or build)

Author: asapzacy

README.md

@@ -1,7 +1,7 @@
 
 # uxscoreboard
 
-![uxscoreboard preview](https://zac.codes/assets/img/projects/uxscoreboard_preview-xlarge.jpg)
+![uxscoreboard preview](https://zac.codes/assets/static/img/projects/uxscoreboard_preview-xlarge.jpg)
 
 uxscoreboard | A sports scoreboard web app built on ES6, React, and Node.js.
 

src/components/Diamond/BaseballField.js

@@ -3,7 +3,7 @@ import { createDiamond } from 'helpers/baseball'
 import s from './BaseballField.scss'
 
 const BaseballField = ({ offense }) => (
-  <img className={s.baseballField} src={`/assets/img/mlb/other/${createDiamond(offense)}.svg`} />
+  <img className={s.baseballField} src={`/assets/static/img/mlb/other/${createDiamond(offense)}.svg`} />
 )
 
 export default BaseballField

src/components/Header/Item.js

@@ -7,7 +7,7 @@ const Item = ({ name, url, icon, screenWidth }) => (
     <Link className={s.link} to={`/${url}`} title={`uxscoreboard | ${name} scores`} activeClassName='active'>
       <span className={s.text}>
         { screenWidth < 667 &&
-          <span className={s.icon} style={{backgroundImage:`url('/assets/icons/${icon}.svg')`}}></span>
+          <span className={s.icon} style={{backgroundImage:`url('/assets/static/icons/${icon}.svg')`}}></span>
         }
         {name}
       </span>

src/components/Header/Logo.js

@@ -4,7 +4,7 @@ import s from './Header.scss'
 
 const Logo = () => (
   <Link to='/' title={'uxscoreboard'}>
-    <img className={s.logo} src={'/assets/img/uxscoreboard.svg'} alt={'uxscoreboard'} />
+    <img className={s.logo} src={'/assets/static/img/uxscoreboard.svg'} alt={'uxscoreboard'} />
   </Link>
 )
 

src/components/Home/Item.scss

@@ -36,11 +36,11 @@
   transition-delay:0.11s;
 }
 .mlb, .mls, .nba, .nfl, .nhl { composes:link }
-.mlb::after { background-image:url('/assets/icons/baseball_light.svg') }
-.mls::after { background-image:url('/assets/icons/soccer_light.svg') }
-.nba::after { background-image:url('/assets/icons/basketball_light.svg') }
-.nfl::after { background-image:url('/assets/icons/football_light.svg') }
-.nhl::after { background-image:url('/assets/icons/hockey_light.svg');top:20%;bottom:20% }
+.mlb::after { background-image:url('/assets/static/icons/baseball_light.svg') }
+.mls::after { background-image:url('/assets/static/icons/soccer_light.svg') }
+.nba::after { background-image:url('/assets/static/icons/basketball_light.svg') }
+.nfl::after { background-image:url('/assets/static/icons/football_light.svg') }
+.nhl::after { background-image:url('/assets/static/icons/hockey_light.svg');top:20%;bottom:20% }
 
 @media only screen and (min-width:$medium) {
   .item {

src/components/NotFound/NotFound.scss

@@ -4,5 +4,5 @@
   width: 100%;
   position: absolute;
   top: 0; right: 0; bottom: 0; left: 0;
-  background: $real_black url('/assets/img/404/mr_robot-404.jpg') center center / contain no-repeat;
+  background: $real_black url('/assets/static/img/404/mr_robot-404.jpg') center center / contain no-repeat;
 }

src/components/Team/Team.js

@@ -9,7 +9,7 @@ const makeBgImg = (code, league, isLoaded) => ({
 
 const Team = ({ name, code, filetype = 'svg', ws, ls, ts, score, league, hasLoaded, logoHasLoaded }) => (
   <section className={code === 'nyy' ? s[code] : s.container} style={makeBgImg(code, league)}>
-    <LogoContainer src={`/assets/img/${league}/teams/${code}.${filetype}`} name={name} hasLoaded={hasLoaded} logoHasLoaded={logoHasLoaded} />
+    <LogoContainer src={`/assets/static/img/${league}/teams/${code}.${filetype}`} name={name} hasLoaded={hasLoaded} logoHasLoaded={logoHasLoaded} />
     <main className={s.info}>
       <section className={s.leftSide}>
         <span className={s.name}>{ name.length >= 9 ? <small>{name}</small> : name }</span>

src/containers/Scoreboard/ScoreboardContainer.js

@@ -66,13 +66,13 @@ class ScoreboardContainer extends Component {
     let img = ''
     if (this.state.seasonState.isPlayoffs) {
       if (this.state.seasonState.isFinals) {
-        img = `url(/assets/img/${this.props.league}/other/finals.svg)`
+        img = `url(/assets/static/img/${this.props.league}/other/finals.svg)`
       } else {
-        img = `url(/assets/img/${this.props.league}/other/playoffs.svg)`
+        img = `url(/assets/static/img/${this.props.league}/other/playoffs.svg)`
       }
     }
     if (this.state.seasonState.isAllStar) {
-      img = `url(/assets/img/${this.props.league}/other/all-star-game.svg)`
+      img = `url(/assets/static/img/${this.props.league}/other/all-star-game.svg)`
     }
     this.setState({ bgImg: img })
   }

src/index.html

@@ -8,7 +8,7 @@
     <title>uxscoreboard</title>
     <meta name="description" content="uxscoreboard · A sports scoreboard web app built on ES6, React, and Node.js—features MLB, NBA, NFL, NHL, and MLS (coming soon) games.">
     <link rel="icon" href="/favicon.ico">
-    <link rel="stylesheet" href="/assets/css/styles.css">
+    <link rel="stylesheet" href="/assets/static/css/styles.css">
     <!--
                                              _                         _
                                             | |                       | |

webpack.config.babel.js

@@ -78,7 +78,7 @@ const duplicatePackageCheckerPlugin = new DuplicatePackageCheckerPlugin({
 
 const extractTextPlugin = new ExtractTextPlugin({
   disable: !isProduction,
-  filename: 'assets/css/bundle.[hash:12].css'
+  filename: 'assets/build/css/bundle.[hash:12].css'
 })
 
 const compressionPlugin = new CompressionPlugin({
@@ -146,7 +146,7 @@ const sharedCssLoaders = [
 const base = {
   output: {
     path: PATHS.build,
-    filename: isProduction ? 'assets/js/bundle.[hash:12].min.js' : 'assets/js/bundle.[hash:12].js',
+    filename: isProduction ? 'assets/build/js/bundle.[hash:12].min.js' : 'assets/build/js/bundle.[hash:12].js',
     publicPath: '/'
   },
   module: {