Typerite - RTL

Post Reply
User avatar
abdulhalim
Master Bludit
Posts: 85
Joined: Thu Mar 10, 2016 6:25 pm

Sat Sep 21, 2019 8:21 pm

Hello guys,

How can I change direction of masonry cards to float left to the right for RTL languages, The feeds depend on jquery plugin, So I couldn't change the direction, any help would be appreciated.

By default last post appears in the left page, but in RTL languages is vise versa.
User avatar
Edi
Site Admin
Posts: 1624
Joined: Sun Aug 09, 2015 5:01 pm
Location: Zurich
Contact:

Mon Sep 23, 2019 8:32 pm

1) Change the following in the file main.css in the directory /bl-themes/typerite-1.0/css (line 1717):

Code: Select all

  float: right;
instead of

Code: Select all

  float: left;
2) Disable the scripts modernizr.js and main.js in the directory /bl-themes/typerite-1.0/js.

The content is ordered RTL, but without the animation.
Planet Bludit, Tipps, Snippets und nützliche Links. - Newsletter, Informationen zu Bludit (auf Deutsch).
User avatar
abdulhalim
Master Bludit
Posts: 85
Joined: Thu Mar 10, 2016 6:25 pm

Thu Sep 26, 2019 5:03 pm

Thank you, Edi.

I did what you say, but there is a problem, the menu (sidebar and the responsive menu depends on JS). I did the CSS stuff before everything works except the feeds on the main menu, anyway if I disabled the JS' files, The feeds show correctly but the menu in both ways will be disabled too.

Regards,
Abdulhalim
User avatar
Edi
Site Admin
Posts: 1624
Joined: Sun Aug 09, 2015 5:01 pm
Location: Zurich
Contact:

Fri Sep 27, 2019 6:24 pm

abdulhalim wrote:
Thu Sep 26, 2019 5:03 pm
I did what you say, but there is a problem, the menu (sidebar and the responsive menu depends on JS).
Sorry! I didn't test it. :oops:

But the solution is much more easier...

Modify the section "masonry" in the file main.js in the directory /bl-themes/typerite-1.0/js by adding originLeft: false (line 151):

Code: Select all

        containerBricks.masonry({
            itemSelector: '.masonry__brick',
            columnWidth: '.grid-sizer',
            percentPosition: true,
            resize: true,
            originLeft: false
        });
instead of

Code: Select all

        containerBricks.masonry({
            itemSelector: '.masonry__brick',
            columnWidth: '.grid-sizer',
            percentPosition: true,
            resize: true
        });
For more information see

https://masonry.desandro.com
Planet Bludit, Tipps, Snippets und nützliche Links. - Newsletter, Informationen zu Bludit (auf Deutsch).
User avatar
abdulhalim
Master Bludit
Posts: 85
Joined: Thu Mar 10, 2016 6:25 pm

Fri Sep 27, 2019 6:45 pm

Thank you, Edi

I was looking after "masonry__brick" class in the plugin.js file! :cry:

Cheers,
Abdulhalim
Post Reply