Update dependencies and replace the aspect-ratio mixin with the aspect-ratio css tag

This commit is contained in:
Kevin MacMartin 2024-07-25 12:37:37 -04:00
parent 64f59928aa
commit 18cbaa338e
8 changed files with 1163 additions and 668 deletions

View file

@ -14,7 +14,7 @@ class Blog extends DashboardModel
public static $dashboard_type = 'edit'; public static $dashboard_type = 'edit';
public static $dashboard_display = [ 'title', 'created_at' ]; public static $dashboard_display = [ 'header-image', 'title', 'created_at' ];
public static $dashboard_columns = [ public static $dashboard_columns = [
[ 'name' => 'user_id', 'type' => 'user' ], [ 'name' => 'user_id', 'type' => 'user' ],

939
composer.lock generated

File diff suppressed because it is too large Load diff

848
package-lock.json generated

File diff suppressed because it is too large Load diff

View file

@ -8,9 +8,9 @@
"browser-sync": "3.0.2" "browser-sync": "3.0.2"
}, },
"dependencies": { "dependencies": {
"@babel/core": "7.24.7", "@babel/core": "7.24.9",
"@babel/preset-env": "7.24.7", "@babel/preset-env": "7.24.8",
"@fortawesome/fontawesome-free": "6.5.2", "@fortawesome/fontawesome-free": "6.6.0",
"autonumeric": "4.10.5", "autonumeric": "4.10.5",
"autoprefixer": "10.4.19", "autoprefixer": "10.4.19",
"axios": "1.7.2", "axios": "1.7.2",
@ -29,20 +29,21 @@
"gulp-sass-glob": "1.1.0", "gulp-sass-glob": "1.1.0",
"gulp-strip-debug": "4.0.0", "gulp-strip-debug": "4.0.0",
"gulp-uglify-es": "3.0.0", "gulp-uglify-es": "3.0.0",
"gulp5-sass-plugin": "^1.0.0", "gulp5-sass-plugin": "^2.0.0",
"jquery": "3.7.1", "jquery": "3.7.1",
"list.js": "2.3.1", "list.js": "2.3.1",
"minimist": "1.2.8", "minimist": "1.2.8",
"ordered-read-streams": "^2.0.0", "ordered-read-streams": "^2.0.0",
"postcss": "8.4.38", "postcss": "8.4.40",
"sass": "^1.77.8",
"sortablejs": "1.15.2", "sortablejs": "1.15.2",
"spinkit": "2.0.1", "spinkit": "2.0.1",
"terser-webpack-plugin": "5.3.10", "terser-webpack-plugin": "5.3.10",
"vue": "3.4.27", "vue": "3.4.34",
"vue-loader": "17.4.2", "vue-loader": "17.4.2",
"vue-router": "4.3.3", "vue-router": "4.4.0",
"vuex": "4.1.0", "vuex": "4.1.0",
"webpack": "5.91.0", "webpack": "5.93.0",
"what-input": "5.2.12" "what-input": "5.2.12"
} }
} }

View file

@ -855,8 +855,8 @@ body {
display: inline-block; display: inline-block;
.image-preview { .image-preview {
@include aspect-ratio(16, 9);
display: block; display: block;
aspect-ratio: 16/9;
background-position: center center; background-position: center center;
background-size: cover; background-size: cover;
background-repeat: no-repeat; background-repeat: no-repeat;
@ -1320,9 +1320,9 @@ form {
} }
.image-display { .image-display {
@include aspect-ratio(1, 1);
position: relative; position: relative;
width: 100%; width: 100%;
aspect-ratio: 1/1;
border: 1px solid darken($c-dashboard-light, 10%); border: 1px solid darken($c-dashboard-light, 10%);
border-radius: pxrem(3); border-radius: pxrem(3);
background-position: center center; background-position: center center;

View file

@ -1,8 +0,0 @@
@mixin aspect-ratio($width, $height) {
&:before {
content: "";
display: block;
width: 100%;
padding-top: (math.div($height, $width) * 100%);
}
}

View file

@ -24,8 +24,8 @@
background-repeat: no-repeat; background-repeat: no-repeat;
@include media-breakpoint-down(md) { @include media-breakpoint-down(md) {
@include aspect-ratio(3, 1);
width: 100%; width: 100%;
aspect-ratio: 3/1;
} }
@include media-breakpoint-up(md) { @include media-breakpoint-up(md) {

View file

@ -8,9 +8,9 @@
"browser-sync": "3.0.2" "browser-sync": "3.0.2"
}, },
"dependencies": { "dependencies": {
"@babel/core": "7.24.7", "@babel/core": "7.24.9",
"@babel/preset-env": "7.24.7", "@babel/preset-env": "7.24.8",
"@fortawesome/fontawesome-free": "6.5.2", "@fortawesome/fontawesome-free": "6.6.0",
"autonumeric": "4.10.5", "autonumeric": "4.10.5",
"autoprefixer": "10.4.19", "autoprefixer": "10.4.19",
"bootstrap": "5.3.3", "bootstrap": "5.3.3",
@ -27,12 +27,13 @@
"gulp-sass-glob": "1.1.0", "gulp-sass-glob": "1.1.0",
"gulp-strip-debug": "4.0.0", "gulp-strip-debug": "4.0.0",
"gulp-uglify-es": "3.0.0", "gulp-uglify-es": "3.0.0",
"gulp5-sass-plugin": "^1.0.0", "gulp5-sass-plugin": "^2.0.0",
"jquery": "3.7.1", "jquery": "3.7.1",
"list.js": "2.3.1", "list.js": "2.3.1",
"minimist": "1.2.8", "minimist": "1.2.8",
"ordered-read-streams": "^2.0.0", "ordered-read-streams": "^2.0.0",
"postcss": "8.4.38", "postcss": "8.4.40",
"sass": "^1.77.8",
"sortablejs": "1.15.2", "sortablejs": "1.15.2",
"spinkit": "2.0.1", "spinkit": "2.0.1",
"what-input": "5.2.12" "what-input": "5.2.12"