XF2 [8WR] XenPorta 2 (Portal) PRO

XF2 [8WR] XenPorta 2 (Portal) PRO [Paid] 2.2.0.7

No permission to buy ($40.00)

Goddi

Member
1610361718740.png

Is there a way to create the spacing smaller? And where is the option to design the article footer smaller?
Also ... is there a way to delete the green "continue" (Weiter...)?
 

Itstest

New member
You want your articles to look like this?

ZojPHqt.png
Yes, maybe with 2 articles side by side or make the image bigger like a cube. How can I make this ?
Thank you for the answer
 

Jaxel

Well-known member
Jaxel updated XF2 [8WR] XenPorta 2 (Portal) PRO with a new update entry:

2.2.0.7 - CHANGELOG

  • More major updates to the front portal. Make sure to check your style properties as a lot of settings have changed.
  • There are now easy options to hide the majority of article elements in case you wish to make an image based grid. Disabling expanded article elements will place some article attribution data into the image header. If you do want to use an image grid, you should make your Masonry baseline height and Article image header height equal. You should also increase the...

Read the rest of this update entry...
 

Jaxel

Well-known member
And can you explain, how can i customize like this ?
This is how i described it
Thank you

Install the newest version. If you want your portal to have image bricks, that's up to your settings. This is the customized settings I have on 8WR:

-8WR-XenPorta-2-Portal-PRO-8WAYRUN-COM-Admin-control-panel.png

If you want the occasional brick to be double size, you could use this:
(in your EXTRA.less, NEVER edit the CSS files directly)

Code:
@media (min-width: ~"calc(@xf-EWRporta_masonry_width * 2)")
{
    .porta-masonry .porta-article-item:nth-child(3n+1),
    {
        // makes the brick span two columns

            grid-column: span 2;

        // makes the brick span two rows, (only works with FIXED masonry baseline height)

            grid-row: span 2;
            height: ~"calc(@xf-EWRporta_masonry_height * 2 + @xf-elementSpacer)";

            .porta-article-header .porta-header-image,
            .porta-article-header .porta-header-medio
            {
                height: ~"calc(@xf-EWRporta_masonry_height * 2 + @xf-elementSpacer)";
            }
    }
}
The code above would make every 4th child be double size. You could change the 3n+1 to affect the frequency. On 8WR, I only make the brick span two columns, I do not use the two rows section. You can delete either section at will.
 
Last edited:

Itstest

New member
Install the newest version. If you want your portal to have image bricks, that's up to your settings. This is the customized settings I have on 8WR:

View attachment 244010

If you want the occasional brick to be double size, you could use this:
(in your EXTRA.less, NEVER edit the CSS files directly)

Code:
@media (min-width: ~"calc(@xf-EWRporta_masonry_width * 2)")
{
    .porta-masonry .porta-article-item:nth-child(3n+1),
    {
        // makes the brick span two columns

            grid-column: span 2;

        // makes the brick span two rows, (only works with FIXED masonry baseline height)

            grid-row: span 2;
            height: ~"calc(@xf-EWRporta_masonry_height * 2 + @xf-elementSpacer)";

            .porta-article-header .porta-header-image,
            .porta-article-header .porta-header-medio
            {
                height: ~"calc(@xf-EWRporta_masonry_height * 2 + @xf-elementSpacer)";
            }
    }
}
The code above would make every 4th child be double size. You could change the 3n+1 to affect the frequency. On 8WR, I only make the brick span two columns, I do not use the two rows section. You can delete either section at will.
Thanks, but why does it look like this, when the settings are like yours

edit: I use the theme "UI.X Pro"
 

Attachments

  • screenshot-webiste.png
    screenshot-webiste.png
    316.1 KB · Views: 10
Last edited:

Mendalla

Well-known member
One oddity noted on 2.2.0.7. On phone screens, I am getting a rather wide left margin on the portal page. Once you get up to a good screen size or zoom out, e.g. on my tablet, it is fine and desktop with a decent zoom is a two column format so rather different anyhow.

Below is with the page zoomed in tight on desktop to force it to assume the "phone look" but it accurately captures what I am talking about. Thoughts from anyone on tweaks that could help. Not a big problem, just looks odd to my eyes. Like the page is offset to the right. You can see the actual site using the link in my sig.

Other than that, though, I am fine with the new release. Haven't played much with the new style properties yet, though. Maybe on the weekend.

1610717529557.png

This is Chrome on Windows but Chrome on Android gives the same result (and is where I first noticed it).
 
Top