Changing Profile Image Size on About Page
gshick opened this issue · 8 comments
I tracked down the css for the profile picture on the About page in resources>_gen>assets>scss>scss>style.scss_f300667da4f5b5f84e1a9e0702b2fdde and wanted to just increase the image size, but I am running into two problems:
-
Each time I render the site locally (even with disableFastRender), it creates a copy of the scss folder with my website name and reverts to the standard 100px by 100px. So it creates two scss folders.
-
I tried manually deleting the extra folder and pushing to GitHub to see if it could at least fix it on the Netlify side. However, even updating the code below seems to do nothing.
.author-img {
height: 200px;
width: 200px;
border-radius: 50%;
object-fit: cover;
transform: translateY(50px); }
I'm getting the feeling that there is a problem with my folder structure but don't really know where to start on tracking down the issue. Here is my folder structure:
-.git
-content
-resources
-static
-themes
-persian
-archtypes
-assets
-images
-layouts
-static
-config.toml
Hello @gshick ,
Please check the doc https://docs.gethugothemes.com/guide/#file-structure
I ran a fresh rebuild and ensure I followed the instructions you shared...the issue seems to occur once you change the URL to your custom URL, I can then no set the .author-img parameters, it just creates a new file with each rebuild.
Hey @gshick
I am sorry to say that I didn't get you properly. what you are trying to say, is not clear to me.
How would you recommend changing the image size on the author page?
Hello @gshick
go to layouts/author/single.html and you will find this code height:150px;width:150px; change the value of hight and width.
Should this propagate to the "About" page as well? I made this change but it doesn't seem to impact the About page, even though it looks like they use the same param. I checked but there is no image sizing in layouts/about/single.html
Hello again,
If you want a big image on the about page, just replace the author-img class with img-fluid. it will do the job.
Also if you like this template, a star to the repository would be fantastic.