diff --git a/package.json b/package.json index 3671dd98..cd1742a5 100644 --- a/package.json +++ b/package.json @@ -17,7 +17,6 @@ "license": "GPL-2.0", "dependencies": { "@fontsource/poppins": "^5.0.5", - "lazysizes": "^5.3.2", "oneloop.js": "^5.2.1" }, "devDependencies": { diff --git a/src/js/editor.js b/src/js/editor.js index fbed2e49..771566b5 100644 --- a/src/js/editor.js +++ b/src/js/editor.js @@ -2,21 +2,10 @@ /* Customize BFFEditorSettings in inc/Services/Editor.php or with `bff_editor_custom_settings` filter (see readme). */ -import lazySizes from 'lazysizes' -import 'lazysizes/plugins/native-loading/ls.native-loading' -import 'lazysizes/plugins/object-fit/ls.object-fit' import domReady from '@wordpress/dom-ready' import { addFilter } from '@wordpress/hooks' import { unregisterBlockStyle, getBlockVariations, unregisterBlockVariation } from '@wordpress/blocks' -/** - * LazySizes configuration - * https://github.com/aFarkas/lazysizes/#js-api---options - */ -lazySizes.cfg.nativeLoading = { - setLoadingAttribute: false, -} - // Native Gutenberg domReady(() => { // Disable specific block styles diff --git a/src/js/index.js b/src/js/index.js index 7a6f043e..64b490f0 100644 --- a/src/js/index.js +++ b/src/js/index.js @@ -1,5 +1,3 @@ -import 'lazysizes' -import 'lazysizes/plugins/print/ls.print' import './classes/ScrollDirection' import './classes/ButtonSeoClick' import './classes/Header' diff --git a/src/scss/02-tools/_m-placeholder-media.scss b/src/scss/02-tools/_m-placeholder-media.scss index 9ac0b2d2..dc71bb17 100644 --- a/src/scss/02-tools/_m-placeholder-media.scss +++ b/src/scss/02-tools/_m-placeholder-media.scss @@ -28,11 +28,6 @@ content: ""; } - .lazyload, - .lazyloading { - height: 0; - } - #{$targets} { position: absolute; top: 0; diff --git a/src/scss/04-utilities/_lazyload.scss b/src/scss/04-utilities/_lazyload.scss deleted file mode 100644 index df725030..00000000 --- a/src/scss/04-utilities/_lazyload.scss +++ /dev/null @@ -1,76 +0,0 @@ -@use "sass:math"; - -.lazyload, -.lazyloading { - background: $color-primary; - opacity: 0; -} - -.lazyloaded { - opacity: 1; - transition: opacity .5s; -} - -// css loading for bgset items -// with basicspinner -$loading-dimensions: 50px; - -[data-bgset] { - position: relative; - background-repeat: no-repeat; - background-position: 50% 50%; - background-size: cover; - opacity: 1; - - &::before { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - z-index: 2; - content: ""; - background: $color-primary; - transition: opacity .5s, z-index .5s ease .5s; - } - - &::after { - position: absolute; - top: calc(50% - #{math.div($loading-dimensions, 2)}); - left: calc(50% - #{math.div($loading-dimensions, 2)}); - z-index: 3; - width: $loading-dimensions; - height: $loading-dimensions; - content: ""; - border: 5px solid $color-light; - border-top-color: transparent; - border-radius: $loading-dimensions; - opacity: 1; - transition: opacity .5s, z-index .5s ease .5s; - transform: translateX(-50%) translateY(-50%); - animation: loading .5s linear infinite; - } - - &.lazyload { - opacity: 1; - transition: opacity .5s; - } - - &.lazyloaded { - &::after, - &::before { - z-index: -1; - opacity: 0; - } - } -} - -@keyframes loading { - 0% { - transform: rotate(0deg); - } - - 100% { - transform: rotate(360deg); - } -} diff --git a/src/scss/04-utilities/utilities.scss b/src/scss/04-utilities/utilities.scss index a86ff752..cf2d3d76 100644 --- a/src/scss/04-utilities/utilities.scss +++ b/src/scss/04-utilities/utilities.scss @@ -1,6 +1,5 @@ @import "./wp-admin-bar"; @import "./focus"; -@import "./lazyload"; @import "./seo"; @import "./video-wrapper"; @import "./palette"; diff --git a/yarn.lock b/yarn.lock index efb2bffa..c9fec6d5 100644 --- a/yarn.lock +++ b/yarn.lock @@ -574,13 +574,20 @@ __metadata: languageName: node linkType: hard -"@eslint-community/regexpp@npm:^4.4.0, @eslint-community/regexpp@npm:^4.6.1": +"@eslint-community/regexpp@npm:^4.4.0": version: 4.12.1 resolution: "@eslint-community/regexpp@npm:4.12.1" checksum: 10/c08f1dd7dd18fbb60bdd0d85820656d1374dd898af9be7f82cb00451313402a22d5e30569c150315b4385907cdbca78c22389b2a72ab78883b3173be317620cc languageName: node linkType: hard +"@eslint-community/regexpp@npm:^4.6.1": + version: 4.10.0 + resolution: "@eslint-community/regexpp@npm:4.10.0" + checksum: 10/8c36169c815fc5d726078e8c71a5b592957ee60d08c6470f9ce0187c8046af1a00afbda0a065cc40ff18d5d83f82aed9793c6818f7304a74a7488dc9f3ecbd42 + languageName: node + linkType: hard + "@eslint/eslintrc@npm:^2.0.1, @eslint/eslintrc@npm:^2.1.4": version: 2.1.4 resolution: "@eslint/eslintrc@npm:2.1.4" @@ -1002,12 +1009,12 @@ __metadata: linkType: hard "@types/eslint@npm:*": - version: 9.6.1 - resolution: "@types/eslint@npm:9.6.1" + version: 8.56.10 + resolution: "@types/eslint@npm:8.56.10" dependencies: "@types/estree": "npm:*" "@types/json-schema": "npm:*" - checksum: 10/719fcd255760168a43d0e306ef87548e1e15bffe361d5f4022b0f266575637acc0ecb85604ac97879ee8ae83c6a6d0613b0ed31d0209ddf22a0fe6d608fc56fe + checksum: 10/0cdd914b944ebba51c35827d3ef95bc3e16eb82b4c2741f6437fa57cdb00a4407c77f89c220afe9e4c9566982ec8a0fb9b97c956ac3bd4623a3b6af32eed8424 languageName: node linkType: hard @@ -1076,11 +1083,11 @@ __metadata: linkType: hard "@types/node@npm:*": - version: 22.14.0 - resolution: "@types/node@npm:22.14.0" + version: 20.12.12 + resolution: "@types/node@npm:20.12.12" dependencies: - undici-types: "npm:~6.21.0" - checksum: 10/d0669a8a37a18532c886ccfa51eb3fe1e46088deb4d3d27ebcd5d7d68bd6343ad1c7a3fcb85164780a57629359c33a6c917ecff748ea232bceac7692acc96537 + undici-types: "npm:~5.26.4" + checksum: 10/e3945da0a3017bdc1f88f15bdfb823f526b2a717bd58d4640082d6eb0bd2794b5c99bfb914b9e9324ec116dce36066990353ed1c777e8a7b0641f772575793c4 languageName: node linkType: hard @@ -1662,7 +1669,16 @@ __metadata: languageName: node linkType: hard -"acorn@npm:^8.0.4, acorn@npm:^8.11.0, acorn@npm:^8.14.0, acorn@npm:^8.8.2, acorn@npm:^8.9.0": +"acorn@npm:^8.0.4, acorn@npm:^8.8.2, acorn@npm:^8.9.0": + version: 8.11.3 + resolution: "acorn@npm:8.11.3" + bin: + acorn: bin/acorn + checksum: 10/b688e7e3c64d9bfb17b596e1b35e4da9d50553713b3b3630cf5690f2b023a84eac90c56851e6912b483fe60e8b4ea28b254c07e92f17ef83d72d78745a8352dd + languageName: node + linkType: hard + +"acorn@npm:^8.11.0, acorn@npm:^8.14.0": version: 8.14.1 resolution: "acorn@npm:8.14.1" bin: @@ -2113,7 +2129,6 @@ __metadata: imagemin-jpegtran: "npm:^7.0.0" imagemin-optipng: "npm:^8.0.0" imagemin-svgo: "npm:^10.0.1" - lazysizes: "npm:^5.3.2" mini-css-extract-plugin: "npm:^1.5.0" oneloop.js: "npm:^5.2.1" postcss: "npm:^8.4.24" @@ -2415,7 +2430,7 @@ __metadata: languageName: node linkType: hard -"call-bind-apply-helpers@npm:^1.0.0, call-bind-apply-helpers@npm:^1.0.1, call-bind-apply-helpers@npm:^1.0.2": +"call-bind-apply-helpers@npm:^1.0.0, call-bind-apply-helpers@npm:^1.0.2": version: 1.0.2 resolution: "call-bind-apply-helpers@npm:1.0.2" dependencies: @@ -2425,6 +2440,16 @@ __metadata: languageName: node linkType: hard +"call-bind-apply-helpers@npm:^1.0.1": + version: 1.0.1 + resolution: "call-bind-apply-helpers@npm:1.0.1" + dependencies: + es-errors: "npm:^1.3.0" + function-bind: "npm:^1.1.2" + checksum: 10/6e30c621170e45f1fd6735e84d02ee8e02a3ab95cb109499d5308cbe5d1e84d0cd0e10b48cc43c76aa61450ae1b03a7f89c37c10fc0de8d4998b42aab0f268cc + languageName: node + linkType: hard + "call-bind@npm:^1.0.7, call-bind@npm:^1.0.8": version: 1.0.8 resolution: "call-bind@npm:1.0.8" @@ -3273,15 +3298,15 @@ __metadata: languageName: node linkType: hard -"debug@npm:4, debug@npm:^4.3.1, debug@npm:^4.3.2, debug@npm:^4.3.4, debug@npm:^4.3.6": - version: 4.4.0 - resolution: "debug@npm:4.4.0" +"debug@npm:4, debug@npm:^4.3.1, debug@npm:^4.3.2, debug@npm:^4.3.4": + version: 4.3.4 + resolution: "debug@npm:4.3.4" dependencies: - ms: "npm:^2.1.3" + ms: "npm:2.1.2" peerDependenciesMeta: supports-color: optional: true - checksum: 10/1847944c2e3c2c732514b93d11886575625686056cd765336212dc15de2d2b29612b6cd80e1afba767bb8e1803b778caf9973e98169ef1a24a7a7009e1820367 + checksum: 10/0073c3bcbd9cb7d71dd5f6b55be8701af42df3e56e911186dfa46fac3a5b9eb7ce7f377dd1d3be6db8977221f8eb333d945216f645cf56f6b688cd484837d255 languageName: node linkType: hard @@ -3294,6 +3319,18 @@ __metadata: languageName: node linkType: hard +"debug@npm:^4.3.6": + version: 4.4.0 + resolution: "debug@npm:4.4.0" + dependencies: + ms: "npm:^2.1.3" + peerDependenciesMeta: + supports-color: + optional: true + checksum: 10/1847944c2e3c2c732514b93d11886575625686056cd765336212dc15de2d2b29612b6cd80e1afba767bb8e1803b778caf9973e98169ef1a24a7a7009e1820367 + languageName: node + linkType: hard + "decamelize-keys@npm:^1.1.0": version: 1.1.1 resolution: "decamelize-keys@npm:1.1.1" @@ -4748,12 +4785,12 @@ __metadata: linkType: hard "follow-redirects@npm:^1.0.0": - version: 1.15.9 - resolution: "follow-redirects@npm:1.15.9" + version: 1.15.6 + resolution: "follow-redirects@npm:1.15.6" peerDependenciesMeta: debug: optional: true - checksum: 10/e3ab42d1097e90d28b913903841e6779eb969b62a64706a3eb983e894a5db000fbd89296f45f08885a0e54cd558ef62e81be1165da9be25a6c44920da10f424c + checksum: 10/70c7612c4cab18e546e36b991bbf8009a1a41cf85354afe04b113d1117569abf760269409cb3eb842d9f7b03d62826687086b081c566ea7b1e6613cf29030bf7 languageName: node linkType: hard @@ -4867,7 +4904,7 @@ __metadata: languageName: node linkType: hard -"get-intrinsic@npm:^1.2.4, get-intrinsic@npm:^1.2.5, get-intrinsic@npm:^1.2.6, get-intrinsic@npm:^1.2.7, get-intrinsic@npm:^1.3.0": +"get-intrinsic@npm:^1.2.4, get-intrinsic@npm:^1.2.7, get-intrinsic@npm:^1.3.0": version: 1.3.0 resolution: "get-intrinsic@npm:1.3.0" dependencies: @@ -4885,6 +4922,24 @@ __metadata: languageName: node linkType: hard +"get-intrinsic@npm:^1.2.5, get-intrinsic@npm:^1.2.6": + version: 1.2.7 + resolution: "get-intrinsic@npm:1.2.7" + dependencies: + call-bind-apply-helpers: "npm:^1.0.1" + es-define-property: "npm:^1.0.1" + es-errors: "npm:^1.3.0" + es-object-atoms: "npm:^1.0.0" + function-bind: "npm:^1.1.2" + get-proto: "npm:^1.0.0" + gopd: "npm:^1.2.0" + has-symbols: "npm:^1.1.0" + hasown: "npm:^2.0.2" + math-intrinsics: "npm:^1.1.0" + checksum: 10/4f7149c9a826723f94c6d49f70bcb3df1d3f9213994fab3668f12f09fa72074681460fb29ebb6f135556ec6372992d63802386098791a8f09cfa6f27090fa67b + languageName: node + linkType: hard + "get-proto@npm:^1.0.0, get-proto@npm:^1.0.1": version: 1.0.1 resolution: "get-proto@npm:1.0.1" @@ -5018,18 +5073,17 @@ __metadata: linkType: hard "glob@npm:^10.2.2": - version: 10.4.5 - resolution: "glob@npm:10.4.5" + version: 10.4.1 + resolution: "glob@npm:10.4.1" dependencies: foreground-child: "npm:^3.1.0" jackspeak: "npm:^3.1.2" minimatch: "npm:^9.0.4" minipass: "npm:^7.1.2" - package-json-from-dist: "npm:^1.0.0" path-scurry: "npm:^1.11.1" bin: glob: dist/esm/bin.mjs - checksum: 10/698dfe11828b7efd0514cd11e573eaed26b2dff611f0400907281ce3eab0c1e56143ef9b35adc7c77ecc71fba74717b510c7c223d34ca8a98ec81777b293d4ac + checksum: 10/d7bb49d2b413f77bdd59fea4ca86dcc12450deee221af0ca93e09534b81b9ef68fe341345751d8ff0c5b54bad422307e0e44266ff8ad7fbbd0c200e8ec258b16 languageName: node linkType: hard @@ -5650,7 +5704,7 @@ __metadata: languageName: node linkType: hard -"import-fresh@npm:^3.0.0, import-fresh@npm:^3.2.1, import-fresh@npm:^3.3.0": +"import-fresh@npm:^3.0.0": version: 3.3.1 resolution: "import-fresh@npm:3.3.1" dependencies: @@ -5660,6 +5714,16 @@ __metadata: languageName: node linkType: hard +"import-fresh@npm:^3.2.1, import-fresh@npm:^3.3.0": + version: 3.3.0 + resolution: "import-fresh@npm:3.3.0" + dependencies: + parent-module: "npm:^1.0.0" + resolve-from: "npm:^4.0.0" + checksum: 10/2cacfad06e652b1edc50be650f7ec3be08c5e5a6f6d12d035c440a42a8cc028e60a5b99ca08a77ab4d6b1346da7d971915828f33cdab730d3d42f08242d09baa + languageName: node + linkType: hard + "import-lazy@npm:^3.1.0": version: 3.1.0 resolution: "import-lazy@npm:3.1.0" @@ -6558,13 +6622,6 @@ __metadata: languageName: node linkType: hard -"lazysizes@npm:^5.3.2": - version: 5.3.2 - resolution: "lazysizes@npm:5.3.2" - checksum: 10/15dfa1cc8bf8c3a4393014d411f161cb1df96ab0888a0776ba4dc34d45c6ba9c5d2b2eca22683c14dfeee552c67173cb9a512d640d3424d9910c0246e15c4edc - languageName: node - linkType: hard - "levn@npm:^0.4.1": version: 0.4.1 resolution: "levn@npm:0.4.1" @@ -7233,6 +7290,13 @@ __metadata: languageName: node linkType: hard +"ms@npm:2.1.2": + version: 2.1.2 + resolution: "ms@npm:2.1.2" + checksum: 10/673cdb2c3133eb050c745908d8ce632ed2c02d85640e2edb3ace856a2266a813b30c613569bf3354fdf4ea7d1a1494add3bfa95e2713baa27d0c2c71fc44f58f + languageName: node + linkType: hard + "ms@npm:^2.1.3": version: 2.1.3 resolution: "ms@npm:2.1.3" @@ -7774,13 +7838,6 @@ __metadata: languageName: node linkType: hard -"package-json-from-dist@npm:^1.0.0": - version: 1.0.1 - resolution: "package-json-from-dist@npm:1.0.1" - checksum: 10/58ee9538f2f762988433da00e26acc788036914d57c71c246bf0be1b60cdbd77dd60b6a3e1a30465f0b248aeb80079e0b34cb6050b1dfa18c06953bb1cbc7602 - languageName: node - linkType: hard - "param-case@npm:^3.0.4": version: 3.0.4 resolution: "param-case@npm:3.0.4" @@ -11421,10 +11478,10 @@ __metadata: languageName: node linkType: hard -"undici-types@npm:~6.21.0": - version: 6.21.0 - resolution: "undici-types@npm:6.21.0" - checksum: 10/ec8f41aa4359d50f9b59fa61fe3efce3477cc681908c8f84354d8567bb3701fafdddf36ef6bff307024d3feb42c837cf6f670314ba37fc8145e219560e473d14 +"undici-types@npm:~5.26.4": + version: 5.26.5 + resolution: "undici-types@npm:5.26.5" + checksum: 10/0097779d94bc0fd26f0418b3a05472410408877279141ded2bd449167be1aed7ea5b76f756562cb3586a07f251b90799bab22d9019ceba49c037c76445f7cddd languageName: node linkType: hard