Support for SMF Tricks Themes & Mods

0 Members and 1 Guest are viewing this topic.

*
fortitude
Sniffer
Reseller theme questions | menu | &
May 02, 2015, 03:20:31 PM
Hello

I have couple of questions regarding Reseller theme.

1. Menu - How do I make it drop down on hover?
    Also, how to make it fixed?

2. When I'm inside of thread I can see on top right number of replies and views.
    I'd like it to say  for example   

   7 replies & 20 views

  so, yeah, I'd like to add & which would be the same height as that text, but different color.

3. How to stilize BIG TITLE OF THREAD that shows when I'm inside of thread? I'd like it to be inside of uncolored box.

4. How to stilize    « previous next » (put it in button boxes) and also make it look like this « previous | next »

5. I've decided to put logo with white background in header, and make background white.
    But then I can't see text  Profile | Forum Profile | Recent Unread Topics | Updated topics  <- how to change color of that text?

Lots of questions, I know. I hope for help. :)
« Last Edit: May 03, 2015, 08:04:33 AM by fortitude »






*
Diego Andrés
#1
Webmaster
Re: Reseller theme questions | menu | &
May 04, 2015, 11:38:21 PM
A few questions might have been answered already in here http://www.simplemachines.org/community/index.php?topic=525855.0
*
fortitude
#2
Sniffer
Re: Reseller theme questions | menu | &
May 06, 2015, 04:37:01 PM
this theme used to have such good support, and now nothing  ???
I've been waiting for days for answer but I've only found out how to make it fixed, and that was not exactly as I wanted  ???
*
Daniel
#3
Webmaster
Re: Reseller theme questions | menu | &
May 07, 2015, 12:05:12 PM
this theme used to have such good support, and now nothing  ???
I've been waiting for days for answer but I've only found out how to make it fixed, and that was not exactly as I wanted  ???
Sorry, but I've been busy lately, with classes and with some outstanding things I could not answer. I'll try to let the solutions on the weekend.
*
Daniel
#4
Webmaster
Re: Reseller theme questions | menu | &
May 12, 2015, 08:44:23 PM
1 question
Index.template.php (Themes/Reseller)
Search:
Code: [Select]
<script type="text/javascript">
$(document).ready(function(){
$("input[type=button]").attr("class", "btn btn-default btn-sm");
$(".button_submit").attr("class", "btn btn-primary btn-sm");
$("#advanced_search input[type=\'text\'], #search_term_input input[type=\'text\']").removeAttr("size");
$(".table_grid").attr("class", "table table-striped");
$("img[alt=\'', $txt['new'], '\'], img.new_posts").replaceWith("<span class=\'label label-warning\'>', $txt['new'], '</span>");
$("#profile_success").removeAttr("id").removeClass("windowbg").addClass("alert alert-success");
$("#profile_error").removeAttr("id").removeClass("windowbg").addClass("alert alert-danger");
});
</script>
Replace with:
Code: [Select]
<script type="text/javascript">
$(document).ready(function(){
$(".dropdown").hover(           
function() {
$(".dropdown-menu", this).stop( true, true ).fadeIn("fast");
$(this).toggleClass("open");   
},
function() {
$(".dropdown-menu", this).stop( true, true ).fadeOut("fast");
$(this).toggleClass("open");             
});
$("input[type=button]").attr("class", "btn btn-default btn-sm");
$(".button_submit").attr("class", "btn btn-primary btn-sm");
$("#advanced_search input[type=\'text\'], #search_term_input input[type=\'text\']").removeAttr("size");
$(".table_grid").attr("class", "table table-striped");
$("img[alt=\'', $txt['new'], '\'], img.new_posts").replaceWith("<span class=\'label label-warning\'>', $txt['new'], '</span>");
$("#profile_success").removeAttr("id").removeClass("windowbg").addClass("alert alert-success");
$("#profile_error").removeAttr("id").removeClass("windowbg").addClass("alert alert-danger");
});
</script>
Search:
Code: [Select]
<nav class="navbar navbar-default navbar-static-top" role="navigation">Replace with:
Code: [Select]
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">Search:
Code: [Select]
<a ', $button['sub_buttons'] ? 'class="dropdown-toggle" ' : '', 'href="', $button['sub_buttons'] ? '#' : $button['href'], '"', isset($button['target']) ? ' target="' . $button['target'] . '"' : '', '', $button['sub_buttons'] ? ' data-toggle="dropdown"' : '', '>
Replace with:
Code: [Select]
<a ', $button['sub_buttons'] ? 'class="dropdown-toggle" ' : '', 'href="', $button['sub_buttons'] ? '#' : $button['href'], '"', isset($button['target']) ? ' target="' . $button['target'] . '"' : '', '>

