Hi everyone,
Has anyone been able to duplicate a big picture theme like this one Omeka Classic - Big Picture but that works in Omeka S?
We are trying to create a big hero image on our landing page, but all of the S themes have padding built into the content/body classes of their CSS. I’m able to change this, but doing so makes the subpages not render nicely. And since you can’t override that high level padding with inline markup, I’m a bit stuck.
.assets.hero-image {
width: calc(100% + 1.25%); // 100% width and the total padding values
margin-left: -.625%; // Negative margins to negate the padding values
margin-right: -.625%;
}
.assets.hero-image img {
width: 100%; // Ensure your hero image takes up the full width.
}
// Use a breakpoint to style when the browser exceeds the `#wrap` container's maximum width.
@media screen and (min-width: 1100px) {
.assets.hero-image {
margin-left: calc(-100vw / 2 + 1100px / 2); // The calculation for full width incorporating the parent container's maximum width.
margin-right: calc(-100vw / 2 + 1100px / 2);
width: auto;
}
}