Page 1 of 1
Gantry 5 Helium Template Question
Posted: Tue Oct 10, 2023 12:02 am
by guy_in_ohio
How to you make the white space smaller (where I have the red arrows)?
Both the space between the menu and the article title and the article title and the start of the article text.
I have a custom.scss file but I'm not sure what to add.
Thanks!
Re: Gantry 5 Helium Template Question
Posted: Tue Oct 10, 2023 9:38 am
by AMurray
I would guess margin-top (and maybe margin-bottom) (above/below "Past Projects" respectively) but that could also be "margin-top" (above "Nothing at this time" The best you can do is identify with the browser's developer tool (F12 typically e.g. in Firefox or Google Chrome) to find out what CSS is causing the large space.
It's more difficult to guess if we don't have a link to the page to view the source code in order to give you a more accurate answer.
SO "Past Projects" seems to be like heading1 (<h1> so you'd apply the margin-top and margin-bottom to that, or create your own CSS class name like :
Code: Select all
.past_project_heading {
margin-top: 15px;
margin-bottom:5px;
}
Something like that would go in your custom.css and then you would apply the class name to the <h1> tag (or whatever it is) as an example:
Code: Select all
<h1 class="past_project_heading">Past projects</h1>
That's my rudimentary guesswork.
Perhaps the folk at Gantry can provide better guidance given it's their template/product.
Re: Gantry 5 Helium Template Question
Posted: Fri Oct 20, 2023 2:05 pm
by guy_in_ohio
Thanks for your help. I'm getting close.
https://neilrisko.com/HCE/index.php/pro ... t-projects
Any suggestions would be greatly appreciated.
Re: Gantry 5 Helium Template Question
Posted: Sun Oct 29, 2023 7:23 pm
by pablop76
Currently, the only option to set the height is
in the file _typography.scss
Code: Select all
// Body Base
body {
font-size: $core-font-size;
line-height: $core-line-height;
}
change the value in yours custom.scss
Re: Gantry 5 Helium Template Question
Posted: Sun Oct 29, 2023 8:00 pm
by Webdongle
Change
margin 01.JPG
set in custom scss
margin 02.JPG
Or -11px or -12px or -13px or -14px etc
fyi
https://docs.gantry.org/gantry5/tutoria ... tyle-sheet
If Production Mode is set to No, then Gantry will recompile the CSS/SCSS automatically when changes are made.
Re: Gantry 5 Helium Template Question
Posted: Mon Nov 06, 2023 8:22 pm
by guy_in_ohio
Thank you!
Re: Gantry 5 Helium Template Question
Posted: Wed Nov 08, 2023 3:43 pm
by guy_in_ohio
Is there a way to make the text <p> (Lorem ipsum dolor sit amet, consectetur...) line up to the top of the image on the left? Thank you so much for your help.
https://neilrisko.com/HCE/
Re: Gantry 5 Helium Template Question
Posted: Wed Nov 08, 2023 3:49 pm
by Webdongle
Yes but not sure how you would do it.
Re: Gantry 5 Helium Template Question
Posted: Wed Nov 08, 2023 4:54 pm
by nacc
guy_in_ohio wrote: ↑Wed Nov 08, 2023 3:43 pm
Is there a way to make the text <p> (Lorem ipsum dolor sit amet, consectetur...) line up to the top of the image on the left?
Yes. Currently, the HTML for <p> that contains the image looks like this
Code: Select all
<p><img src="/HCE/images/OLDimages/chris_fauber_2019.jpg" alt="Chris Fauber" style="margin: 20px 10px 0px 0px; float: left;" width="200" height="300"><br style="clear: right;"></p>
Replace the HTML with
Code: Select all
<p><img src="/HCE/images/OLDimages/chris_fauber_2019.jpg" alt="Chris Fauber" style="margin: 0.25em 0.9em 0 auto; float: left; width: 200px;"></p>
Re: Gantry 5 Helium Template Question
Posted: Wed Nov 08, 2023 7:26 pm
by nacc
Another idea is to replace the <p> with
Code: Select all
<p style="float: inline-start; margin: 0.75em 1em 0.5em auto; max-width: 200px;"><img src="/HCE/images/OLDimages/chris_fauber_2019.jpg" alt="Chris Fauber"></p>
Re: Gantry 5 Helium Template Question
Posted: Thu Nov 09, 2023 1:09 pm
by guy_in_ohio
Thank you very much!
Re: Gantry 5 Helium Template Question
Posted: Fri Nov 24, 2023 1:15 pm
by guy_in_ohio
When I bring up the home page I'm sometimes forced to refresh the page because the heading (Highland County Engineer, Chris Fauber) is cut off.
Any ideas how to fix this?
Re: Gantry 5 Helium Template Question
Posted: Fri Nov 24, 2023 1:46 pm
by pablop76
You can add
UIKit and use the
UIKit framework component code directly in the particles or write your
own particle
Re: Gantry 5 Helium Template Question
Posted: Sat Feb 03, 2024 5:38 pm
by guy_in_ohio
Thanks everyone for all your help!
I can't figure out where to ask this (or find the answer after several hours of searching):
Can you copy or duplicate a particle, that is not yet in the particles directory (like one that came with the Helium or Hydrogen theme)?
I have read the instructions at
https://docs.gantry.org/gantry5/tutoria ... -particles but I can't find anywhere how to copy a particle from one theme to another if it's not in the particles directory.
Re: Gantry 5 Helium Template Question
Posted: Sat Feb 03, 2024 9:51 pm
by pablop76
which particle from which template?
Re: Gantry 5 Helium Template Question
Posted: Sun Feb 04, 2024 10:48 pm
by guy_in_ohio
I think I understand it now. Thanks anyway.