Skip to content

Commit

Permalink
chore(cli): update all CSS "@assets" use in templates;
Browse files Browse the repository at this point in the history
- thank you css-loader -.-
  • Loading branch information
lukeed committed Mar 31, 2020
1 parent 5d37039 commit 03f20e0
Show file tree
Hide file tree
Showing 25 changed files with 56 additions and 57 deletions.
1 change: 0 additions & 1 deletion packages/cli/lib/init.js
Expand Up @@ -320,7 +320,6 @@ module.exports = function (type, dir, opts) {
let esc = styleExt === 'less' ? '&' : (styleExt === 'sass' ? '\\' : '');
css = css.replace(/\.shape(\s|\n)/g, esc + ':global(.shape)$1');
css = css.replace(/\.intro(\s|\n)/g, esc + ':global(.intro)$1');
css = css.replace(/(@assets)/g, '~$1'); // TODO: temporary (I hope)
}
out.end(tmp.replace('%%__styles__%%', css));
}
Expand Down
2 changes: 1 addition & 1 deletion packages/cli/templates/css-router/components/Footer.css
Expand Up @@ -25,7 +25,7 @@
.heart {
width: 40px;
height: 40px;
background: transparent url(@assets/twitter_heart.png) no-repeat;
background: transparent url(~@assets/twitter_heart.png) no-repeat;
background-size: 2900%;
margin: 0 -8px;
}
Expand Down
10 changes: 5 additions & 5 deletions packages/cli/templates/css-router/components/Hero.css
Expand Up @@ -53,23 +53,23 @@
}

:global(.penta) {
background-image: url(@assets/shapes/penta.svg);
background-image: url(~@assets/shapes/penta.svg);
}

:global(.point) {
background-image: url(@assets/shapes/point.svg);
background-image: url(~@assets/shapes/point.svg);
}

:global(.square) {
background-image: url(@assets/shapes/square.svg);
background-image: url(~@assets/shapes/square.svg);
}

:global(.cross) {
background-image: url(@assets/shapes/cross.svg);
background-image: url(~@assets/shapes/cross.svg);
}

:global(.circle) {
background-image: url(@assets/shapes/circle.svg);
background-image: url(~@assets/shapes/circle.svg);
}

@media screen and (max-width: 421px) {
Expand Down
2 changes: 1 addition & 1 deletion packages/cli/templates/css-router/components/Nav.css
Expand Up @@ -53,7 +53,7 @@
content: '';
position: absolute;
background: transparent no-repeat center;
background-image: url(@assets/link.svg);
background-image: url(~@assets/link.svg);
height: 12px;
width: 12px;
right: -8px;
Expand Down
2 changes: 1 addition & 1 deletion packages/cli/templates/css/components/Footer.css
Expand Up @@ -25,7 +25,7 @@
.heart {
width: 40px;
height: 40px;
background: transparent url(@assets/twitter_heart.png) no-repeat;
background: transparent url(~@assets/twitter_heart.png) no-repeat;
background-size: 2900%;
margin: 0 -8px;
}
Expand Down
10 changes: 5 additions & 5 deletions packages/cli/templates/css/components/Hero.css
Expand Up @@ -53,23 +53,23 @@
}

:global(.penta) {
background-image: url(@assets/shapes/penta.svg);
background-image: url(~@assets/shapes/penta.svg);
}

:global(.point) {
background-image: url(@assets/shapes/point.svg);
background-image: url(~@assets/shapes/point.svg);
}

:global(.square) {
background-image: url(@assets/shapes/square.svg);
background-image: url(~@assets/shapes/square.svg);
}

:global(.cross) {
background-image: url(@assets/shapes/cross.svg);
background-image: url(~@assets/shapes/cross.svg);
}

:global(.circle) {
background-image: url(@assets/shapes/circle.svg);
background-image: url(~@assets/shapes/circle.svg);
}

