Comments (4)
To solve your issue, open main.css and change cover;
to contain;
on lines 429-432 and 442-445 (8 instances total).
If you want grey-fill at the sides, insert the following line into .intro-header.big-img
and .intro-header.big-img .big-img-transition
:
background-color: lightgrey;
I'm not sure it's worth building a flag for this into the template, but let's let @halogenica decide.
from beautifulhugo.
I'm glad it's working out for you @gnalck! As for changing the bigimg behavior, @liwenyip kindly provided a solution for you. Generally I think you should feel free to make these nuanced customizations in your own local version. However, I would also gladly accept a pull request if you do decide to make the customizations user-friendly. For example, if the default bigimg behavior stayed the same, but a "bigimgstyle" field was added to the config.toml that could define the behavior like "fill", "fit", "center", "span", etc, that could be a nice customization for other people.
If you'd like to see it in the theme (so you don't have to maintain your own customizations), please make a pull request and I'll be happy to review it and add it.
from beautifulhugo.
Maybe what is worth adding is a param in config.toml
and/or front matter that lets you load a custom css file e.g. /static/css/custom.css
.
Then @gnalck could avoid having to maintain his own customisations by putting this in a custom css file:
.intro-header.big-img, .intro-header.big-img .big-img-transition {
-webkit-background-size: contain !important;
-moz-background-size: contain !important;
background-size: contain !important;
-o-background-size: contain !important;
background-color: lightgrey;
}
I'll add this to my to do list :-)
from beautifulhugo.
@gnalck you might be interested in the change @liwenyip just made! e214c15
from beautifulhugo.
Related Issues (20)
- KaTeX table rendered as literal string HOT 2
- Copyright Year in Footer Shows As "© 0001" HOT 2
- Support for multiple authors and author profiles
- Bigimg displays as empty div with Javascript disabled HOT 3
- Position attribute documented in exampleSite config.toml doesn't do anything
- Mastodon HOT 1
- Code blocks are unreadable in dark mode when using missing or unknown language tag HOT 2
- Nonstandard method used for deriving twitter card image
- How to write the inline math formulas
- Some problems of inline formulas
- I am getting an error when trying out the example site HOT 1
- CSS not rendering correctly HOT 1
- why the static resource doesnt not use the baseurl
- Hugo v0.120.1: depecation warnings HOT 1
- modify css, ideally change menu colors but other colors as well.
- Menu broken on Chrome HOT 2
- Social link for mastodon is slightly malformed. HOT 2
- side column examples
- The navbar drop downs aren't keyboard-accessible
- The navbar drop downs aren't great with screen readers
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from beautifulhugo.