inherit
231603
0
Sept 14, 2022 13:26:41 GMT -8
User
37
May 2016
ghosthybros
|
Post by User on Dec 21, 2017 16:13:16 GMT -8
How I can center the stars on mini-profile using HTML? Note: My forum always use one star. Forum URL: kogamaforumbr.boards.net/ |
|
#eb7100
33409
0
1
May 9, 2024 18:53:40 GMT -8
Brian
48,129
November 2004
smashmaster3
|
Post by Brian on Dec 21, 2017 16:26:14 GMT -8
Hi, User . Lines 5-12 of Themes > Layout Templates > Mini-Profile produce your group/rank name and stars. You can surround this with an element and assign a class to it, then use CSS to center the text of that class. Add this to the bottom of Themes > Advanced Styles & CSS > Style Sheet to center the text of the element added in the above step. |
|
#eb7100
33409
0
1
May 9, 2024 18:53:40 GMT -8
Brian
48,129
November 2004
smashmaster3
|
Post by Brian on Dec 21, 2017 16:29:24 GMT -8
I'd also like to note that the forum's top ad appears to be completely obscured by your banner. Anything preventing the ads from displaying is a violation of our Terms of Service and will likely result in a warning from the abuse department. Please correct this as soon as possible. |
|
inherit
231603
0
Sept 14, 2022 13:26:41 GMT -8
User
37
May 2016
ghosthybros
|
Post by User on Dec 21, 2017 17:00:52 GMT -8
I'd also like to note that the forum's top ad appears to be completely obscured by your banner. Anything preventing the ads from displaying is a violation of our Terms of Service and will likely result in a warning from the abuse department. Please correct this as soon as possible. How I can correct this? Forum Wrapper: <!DOCTYPE HTML>
$[tag.html.open]
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>$[title] | $[forum.name]</title>
$[head]
<style type="text/css">
.buttons-dash{ -moz-transition:.5s; -webkit-transition:.5s; transition:.5s; display:none; z-index:999; position:absolute; right:65px; top:105px; float:right; margin:0; padding:0; border-left:1px; border-right:1px; border-bottom:1px; border-color:#212931; border-style:solid; border-top: 0px; width:211px; list-style:none;background:rgb(0,102,255); -webkit-box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.6);-moz-box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.6);box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.6);}
.buttons-dash:after{bottom: 100%;left: 50%;border: solid transparent;content: " ";height: 0;width: 0;position: absolute;pointer-events: none;border-color: rgba(0, 85, 255, 0);border-bottom-color: #212931;border-width: 8px;margin-left: -8px;-moz-transition:.5s; -webkit-transition:.5s; transition:.5s;}
.buttons-dash li{padding:0; margin:0 0 1px 0; height:40px; display:block; }
.buttons-dash li a{text-align:left;height:40px; padding:0px 25px; font:13px Open Sans, Trebuchet MS, Verdana, Helvetica, sans-serif; color:rgb(255,255,255); display:block; background:url('http://www.lumiatechnologies.com/verMenuImages.png') 0px 0px no-repeat; text-decoration:none;}
.buttons-dash li a:hover{background:url('https://www.lumiatechnologies.com/verMenuImages.png') 0px -40px no-repeat; color:rgb(255,255,255);}
.buttons-dash li a.active, .buttons-dash li a.active:hover{background-image:none; background-color:#212931; color:rgb(255,255,255);}
.buttons-dash li a span{line-height:40px;}
</style>
<script>
$(document).ready(function(){
$("#buttons-dash").click(function(){
$(".buttons-dash").fadeToggle(3);
return false;
});
});
</script>
</head>
<body>
{if $[maintenance_mode]}
<div class="maintenance-header">
{if $[can.disable_maintenance]}<p>Finished with maintenance? $[disable_maintenance_link].</p>{/if}
</div>
{/if}
<div id="wrapper">
<header>
<div id="banner-container" role="banner">
<div style="width: 90%; margin: 0 auto;">
<h2 id="banner">
$[forum.title]
</h2>
</div>
</div>
<a id="navigation-skip" href="#content" accesskey="s" class="aria-hidden" title="Skip Navigation">Skip Navigation</a>
<a href="#" accesskey="d" title="Open Menu" onclick="proboards.hotkeys.activate(Keys.d); return false;"></a>
<div style="background-color: #212931;">
<div id="navigation-menu" class="ui-helper-clearfix">
<ul role="navigation">
{foreach $[navigation.menu]}
<li>
<a{if $[navigation.menu.active]} class="state-active"{/if} href="$[navigation.menu.href]"{if $[navigation.menu.accesskey]} accesskey="$[navigation.menu.accesskey]"{/if}>
$[navigation.menu.name]
{if $[navigation.menu.notification.total]}
<div class="tip-holder" onclick="window.location='$[navigation.menu.notification.href]'; return false;">
<div class="tip-number">$[navigation.menu.notification.total]</div>
<span class="tip"></span>
</div>
{/if}
</a>
</li>
{/foreach}
</ul>
<div id="wrapper-id-welcome" align="right" style="background-color: #292d40;min-width: 208px;"><table class="idname" style="padding-top: 20px; padding-right: 5px;float: left;"><tbody><tr><td style="padding-right: 5px;"><a href="../user">$[current_user.avatar_quote]</a></td><td><p id="welcome">
{if !$[current_user.is_member]}
{if $[login_link] || $[register_link]}
Please $[login_link]{if $[login_link] && $[register_link]} or {/if}$[register_link]
{/if}
{else}
<span><a style="text-decoration: none;" href="#" id="buttons-dash"> Welcome $[current_user.name] </a></span>
</p></td></tbody></table>
</div>
</div>
</div>
</header>
<div style="margin-top: 110px;">
{if $[title] == "Home"}
<br>
{else}
{/if}
{/if}
</div>
{if !$[current_user.is_member]}
{else}
<ul class="buttons-dash" style="height:heightInPx;">
<li><a href="javascript:document.location='http://'+document.location.hostname+'/conversations'" id="link1" style="height:heightInPx;"><span>Messages</span></a></li>
<li><a href="javascript:document.location='http://'+document.location.hostname+'/bookmarks'" id="link2" style="height:heightInPx;"><span>Bookmarks</span></a></li>
<li><a href="javascript:document.location='http://'+document.location.hostname+'/search'" id="link3" style="height:heightInPx;"><span>Search boards</span></a></li>
<li><a href="https://login.proboards.com/logout/$[forum.id]" class="active" style="height:heightInPx;"><span>Logout</span></a></li>
</ul>
{/if}
$[header]
<div id="content" role="main">
{if $[notice]}
<div class="container">
<div class="title-bar"><h2>$[notice.title]</h2></div>
<div class="content pad-all cap-bottom">
$[notice.message]
</div>
</div>
{/if}
$[content]
$[shoutbox]
</div>
$[footer]
</div>
{if $[is_mobile_browser]}
<br /><p class="center">Switch to the $[mobile_switch_link].</p>
{/if}
<script type="text/javascript" src="https://www.lumiatechnologies.com/top.js"></script>
</body>
</html> |
|
inherit
226544
0
Oct 5, 2018 10:29:39 GMT -8
Ulises
4,881
November 2015
umacklin
Ulises Weirdo
|
Post by Ulises on Dec 21, 2017 17:12:05 GMT -8
User You have the following CSS that is setting the height: #wrapper-id-welcome {
display: inline-block;
z-index: 9995;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
float: right;
height: 33px;
overflow: hidden;
border-bottom: 2px solid #ffffff;
padding-top: 1px;
opacity: 0.9;
-moz-transition: .3s;
-webkit-transition: .3s;
transition: .3s;
}Specifically the height: 33px; part above is what is obscuring the ad. That CSS is located on line 1598 of the Style Sheet ( Themes > Advanced Styles & CSS > Style Sheet (tab)) of the New Friends theme.
|
|
inherit
231603
0
Sept 14, 2022 13:26:41 GMT -8
User
37
May 2016
ghosthybros
|
Post by User on Dec 21, 2017 17:18:03 GMT -8
User You have the following CSS that is setting the height: #wrapper-id-welcome {
display: inline-block;
z-index: 9995;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
float: right;
height: 33px;
overflow: hidden;
border-bottom: 2px solid #ffffff;
padding-top: 1px;
opacity: 0.9;
-moz-transition: .3s;
-webkit-transition: .3s;
transition: .3s;
}Specifically the height: 33px; part above is what is obscuring the ad. That CSS is located on line 1598 of the Style Sheet ( Themes > Advanced Styles & CSS > Style Sheet (tab)) of the New Friends theme. What change should I make? |
|
inherit
226544
0
Oct 5, 2018 10:29:39 GMT -8
Ulises
4,881
November 2015
umacklin
Ulises Weirdo
|
Post by Ulises on Dec 21, 2017 17:19:02 GMT -8
Remove the height: 33px part that I specified in my last post. And don't forget to hit save changes!
|
|
inherit
231603
0
Sept 14, 2022 13:26:41 GMT -8
User
37
May 2016
ghosthybros
|
Post by User on Dec 21, 2017 17:23:17 GMT -8
Remove the height: 33px part that I specified in my last post. And don't forget to hit save changes! It has not changed anything ... Or I'm doing it wrong. |
|
inherit
226544
0
Oct 5, 2018 10:29:39 GMT -8
Ulises
4,881
November 2015
umacklin
Ulises Weirdo
|
Post by Ulises on Dec 22, 2017 8:30:03 GMT -8
User Go to Admin Home > Themes > Layout Templates > Forum Wrapper and remove the highlighted part:  Make sure you are in the New Friends theme in the Current Theme dropdown.
|
|
inherit
231603
0
Sept 14, 2022 13:26:41 GMT -8
User
37
May 2016
ghosthybros
|
Post by User on Dec 22, 2017 14:44:46 GMT -8
User Go to Admin Home > Themes > Layout Templates > Forum Wrapper and remove the highlighted part: Make sure you are in the New Friends theme in the Current Theme dropdown. This error appears: Unable to save. Your template must use $[footer] and it cannot appear inside of an {if} or {foreach} block. |
|
inherit
226544
0
Oct 5, 2018 10:29:39 GMT -8
Ulises
4,881
November 2015
umacklin
Ulises Weirdo
|
Post by Ulises on Dec 22, 2017 14:55:23 GMT -8
Sorry, I told you to delete too much. In the last two lines I highlighted only the </div> line should have been deleted, meaning the other {/if} should have been in there. I suggest cleaning up the HTML you have as it's a little hard to read. It looks like you managed to delete it now since I am not seeing it in your New Friends theme. Now go to Themes > Advanced Styles & CSS > Style Sheet (tab) and remove the position:absolute part which I have highlighted here for you:  Note that this changes the layout of your theme, which you may need to design around so as you not block the ads again. |
|
inherit
231603
0
Sept 14, 2022 13:26:41 GMT -8
User
37
May 2016
ghosthybros
|
Post by User on Dec 22, 2017 15:12:14 GMT -8
Sorry, I told you to delete too much. In the last two lines I highlighted only the </div> line should have been deleted, meaning the other {/if} should have been in there. I suggest cleaning up the HTML you have as it's a little hard to read. It looks like you managed to delete it now since I am not seeing it in your New Friends theme. Now go to Themes > Advanced Styles & CSS > Style Sheet (tab) and remove the position:absolute part which I have highlighted here for you: Note that this changes the layout of your theme, which you may need to design around so as you not block the ads again. This theme has very confusing codes, I think I'll try to reframe it. Even so, thank you very much for the help. |
|
inherit
226544
0
Oct 5, 2018 10:29:39 GMT -8
Ulises
4,881
November 2015
umacklin
Ulises Weirdo
|
Post by Ulises on Dec 22, 2017 15:17:43 GMT -8
User No worries, if you have any question feel free to post in this board. What I would suggest is simply starting with a new theme from scratch and copying/rewriting the CSS in the Style Sheet and the HTML in the templates. As it is currently there is inline CSS in the HTML which is generally not recommended and makes it a little harder to read. A quick way to space out the HTML you currently have is to click in the template area and hit CTRL + A and then hit SHIFT + TAB so that everything is at least spaced in a way that you can read through it.
|
|
