×

Notice

The forum is in read only mode.
Welcome, Guest
Username: Password: Remember me
  • Page:
  • 1

TOPIC: Readon button truncated on the left

Readon button truncated on the left 14 years 7 months ago #9484

  • Andy Kaufman
  • Andy Kaufman's Avatar Topic Author
  • Offline
  • Fresh Boarder
  • Fresh Boarder
  • Posts: 3
  • Thank you received: 0
I'm very happy with the functionality of JoomlaComment! There's one interaction in particular that looks bad, with the button being truncated on the left. An example can be found at:
www.peopleandprojectspodcast.com/index.p...des/35-episodes.html

I'm guessing it may have to do with my RocketTheme template. Any suggestions? Thanks!

FYI. Here's the CSS for readon from the template:
.readon {display: inline-block;margin-left: 10px;height: 24px;}
.readon .button {outline: none !important;}
.readon span, .readon .button {display: block;margin-left: -10px;border: 0px none;font-size: 13px;cursor: pointer;height: 24px;line-height: 23px;float: left;font-weight: bold;overflow:visible; padding-left:12px; padding-right:12px; padding-top:0; padding-bottom:3px}
.readon span span {display: inline;background: none;margin-left: 0;padding: 0;float: none;}
body .readon:hover, #rt-popup .readon:hover {background-position: 100% -32px;}
body .readon:hover span, body .readon:hover .button, #rt-popup .readon:hover span, #rt-popup .readon:hover .button {background-position: 0 -32px;}

Readon button truncated on the left 14 years 7 months ago #9487

  • Daniel Dimitrov
  • Daniel Dimitrov's Avatar
  • Offline
  • Administrator
  • Administrator
  • Posts: 9618
  • Karma: 155
  • Thank you received: 1081
How does the normal readon look?
The image background is this www.peopleandprojectspodcast.com/templat...s/light/readon-r.png and it is also cut on the left.

Readon button truncated on the left 14 years 7 months ago #9495

  • Andy Kaufman
  • Andy Kaufman's Avatar Topic Author
  • Offline
  • Fresh Boarder
  • Fresh Boarder
  • Posts: 3
  • Thank you received: 0
Daniel, I'm so impressed by your timely support! Thank you for replying!

I added a Read More button on the first article on the front page:
www.peopleandprojectspodcast.com

It shows the button correctly. The left part of the button is in this file:
www.peopleandprojectspodcast.com/templat...s/light/readon-l.png

I noticed in the HTML source there's a class before the "Read more..." button named "rt-readon-surround". Hmmm....

Any suggestions? Thanks!

Readon button truncated on the left 14 years 7 months ago #9503

  • Daniel Dimitrov
  • Daniel Dimitrov's Avatar
  • Offline
  • Administrator
  • Administrator
  • Posts: 9618
  • Karma: 155
  • Thank you received: 1081
what you need to do is to edit the joomlacomment template
find the following block:
{readon}
	<div class='write_comment'>
		<a href="{READON_LINK}#JOSC_TOP" class="readon">{READON_WRITE_COMMENT} ({READON_COUNT} {READON_COMMENTS})</a>
	</div>
	{BLOCK-preview}
	<div class='comment_preview_container' style='clear:both'>
		{preview-lines}
	</div>
	{/BLOCK-preview}
{/readon}
 

and change it to this:
{readon}
	<p class='rt-readon-surround"'>
		<a href="{READON_LINK}#JOSC_TOP" class="readon"><span>{READON_WRITE_COMMENT} ({READON_COUNT} {READON_COMMENTS})</span></a>
	</p>
	{BLOCK-preview}
	<div class='comment_preview_container' style='clear:both'>
		{preview-lines}
	</div>
	{/BLOCK-preview}
{/readon}
 

Cheers,
Daniel

Readon button truncated on the left 14 years 7 months ago #9507

  • Andy Kaufman
  • Andy Kaufman's Avatar Topic Author
  • Offline
  • Fresh Boarder
  • Fresh Boarder
  • Posts: 3
  • Thank you received: 0
Brilliant! Worked perfectly. Thank you Daniel! Your support is amazing!
  • Page:
  • 1
Time to create page: 0.110 seconds