Align mod styling between several mods (themelike)

Questions
#1

image
image.png3735×2035 843 KB

Tyler: I tried to apply the same bootstrap-HTML-markup around the single image you will find inside of anymod-baabbr.

Next thing I felt I needed to do was to apply bootstrap to the mod, but still the Image would not align similarly to the below content inside of the neighboring mod called anymod-lllanb (below), see screenshot. Then I simply lost my nerves, because this should not be supposed to take so much time, as all I wanted to do is to align a simple image. I would be way better of if I worked without anymod and integrated to image manually. It must be possible to get this done with more ease. I guess I am missing something here.

Again, the two MODs are anymod-baabbr and anymod-lllanb

I would really like to learn more about how I may “REDUCE THE AMOUNT OF WORK” I constantly am faced with when it comes to aligning several mods to one another themewise!

Any support from you will be highly appreciated !!

I hope it will not be nessesary to manually copy the rules from anymod-lllanb over to my anymod-baabbr manually, merely to aling the styling. (I meant the Rules which where appiled to the bootstrap classes inside of the html markup in anymod-lllanb )

see further documetation inside of: https://anymod.com/mod/baabbr

Of cause writing such a ticket takes way more time than solving the issue, but this is a core issue of repeating kind. So I am glad to get advice

best regards
Stefan

https://anymod.com/projects/8P24PE/dashboard

#2

Hi Stefan,
I don’t know what steps you went through, but the mod baabbr had bootstrap classes without the bootstrap stylesheet, so that may be why you were having issues. I added the bootstrap stylesheet to it.

Bootstrap also works on a 12-column grid layout, so if you want a “full-width” image, you can do col-12. See here for more info: https://getbootstrap.com/docs/4.3/layout/grid/

Anyway, I think they are lined up now!

#3

Hi Tyler,

regretfully, I cannot see them beeing aligned now. Thus I cannot comfirm your above message.

The MOD called BAABBR has One visible image on this page . That Mod has two Images, only one is visible.

My first attempt was to injcect that dynamically created image (via JS) into the new HTMLmarkup dynamically, so that I manage to align that image correctly with the rest of my other anymod Images on the same page. But as I failed to append that dynamic image at the new place inside of the HTML markup, , due to my lack of JS knowledge, I decided to go other ways.

My next attempt was to create the nessesary HTML markup and inject a second Image into that markup statically. Then the handlebars issue came up, but now the static Image is fine. But I did set that markup to display none (.row) for now, as it is "still under construction. !!! If you set that Image to display Block, you will see it is NOT aligned with the resst of my anymod MODS on my page.

https://skysails.info/marine_performance/cts-product.html

My main goal is to find an EASY way to align ANYMOD Elements across several mods ! ! !

This mod just serves as an example. I would love any help you might be able to provide to let me know how to align mods with more ease than currently possible with anymod.

Can you confirm the sstatically injected Image is NOT aligned to all other anymod MOD-content? (currently that .row is set to display none for construction purposes)

And can you let me know how to easily align Mods acorss my page?

#4

did you change anything after I posted the above description? All of a sudden, the element in fact IS successfully aligned to the rest of the page . I wonder If I had loaded any cached version for some 5 times directly before I started to write my above ticket? Weired.

Hmmm, Why was it not aligned before? Probably due to col-6 instead of col-12 . So there was a stupid error of mine involved. OKay.

Most importantly: What is there to be done to more easily align elements across my pages whenever I inject new Mods into my existing page?

#5

Yes I did, I added the Bootstrap stylesheet and changed it from col-6 to col-12 as you noted.

I don’t think all mods will ever match each other, but we do want to have sets of mods that have the same properties & themes. So for example, all of our Bootstrap mods should match. Theming is something we’ve been working on, so I think this will get better as we release more matching themes for you to use.

#6

My reply via email-client does not happen to be reflected here:

Let me copy/paste my last email-reply into this board :

Thank you Tyler,

I think…

I should excuse for the existance of this ticket alltogether.

I guess I could have done better on my own.

And I was in a bad mood.

Sorry for that.

And thank you for your ongoing support.

Ps: I will try to reply to the other open tickets later, hopefully today.

Best regards
Stefan