@media screen and (max-width: 421px) {
Expand Down
2 changes: 1 addition & 1 deletion packages/cli/templates/css/components/Nav.css
Expand Up @@ -53,7 +53,7 @@
content: '';
position: absolute;
background: transparent no-repeat center;
background-image: url(@assets/link.svg);
background-image: url(~@assets/link.svg);
height: 12px;
width: 12px;
right: -8px;
Expand Down
2 changes: 1 addition & 1 deletion packages/cli/templates/less-router/components/Footer.less
Expand Up @@ -27,7 +27,7 @@
.heart {
width: 40px;
height: 40px;
background: transparent url("@assets/twitter_heart.png") no-repeat;
background: transparent url("~@assets/twitter_heart.png") no-repeat;
background-size: 2900%;
margin: 0 -8px;
&:hover {
Expand Down
10 changes: 5 additions & 5 deletions packages/cli/templates/less-router/components/Hero.less
Expand Up @@ -49,23 +49,23 @@
}

&:global(.penta) {
background-image: url("@assets/shapes/penta.svg");
background-image: url("~@assets/shapes/penta.svg");
}

&:global(.point) {
background-image: url("@assets/shapes/point.svg");
background-image: url("~@assets/shapes/point.svg");
}

&:global(.square) {
background-image: url("@assets/shapes/square.svg");
background-image: url("~@assets/shapes/square.svg");
}

&:global(.cross) {
background-image: url("@assets/shapes/cross.svg");
background-image: url("~@assets/shapes/cross.svg");
}

&:global(.circle) {
background-image: url("@assets/shapes/circle.svg");
background-image: url("~@assets/shapes/circle.svg");
}

@media screen and (max-width: 421px) {
Expand Down
2 changes: 1 addition & 1 deletion packages/cli/templates/less-router/components/Nav.less
Expand Up @@ -51,7 +51,7 @@
content: '';
position: absolute;
background: transparent no-repeat center;
background-image: url("@assets/link.svg");
background-image: url("~@assets/link.svg");
height: 12px;
width: 12px;
right: -8px;
Expand Down
2 changes: 1 addition & 1 deletion packages/cli/templates/less/components/Footer.less
Expand Up @@ -27,7 +27,7 @@
.heart {
width: 40px;
height: 40px;
background: transparent url("@assets/twitter_heart.png") no-repeat;
background: transparent url("~@assets/twitter_heart.png") no-repeat;
background-size: 2900%;
margin: 0 -8px;
&:hover {
Expand Down
10 changes: 5 additions & 5 deletions packages/cli/templates/less/components/Hero.less
Expand Up @@ -49,23 +49,23 @@
}

&:global(.penta) {
background-image: url("@assets/shapes/penta.svg");
background-image: url("~@assets/shapes/penta.svg");
}

&:global(.point) {
background-image: url("@assets/shapes/point.svg");
background-image: url("~@assets/shapes/point.svg");
}

&:global(.square) {
background-image: url("@assets/shapes/square.svg");
background-image: url("~@assets/shapes/square.svg");
}

&:global(.cross) {
background-image: url("@assets/shapes/cross.svg");
background-image: url("~@assets/shapes/cross.svg");
}

&:global(.circle) {
background-image: url("@assets/shapes/circle.svg");
background-image: url("~@assets/shapes/circle.svg");
}

@media screen and (max-width: 421px) {
Expand Down
2 changes: 1 addition & 1 deletion packages/cli/templates/less/components/Nav.less
Expand Up @@ -51,7 +51,7 @@
content: '';
position: absolute;
background: transparent no-repeat center;
background-image: url("@assets/link.svg");
background-image: url("~@assets/link.svg");
height: 12px;
width: 12px;
right: -8px;
Expand Down
2 changes: 1 addition & 1 deletion packages/cli/templates/sass-router/components/Footer.sass
Expand Up @@ -20,7 +20,7 @@
.heart
width: 40px
height: 40px
background: transparent url(@assets/twitter_heart.png) no-repeat
background: transparent url(~@assets/twitter_heart.png) no-repeat
background-size: 2900%
margin: 0 -8px
&:hover
Expand Down
10 changes: 5 additions & 5 deletions packages/cli/templates/sass-router/components/Hero.sass
Expand Up @@ -43,19 +43,19 @@
width: var(--size)

\:global(.penta)
background-image: url(@assets/shapes/penta.svg)
background-image: url(~@assets/shapes/penta.svg)

\:global(.point)
background-image: url(@assets/shapes/point.svg)
background-image: url(~@assets/shapes/point.svg)

\:global(.square)
background-image: url(@assets/shapes/square.svg)
background-image: url(~@assets/shapes/square.svg)

\:global(.cross)
background-image: url(@assets/shapes/cross.svg)
background-image: url(~@assets/shapes/cross.svg)

\:global(.circle)
background-image: url(@assets/shapes/circle.svg)
background-image: url(~@assets/shapes/circle.svg)

@media screen and (max-width: 421px)
.shape
Expand Down
2 changes: 1 addition & 1 deletion packages/cli/templates/sass-router/components/Nav.sass
Expand Up @@ -45,7 +45,7 @@
content: ''
position: absolute
background: transparent no-repeat center
background-image: url(@assets/link.svg)
background-image: url(~@assets/link.svg)
height: 12px
width: 12px
right: -8px
Expand Down
2 changes: 1 addition & 1 deletion packages/cli/templates/sass/components/Footer.sass
Expand Up @@ -20,7 +20,7 @@
.heart
width: 40px
height: 40px
background: transparent url(@assets/twitter_heart.png) no-repeat
background: transparent url(~@assets/twitter_heart.png) no-repeat
background-size: 2900%
margin: 0 -8px
&:hover
Expand Down
10 changes: 5 additions & 5 deletions packages/cli/templates/sass/components/Hero.sass
Expand Up @@ -43,19 +43,19 @@
width: var(--size)

\:global(.penta)
background-image: url(@assets/shapes/penta.svg)
background-image: url(~@assets/shapes/penta.svg)

\:global(.point)
background-image: url(@assets/shapes/point.svg)
background-image: url(~@assets/shapes/point.svg)

\:global(.square)
background-image: url(@assets/shapes/square.svg)
background-image: url(~@assets/shapes/square.svg)

\:global(.cross)
background-image: url(@assets/shapes/cross.svg)
background-image: url(~@assets/shapes/cross.svg)

\:global(.circle)
background-image: url(@assets/shapes/circle.svg)
background-image: url(~@assets/shapes/circle.svg)

@media screen and (max-width: 421px)
.shape
Expand Down
2 changes: 1 addition & 1 deletion packages/cli/templates/sass/components/Nav.sass
Expand Up @@ -45,7 +45,7 @@
content: ''
position: absolute
background: transparent no-repeat center
background-image: url(@assets/link.svg)
background-image: url(~@assets/link.svg)
height: 12px
width: 12px
right: -8px
Expand Up @@ -22,7 +22,7 @@
.heart
width 40px
height 40px
background transparent url("@assets/twitter_heart.png") no-repeat
background transparent url("~@assets/twitter_heart.png") no-repeat
background-size 2900%
margin 0 -8px
&:hover
Expand Down
10 changes: 5 additions & 5 deletions packages/cli/templates/stylus-router/components/Hero.styl
Expand Up @@ -43,19 +43,19 @@
width var(--size)

:global(.penta)
background-image url("@assets/shapes/penta.svg")
background-image url("~@assets/shapes/penta.svg")

:global(.point)
background-image url("@assets/shapes/point.svg")
background-image url("~@assets/shapes/point.svg")

:global(.square)
background-image url("@assets/shapes/square.svg")
background-image url("~@assets/shapes/square.svg")

:global(.cross)
background-image url("@assets/shapes/cross.svg")
background-image url("~@assets/shapes/cross.svg")

:global(.circle)
background-image url("@assets/shapes/circle.svg")
background-image url("~@assets/shapes/circle.svg")

@media screen and (max-width: 421px)
.shape
Expand Down
2 changes: 1 addition & 1 deletion packages/cli/templates/stylus-router/components/Nav.styl
Expand Up @@ -45,7 +45,7 @@
content ''
position absolute
background transparent no-repeat center
background-image url("@assets/link.svg")
background-image url("~@assets/link.svg")
height 12px
width 12px
right -8px
Expand Down
2 changes: 1 addition & 1 deletion packages/cli/templates/stylus/components/Footer.styl
Expand Up @@ -22,7 +22,7 @@
.heart
width 40px
height 40px
background transparent url("@assets/twitter_heart.png") no-repeat
background transparent url("~@assets/twitter_heart.png") no-repeat
background-size 2900%
margin 0 -8px
&:hover
Expand Down
10 changes: 5 additions & 5 deletions packages/cli/templates/stylus/components/Hero.styl
Expand Up @@ -43,19 +43,19 @@
width var(--size)

:global(.penta)
background-image url("@assets/shapes/penta.svg")
background-image url("~@assets/shapes/penta.svg")

:global(.point)
background-image url("@assets/shapes/point.svg")
background-image url("~@assets/shapes/point.svg")

:global(.square)
background-image url("@assets/shapes/square.svg")
background-image url("~@assets/shapes/square.svg")

:global(.cross)
background-image url("@assets/shapes/cross.svg")
background-image url("~@assets/shapes/cross.svg")

:global(.circle)
background-image url("@assets/shapes/circle.svg")
background-image url("~@assets/shapes/circle.svg")

@media screen and (max-width: 421px)
.shape
Expand Down
2 changes: 1 addition & 1 deletion packages/cli/templates/stylus/components/Nav.styl
Expand Up @@ -45,7 +45,7 @@
content ''
position absolute
background transparent no-repeat center
background-image url("@assets/link.svg")
background-image url("~@assets/link.svg")
height 12px
width 12px
right -8px

0 comments on commit 03f20e0

Please sign in to comment.