Reseller.css (Themes/css)
Search:
Code: [Select]
header
{
background: #3498db;
box-shadow: 0 -3px #9fc6e0 inset;
padding: 20px 0;
}
Replace with:
Code: [Select]
header
{
background: #3498db;
box-shadow: 0 -3px #9fc6e0 inset;
padding: 20px 0;
margin-top: 50px;
}

2 question

Reseller.css (Themes/Reseller/css)
Search:
Code: [Select]
.display-info ul.info li
{
float: left;
font-size: 1.5em;
margin-left: 5px;
}
.display-info ul.info li.replies
{
color: #5bc0de;
}
.display-info ul.info li.replies img, .display-info ul.info li.views img
{
width: 64px;
}
.display-info ul.info li.views
{
color: #f0ad4e;
}
Replace with:
Code: [Select]
.display-info ul.info li
{
float: left;
font-size: 1.5em;
margin-left: 5px;
color: #000;
}
.display-info ul.info li.replies img, .display-info ul.info li.views img
{
width: 64px;
}
If you want change the size of the text. Change font-size: 1.5em; for what you want, the same with the color: color: #000;. For the img, you can change the width: width: 64px;, if you want hide the img, use this: display: none; after width: 64px;

3 question
Reseller.css (Themes/Reseller/css)
Search:
Code: [Select]
.display-info
{
text-align: center;
overflow: hidden;
}
Replace with:
Code: [Select]
.display-info
{
text-align: center;
overflow: hidden;
background: #E1E1E1;
border-radius: 5px;
border: 1px solid #CCC;
padding: 15px;
}

4 question
Reseller.css (Themes/Reseller/css)
Add to the end:
Code: [Select]
.nextlinks{
margin-bottom: 15px;
}
.nextlinks a
{
background: #FFF;
border: 1px solid #e1e1e1;
padding: 8px 15px;
font-weight: bold;
border-radius: 5px;
transition: all .1s;
}
.nextlinks a:hover
{
background: #e1e1e1;
text-decoration: none;
}
.nextlinks a:first-of-type
{
float: left;
}

5 question
Reseller.css (Themes/Reseller/css)
Search:
Code: [Select]
header ul.reset li, header ul.reset li a
{
color: #FFF;
font-family: "Segoe UI";
font-size: 12px;
}
Replace with:
Code: [Select]
header ul.reset li, header ul.reset li a
{
color: #000;
font-family: "Segoe UI";
font-size: 12px;
}
« Last Edit: May 12, 2015, 09:07:24 PM by Daniel »
*
fortitude
#5
Sniffer
Re: Reseller theme questions | menu | &
May 13, 2015, 02:21:33 PM
hey!

First of all, thank you a lot! Tho, I have some things that you misunderstood.
Like: 2) I actually don't know how to add symbol &  in php, between replies and views, so that was what I was asking.

3) Looks acceptable, but I didn't actually want box to include replies and views, just the title itself.

4)Previous and Next are stylized, and I'm actually quite satisfied how it looks, in spite of the fact
that those on top were not the one I wanted to be stylized, but those on bottom were.
Could you tell me how to stylize those on bottom as well?
 :)


p.s. extra question: can I snatch these icons? that is , are they free to use:
« Last Edit: May 13, 2015, 02:23:06 PM by fortitude »
*
Daniel
#6
Webmaster
Re: Reseller theme questions | menu | &
May 16, 2015, 01:00:28 PM
2 question
Display.template.php
Search:
Code: [Select]
<li class="replies"><img src="',$settings['images_url'] ,'/messages.png" /> '. $context['real_num_replies'] .' '. $txt['replies'] .'</li>
<li class="views"><img src="',$settings['images_url'] ,'/views.png" /> ', $context['num_views'], ' '. $txt['views'] .'</li>
Replace (with img):
Code: [Select]
<li class="replies"><img src="',$settings['images_url'] ,'/messages.png" /> '. $context['real_num_replies'] .' '. $txt['replies'] .'&nbsp;&#38;</li>
<li class="views"><img src="',$settings['images_url'] ,'/views.png" /> ', $context['num_views'], ' '. $txt['views'] .'</li>
Replace (without img):
Code: [Select]
<li class="replies">'. $context['real_num_replies'] .' '. $txt['replies'] .'&nbsp;&#38;</li>
<li class="views">', $context['num_views'], ' '. $txt['views'] .'</li>

