Smaller tag logo on small displays. Centering tag tile lazy image to prevent load jumps. Including SASS breakpoint variable file automatically.

This commit is contained in:
DebaucheryLibrarian 2021-03-07 16:39:54 +01:00
parent 35cd449e79
commit a275d0c855
7 changed files with 11 additions and 107 deletions

View File

@ -56,4 +56,11 @@ module.exports = {
transition: transform .25s ease, opacity .25s ease; transition: transform .25s ease, opacity .25s ease;
filter: drop-shadow(0 0 2px var(--shadow-weak)); filter: drop-shadow(0 0 2px var(--shadow-weak));
} }
@media(max-width: $breakpoint-small) {
.album-logo {
max-height: .5rem;
max-width: 3.5rem;
}
}
</style> </style>

View File

@ -69,7 +69,7 @@
/> />
<div <div
v-if="release.directors" v-if="release.directors && release.directors.length > 0"
class="row" class="row"
> >
<span class="row-label">Director</span> <span class="row-label">Director</span>

View File

@ -93,8 +93,6 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import 'theme';
.tile { .tile {
box-sizing: border-box; box-sizing: border-box;
position: relative; position: relative;
@ -118,6 +116,7 @@ export default {
height: 13.5rem; height: 13.5rem;
object-fit: cover; object-fit: cover;
background-size: cover; background-size: cover;
background-position: center;
box-shadow: 0 0 3px var(--darken-weak); box-shadow: 0 0 3px var(--darken-weak);
} }

102
package-lock.json generated
View File

@ -10,7 +10,6 @@
"dependencies": { "dependencies": {
"@graphile-contrib/pg-order-by-related": "^1.0.0-beta.6", "@graphile-contrib/pg-order-by-related": "^1.0.0-beta.6",
"@graphile-contrib/pg-simplify-inflector": "^5.0.0-beta.1", "@graphile-contrib/pg-simplify-inflector": "^5.0.0-beta.1",
"@thependulum/bhttp": "^1.2.6",
"acorn": "^8.0.4", "acorn": "^8.0.4",
"array-equal": "^1.0.0", "array-equal": "^1.0.0",
"aws-sdk": "^2.847.0", "aws-sdk": "^2.847.0",
@ -1386,57 +1385,6 @@
"upath": "^1.1.1" "upath": "^1.1.1"
} }
}, },
"node_modules/@thependulum/bhttp": {
"version": "1.2.6",
"resolved": "https://registry.npmjs.org/@thependulum/bhttp/-/bhttp-1.2.6.tgz",
"integrity": "sha512-jqYVj99upU9vfMq4cjMEi87lbmf381e2A8dM91IPgU7TVF9ryN0rYHDK/IcIWbPBJwa8q9l0GzazN2xC2R9TgA==",
"dependencies": {
"bluebird": "^2.8.2",
"concat-stream": "^1.4.7",
"debug": "^2.1.1",
"dev-null": "^0.1.1",
"errors": "^0.2.0",
"extend": "^2.0.0",
"form-data2": "^1.0.0",
"form-fix-array": "^1.0.0",
"lodash.clonedeep": "^4.5.0",
"lodash.merge": "^4.6.2",
"stream-length": "^1.0.2",
"through2-sink": "^1.0.0",
"through2-spy": "^1.2.0",
"tough-cookie": "^2.3.1"
}
},
"node_modules/@thependulum/bhttp/node_modules/bluebird": {
"version": "2.11.0",
"resolved": "https://registry.npmjs.org/bluebird/-/bluebird-2.11.0.tgz",
"integrity": "sha1-U0uQM8AiyVecVro7Plpcqvu2UOE="
},
"node_modules/@thependulum/bhttp/node_modules/debug": {
"version": "2.6.9",
"resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
"integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
"dependencies": {
"ms": "2.0.0"
}
},
"node_modules/@thependulum/bhttp/node_modules/ms": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
"integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
},
"node_modules/@thependulum/bhttp/node_modules/tough-cookie": {
"version": "2.5.0",
"resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.5.0.tgz",
"integrity": "sha512-nlLsUzgm1kfLXSXfRZMc1KLAugd4hqJHDTvc2hDIwS3mZAfMEuMbc03SujMF+GEcpaX/qboeycw6iO8JwVv2+g==",
"dependencies": {
"psl": "^1.1.28",
"punycode": "^2.1.1"
},
"engines": {
"node": ">=0.8"
}
},
"node_modules/@tokenizer/token": { "node_modules/@tokenizer/token": {
"version": "0.1.1", "version": "0.1.1",
"resolved": "https://registry.npmjs.org/@tokenizer/token/-/token-0.1.1.tgz", "resolved": "https://registry.npmjs.org/@tokenizer/token/-/token-0.1.1.tgz",
@ -16750,56 +16698,6 @@
"upath": "^1.1.1" "upath": "^1.1.1"
} }
}, },
"@thependulum/bhttp": {
"version": "1.2.6",
"resolved": "https://registry.npmjs.org/@thependulum/bhttp/-/bhttp-1.2.6.tgz",
"integrity": "sha512-jqYVj99upU9vfMq4cjMEi87lbmf381e2A8dM91IPgU7TVF9ryN0rYHDK/IcIWbPBJwa8q9l0GzazN2xC2R9TgA==",
"requires": {
"bluebird": "^2.8.2",
"concat-stream": "^1.4.7",
"debug": "^2.1.1",
"dev-null": "^0.1.1",
"errors": "^0.2.0",
"extend": "^2.0.0",
"form-data2": "^1.0.0",
"form-fix-array": "^1.0.0",
"lodash.clonedeep": "^4.5.0",
"lodash.merge": "^4.6.2",
"stream-length": "^1.0.2",
"through2-sink": "^1.0.0",
"through2-spy": "^1.2.0",
"tough-cookie": "^2.3.1"
},
"dependencies": {
"bluebird": {
"version": "2.11.0",
"resolved": "https://registry.npmjs.org/bluebird/-/bluebird-2.11.0.tgz",
"integrity": "sha1-U0uQM8AiyVecVro7Plpcqvu2UOE="
},
"debug": {
"version": "2.6.9",
"resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
"integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
"requires": {
"ms": "2.0.0"
}
},
"ms": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
"integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
},
"tough-cookie": {
"version": "2.5.0",
"resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.5.0.tgz",
"integrity": "sha512-nlLsUzgm1kfLXSXfRZMc1KLAugd4hqJHDTvc2hDIwS3mZAfMEuMbc03SujMF+GEcpaX/qboeycw6iO8JwVv2+g==",
"requires": {
"psl": "^1.1.28",
"punycode": "^2.1.1"
}
}
}
},
"@tokenizer/token": { "@tokenizer/token": {
"version": "0.1.1", "version": "0.1.1",
"resolved": "https://registry.npmjs.org/@tokenizer/token/-/token-0.1.1.tgz", "resolved": "https://registry.npmjs.org/@tokenizer/token/-/token-0.1.1.tgz",

View File

@ -71,7 +71,6 @@
"dependencies": { "dependencies": {
"@graphile-contrib/pg-order-by-related": "^1.0.0-beta.6", "@graphile-contrib/pg-order-by-related": "^1.0.0-beta.6",
"@graphile-contrib/pg-simplify-inflector": "^5.0.0-beta.1", "@graphile-contrib/pg-simplify-inflector": "^5.0.0-beta.1",
"@thependulum/bhttp": "^1.2.6",
"acorn": "^8.0.4", "acorn": "^8.0.4",
"array-equal": "^1.0.0", "array-equal": "^1.0.0",
"aws-sdk": "^2.847.0", "aws-sdk": "^2.847.0",

View File

@ -1,7 +1,7 @@
'use strict'; 'use strict';
const config = require('config'); const config = require('config');
const bhttp = require('@thependulum/bhttp'); const bhttp = require('bhttp');
const util = require('util'); const util = require('util');
const stream = require('stream'); const stream = require('stream');
const tunnel = require('tunnel'); const tunnel = require('tunnel');

View File

@ -60,6 +60,7 @@ module.exports = {
loader: 'sass-loader', loader: 'sass-loader',
options: { options: {
sourceMap: true, sourceMap: true,
additionalData: '@import "assets/css/_breakpoints.scss";',
}, },
}, },
], ],