diff options
Diffstat (limited to '')
| -rw-r--r-- | src/scss/_mixins.scss | 20 | ||||
| -rw-r--r-- | src/scss/main.scss | 6 |
2 files changed, 18 insertions, 8 deletions
diff --git a/src/scss/_mixins.scss b/src/scss/_mixins.scss index 0879b18..25eb0c1 100644 --- a/src/scss/_mixins.scss +++ b/src/scss/_mixins.scss @@ -65,13 +65,13 @@ @mixin font-face($name) { @font-face { font-family: $name; - src: url("../font/" + $name + ".eot"); - src: url("../font/" + $name + ".eot?#iefix") format("embedded-opentype"), - url("../font/" + $name + ".woff2") format("woff2"), - url("../font/" + $name + ".woff") format("woff"), - url("../font/" + $name + ".ttf") format("truetype"), - url("../font/" + $name + ".otf") format("opentype"), - url("../font/" + $name + ".svg#" + $name) format('svg'); + src: url("WEB_ROOTpublic/font/" + $name + ".eot"); + src: url("WEB_ROOTpublic/font/" + $name + ".eot?#iefix") format("embedded-opentype"), + url("WEB_ROOTpublic/font/" + $name + ".woff2") format("woff2"), + url("WEB_ROOTpublic/font/" + $name + ".woff") format("woff"), + url("WEB_ROOTpublic/font/" + $name + ".ttf") format("truetype"), + url("WEB_ROOTpublic/font/" + $name + ".otf") format("opentype"), + url("WEB_ROOTpublic/font/" + $name + ".svg#" + $name) format('svg'); font-weight: normal; font-style: normal; font-display: swap; @@ -89,3 +89,9 @@ -dt-display: table-cell; display: table-cell; } + +@mixin background-image($fallback, $sources...) { + background-image: $fallback; + background-image: -webkit-image-set(#{$sources}); + background-image: image-set(#{$sources}); +} diff --git a/src/scss/main.scss b/src/scss/main.scss index 362e6b9..f750dea 100644 --- a/src/scss/main.scss +++ b/src/scss/main.scss @@ -114,7 +114,11 @@ html { } body { - background-image: url("../img/background.png?ref=3"); + @include background-image( + url("WEB_ROOT/public/img/background.png?ref=4"), + url("WEB_ROOT/public/img/background.webp?ref=4") type("image/webp"), + url("WEB_ROOT/public/img/background.png?ref=4") type("image/png") + ); background-repeat: repeat; background-size: 512px; background-color: #181818; |