3 question
Reseller.css
Search:
Code: [Select]
.display-info
{
text-align: center;
overflow: hidden;
}
.display-info h1
{
font-size: 36px;
}
Replace with:
Code: [Select]
.display-info
{
text-align: center;
overflow: hidden;
}
.display-info h1
{
font-size: 36px;
background: #E1E1E1;
border-radius: 5px;
border: 1px solid #CCC;
padding: 15px;
}

4 question
Reseller.css
Use this code, add to the end:
Code: [Select]
.nextlinks, .nextlinks_bottom{
margin-bottom: 15px;
}
.nextlinks_bottom{
clear: both !important;
}
.nextlinks a, .nextlinks_bottom a
{
background: #FFF;
border: 1px solid #e1e1e1;
padding: 8px 15px;
font-weight: bold;
border-radius: 5px;
transition: all .1s;
}
.nextlinks a:hover, .nextlinks_bottom a:hover
{
background: #e1e1e1;
text-decoration: none;
}
.nextlinks a:first-of-type, .nextlinks_bottom a:first-of-type
{
float: left;
}

PD: Yes, you can.

Greetings!
*
fortitude
#7
Sniffer
Re: Reseller theme questions | menu | &
May 16, 2015, 03:11:56 PM
hah, you just can't get rid of me. Thank you so very much, and yet I have some questions still;

a) in my 3rd question this box now includes only title, and that is good. what is bad is that I was hoping for an actual nice box
that would surround only title, however is spreads through whole main content section width. is there any way to make that width smaller???

b) would you please help me with incorporating this jsfiddle in breadcrumbs of forum theme?
« Last Edit: May 16, 2015, 03:21:58 PM by fortitude »
*
fortitude
#8
Sniffer
Re: Reseller theme questions | menu | &
May 26, 2015, 04:28:20 AM
hello?

any news about this?  :P
*
Daniel
#9
Webmaster
Re: Reseller theme questions | menu | &
May 26, 2015, 06:04:10 PM
a) You mean something like this: http://prntscr.com/79skjl ?

b) Index.css
Search:
Code: [Select]
/* The navigation list (i.e. linktree) */
.navigate_section
{
padding: 0;
margin: 0 0 20px;
background: #FFF;
}
Replace with:
Code: [Select]
/* The navigation list (i.e. linktree) */
.navigate_section
{
padding: 0;
margin: 20px 0;

}
#crumbs {
padding: 7px 0px;
}

#crumbs ul {
list-style: none;
/*display: inline-table;*/
display: table-row;
}
#crumbs ul li {
display: inline;
}

#crumbs ul li a {
display: block;
float: left;
height: 12.5px;
background: #34495e;
text-align: center;
padding: 7.5px 10px 23px 20px;
position: relative;
margin: 0 1px 0 0;
font-size: 12px;
text-decoration: none;
color: #ecf0f1;
}

#crumbs ul li a:after {
content: ""; 
border-top: 15px solid transparent;
border-bottom: 15px solid transparent;
border-left: 10px solid #34495e;
position: absolute; right: -10px; top: 0;
z-index: 1;
}

#crumbs ul li a:before {
content: ""; 
border-top: 15px solid transparent;
border-bottom: 15px solid transparent;
border-left: 10px solid #d4f2ff;
position: absolute; left: 0; top: 0;
}

#crumbs ul li:first-child a {
border-top-left-radius: 7px;
border-bottom-left-radius: 7px;
}
#crumbs ul li:first-child a:before {
display: none;
}

#crumbs ul li:last-child a {
padding-right: 20px;
border-top-right-radius: 7px;
border-bottom-right-radius: 7px;
background-color: #8e44ad;
}
#crumbs ul li:last-child a:after {
display: none;
}

