applying css full width when big height

This commit is contained in:
Antoine M 2023-11-08 11:36:48 +01:00
parent ecb50de76f
commit 336b96e1c3
4 changed files with 8 additions and 4 deletions

File diff suppressed because one or more lines are too long

View File

@ -12,8 +12,10 @@
overflow: hidden; overflow: hidden;
border-radius: 22px; border-radius: 22px;
} }
.wp-block-homegrade-content-blocks-picture-banner.fixed-height img { .wp-block-homegrade-content-blocks-picture-banner img {
width: 100%; width: 100%;
}
.wp-block-homegrade-content-blocks-picture-banner.fixed-height img {
height: 200px; height: 200px;
-o-object-fit: cover; -o-object-fit: cover;
object-fit: cover; object-fit: cover;

View File

@ -1 +1 @@
{"version":3,"file":"./style-index.css","mappings":";;;AAAA;;;;;EAAA;AAOA;EACC;EACA;EACA;AAAD;AAEE;EACC;EACA;EACA;KAAA;EACA;KAAA;AAAH,C","sources":["webpack://multiblocks/./src/style.scss"],"sourcesContent":["/**\n * The following styles get applied both on the front of your site\n * and in the editor.\n *\n * Replace them with your own styles or remove the file completely.\n */\n\n.wp-block-homegrade-content-blocks-picture-banner {\n\tmargin-bottom: 20px;\n\toverflow: hidden;\n\tborder-radius: 22px;\n\t&.fixed-height {\n\t\timg {\n\t\t\twidth: 100%;\n\t\t\theight: 200px;\n\t\t\tobject-fit: cover;\n\t\t\tobject-position: center;\n\t\t}\n\t}\n}\n"],"names":[],"sourceRoot":""} {"version":3,"file":"./style-index.css","mappings":";;;AAAA;;;;;EAAA;AAOA;EACC;EACA;EACA;AAAD;AACC;EACC;AACF;AAEE;EACC;EACA;KAAA;EACA;KAAA;AAAH,C","sources":["webpack://multiblocks/./src/style.scss"],"sourcesContent":["/**\n * The following styles get applied both on the front of your site\n * and in the editor.\n *\n * Replace them with your own styles or remove the file completely.\n */\n\n.wp-block-homegrade-content-blocks-picture-banner {\n\tmargin-bottom: 20px;\n\toverflow: hidden;\n\tborder-radius: 22px;\n\timg {\n\t\twidth: 100%;\n\t}\n\t&.fixed-height {\n\t\timg {\n\t\t\theight: 200px;\n\t\t\tobject-fit: cover;\n\t\t\tobject-position: center;\n\t\t}\n\t}\n}\n"],"names":[],"sourceRoot":""}

View File

@ -9,9 +9,11 @@
margin-bottom: 20px; margin-bottom: 20px;
overflow: hidden; overflow: hidden;
border-radius: 22px; border-radius: 22px;
img {
width: 100%;
}
&.fixed-height { &.fixed-height {
img { img {
width: 100%;
height: 200px; height: 200px;
object-fit: cover; object-fit: cover;
object-position: center; object-position: center;