inkblot icon indicating copy to clipboard operation
inkblot copied to clipboard

Centre Webcomic Navigation Footer

Open herrzeba1 opened this issue 7 years ago • 5 comments

I created custom png's with navigation buttons at www.danandclue.com. I used First/Previous/Next/Last Webcomic Link Widgets and I put them in Webcomic Navigation Footer. I'm having hard time trying to centre them.

I researched and found this https://github.com/mgsisk/webcomic/issues/276, but it doesn't work in my case. I think I'm missing the exact name of the thing that needs to be centred. I checked style.css and inspected the page itself in Chrome, but no luck.

  • How to centre navigation links in the navigation footer?
  • How to change their padding, as they are quite far away apart?

---cut here---- Reading your responses RE: inkblot on github and researching a bit, I see this being your passion project and I appreciate all the hard work you put into this. I'm planning to create a tutorial how to publish webcomic on Wordpress and I'll be sure to praise Inkblot & Webcomic. None of the ones I read have all the things I require (simplistic, yet specific customisation) nor is informative enough.

Also, there's not that many issues with your theme people have over the years, which makes me thing they rely on Tapastic and Webtoons more and more these days. Anyhow, thanks again :)

herrzeba1 avatar Feb 15 '18 21:02 herrzeba1

Thanks @herrzeba1! I think this is actually a minor bug in Inkblot; open up /inkblot/webcomic/display.php and change line 40:

<nav role="navigation" class="widgets columns-<?php print inkblot_count_widgets( 'webcomic-navigation-header', 5 ); ?> below" aria-label="<?php _e( 'Webcomic Navigation Footer', 'inkblot' ); ?>">

to

<nav role="navigation" class="widgets columns-<?php print inkblot_count_widgets( 'webcomic-navigation-footer', 5 ); ?> below" aria-label="<?php _e( 'Webcomic Navigation Footer', 'inkblot' ); ?>">

And I think that'll fix the issue.

mgsisk avatar Feb 16 '18 02:02 mgsisk

Thanks so much @mgsisk - that fixed it all right 💯

herrzeba1 avatar Feb 16 '18 14:02 herrzeba1

I'm sorry for being such a pain, but could you please help me change the padding/margin, so the navigation link images are closer together instead of being so much far apart? Maybe to set specific width for navigation footer, so when in responsive mobile view it aligns nicely under comic panel.

I played around with 'webcomic-navigation-footer' and looked for clues in style.css, but the best I could do is to increase bottom padding in custom CSS, damn.

herrzeba1 avatar Feb 16 '18 15:02 herrzeba1

No problem; try something like this:

nav.widgets.columns-4 aside {
  display: inline-block;
  float: none;
  width: 100px; /* Or however wide you want them. */
}

mgsisk avatar Feb 16 '18 15:02 mgsisk

Thanks a bunch, worked straight away 👍 Oh happy days!

herrzeba1 avatar Feb 16 '18 15:02 herrzeba1