#crumbs ul li a:hover {
background: #3498db;
}
#crumbs ul li a:hover:after {
border-left-color: #3498db;
}
Index.template.php
Search:
Code: [Select]
// Show a linktree. This is that thing that shows "My Community | General Category | General Discussion"..
function theme_linktree($force_show = false)
{
global $context, $settings, $options, $shown_linktree;

// If linktree is empty, just return - also allow an override.
if (empty($context['linktree']) || (!empty($context['dont_default_linktree']) && !$force_show))
return;

echo '
<div class="navigate_section">
<div class="container">
<div class="row">
<ol class="breadcrumb">';

// Each tree item has a URL and name. Some may have extra_before and extra_after.
foreach ($context['linktree'] as $link_num => $tree)
{
echo '
<li', ($link_num == count($context['linktree']) - 1) ? ' class="active"' : '', '>';

// Show something before the link?
if (isset($tree['extra_before']))
echo $tree['extra_before'];

// Show the link, including a URL if it should have one.
echo $settings['linktree_link'] && isset($tree['url']) ? '
<a href="' . $tree['url'] . '"><span>' . $tree['name'] . '</span></a>' : '<span>' . $tree['name'] . '</span>';

// Show something after the link...?
if (isset($tree['extra_after']))
echo $tree['extra_after'];

echo '
</li>';
}
echo '
</ol>
</div>
</div>
</div>';

$shown_linktree = true;
}
Replace with:
Code: [Select]
// Show a linktree. This is that thing that shows "My Community | General Category | General Discussion"..
function theme_linktree($force_show = false)
{
global $context, $settings, $options, $shown_linktree;

// If linktree is empty, just return - also allow an override.
if (empty($context['linktree']) || (!empty($context['dont_default_linktree']) && !$force_show))
return;

echo '
<div class="container">
<div class="row">
<div class="navigate_section" id="crumbs">
<ul>';

// Each tree item has a URL and name. Some may have extra_before and extra_after.
foreach ($context['linktree'] as $link_num => $tree)
{
echo '
<li', ($link_num == count($context['linktree']) - 1) ? ' class="active"' : '', '>';

// Show something before the link?
if (isset($tree['extra_before']))
echo $tree['extra_before'];

// Show the link, including a URL if it should have one.
echo $settings['linktree_link'] && isset($tree['url']) ? '
<a href="' . $tree['url'] . '"><span>' . $tree['name'] . '</span></a>' : '<span>' . $tree['name'] . '</span>';

// Show something after the link...?
if (isset($tree['extra_after']))
echo $tree['extra_after'];

echo '
</li>';
}
echo '
</ul>
</div>
</div>
</div>';

$shown_linktree = true;
}
« Last Edit: May 26, 2015, 06:09:50 PM by Daniel »
*
fortitude
#10
Sniffer
Re: Reseller theme questions | menu | &
May 27, 2015, 02:44:13 AM
a) You mean something like this: http://prntscr.com/79skjl ?


yes, I indeed mean something like that.  :)

& thank you so much for that crumbs menu. looks great! :D


btw. I've noticed that my previous and next links are not aligned;
I'm not sure would you need my .css file for that or?

« Last Edit: May 27, 2015, 03:40:09 AM by fortitude »
*
fortitude
#11
Sniffer
Re: Reseller theme questions | menu | &
June 03, 2015, 11:01:45 AM
I hope my persistence and nagging shall hopefully have effect and those few questions shall be answered.
It's been a blank week  with no reply. :P
*
Daniel
#12
Webmaster
Re: Reseller theme questions | menu | &
June 03, 2015, 02:23:46 PM
Sorry i forget this.
1 error
Reseller.css

Search:
Code: [Select]
.nextlinks_bottom{
clear: both !important;
}
Replace with:
Code: [Select]
.nextlinks_bottom{
clear: both !important;
padding-top: 15px;
}

a question
Reseller.css

Search:
Code: [Select]
.display-info
{
text-align: center;
overflow: hidden;
}
.display-info h1
{
font-size: 36px;
background: #E1E1E1;
border-radius: 5px;
border: 1px solid #CCC;
padding: 15px;
}
Replace with:
Code: [Select]
.display-info
{
overflow: hidden;
}
.display-info div
{
font-size: 36px;
text-align: center;
background: #3498db;
border-radius: 5px;
padding: 15px;
margin: 0 auto;
color: #FFF;
font-weight: bold;
display: table;
}
Display.template.php
Search:
Code: [Select]
<div class="display-info">
<h1>
', $context['subject'], '
</h1>
Replace with:
Code: [Select]
<div class="display-info">
<div>
', $context['subject'], '
</div>

Greetings!!
*
fortitude
#13
Sniffer
Re: Reseller theme questions | menu | &
June 03, 2015, 05:16:47 PM
thank you Daniel,

yet, this is really strange, but left one (previous )is for some reason lower than the right one (next),
and when I add padding it applies to both, and solution doesn't help.
*
Daniel
#14
Webmaster
Re: Reseller theme questions | menu | &
June 03, 2015, 05:34:02 PM
You have to undo the previous change. Do this:
Reseller.css
Search:
Code: [Select]
.nextlinks, .nextlinks_bottom{
margin-bottom: 15px;
}
Replace with:
Code: [Select]
.nextlinks, .nextlinks_bottom{
margin-bottom: 15px;overflow:hidden;
}
Add to the end:
Code: [Select]
.nextlinks a:last-of-type, .nextlinks_bottom a:last-of-type
{
float: right;
}