Tagged: ,

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • November 3, 2017 at 4:36 pm #872218
    dennisnusser

    Hey there,

    I have run into an issue regarding the Layout Elements within Avia. I have been experimenting with Adobe Typekit Fonts in order to harmonize my website’s fonts with my party’s CI. I have implemented those fonts via Additional CSS (after embedding them through the Typekit Fonts for WordPress Plugin):

    h1, h2, h3, h4, h5{
font-family: din-2014-narrow, sans-serif !important; 
font-style: normal !important;
font-weight: 700 !important;
}

    However, the Layout Builder seems to use the original font (Lato) as reference to calculate the size of the layout element (Inner Padding 20px in all directions), which functions as text background here. Is there any way to either implement Typekit in a similar fashion to Google Fonts (Maybe now that it supports web fonts w/o JS? See https://blog.typekit.com/2017/08/30/css-font-loading/) or to make the layout element scale properly with the new font?

    November 4, 2017 at 11:57 am #872452
    Rikard

    Hey dennisnusser,

    I’m not sure if I understand your problem, is it that the font is not loading properly of do you want to change the default padding or margins for the headers? If the latter, then how exactly do you want to change it? Please try to be as specific as possible and use actual examples if possible.

    Best regards,
    Rikard

    November 5, 2017 at 8:13 pm #872798
    dennisnusser

    Sorry if I haven’t been clear: My issue is essentially that the Inner Padding value (which determines the distance from the column content to the border) is using the original font (Lato) instead of the new Font (Din2014-Narrow) as a reference point. This results in a large amount of (empty) space to the right, which is not supposed to be there. To visualize it: https://imgur.com/M7rppOB

    I want the distance between column content and border to be the same on the left and the right. This is how it is supposed to look (But I want it with DIN Narrow instead of Lato): https://imgur.com/yct1o8C

    November 6, 2017 at 12:30 pm #873004
    Rikard

    Hi,

    Thanks for the screenshots, so you basically want the text to be centered? If so then please try this in Quick CSS:

    .home h1.av-special-heading-tag {
  text-align:center;
}

    If you want to control the containing element with the background colour, then change the 3/5 element you are using to something smaller for instance.

    Best regards,
    Rikard

    • This reply was modified 7 years ago by Rikard.
  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.