By Richard on Wednesday, 11 December 2013
Posted in General Issues
Replies 12
Likes 0
Views 818
Votes 0
I updated to ED 3.2 and am using the Simplistic theme.

There is not enough space to display 'Category' in the Category-Search-New Discussion toolbar (see image).

The search button colour has changed, but I assume that is due to the template css (shaper_optima on Helix II) and can be corrected?
Hello Richard,

Can you add the block of codes below into your template's css file?


div#discuss-wrapper .discuss-searchbar--select:before{
width: 16px !important;
}
div#discuss-wrapper .discuss-searchbar .btn-searchbar{
color: #666 !important;
}
·
Wednesday, 11 December 2013 11:35
·
0 Likes
·
0 Votes
·
0 Comments
·
Perfect Mark, thank you.

I just noticed the 'detail post section' has the same problem for the following buttons:

PM (letters when offline)
Assign Moderator
Type
Quote
Print
Edit
Delete
Moderate
Mark as Favourite
Comment (in reply box)
Article, Image and Icon beside Location (below new reply box of JCK editor - do I contact them for this?)

The toolbar is also slightly offline on the left and the login/logout button colour on the toolbar dropdown has the same problem as above (Where/how do I get the background colour to be the same as EasySocial toolbar?)

I don't like the words 'share this on google +' but I assume they come with the g+ icon?

Images attached for above problems (sorry for not including them in first post, I should have checked the detail posts section before posting).
·
Wednesday, 11 December 2013 12:46
·
0 Likes
·
0 Votes
·
0 Comments
·
Try adding the codes below into your template's css file,


#discuss-wrapper .btn{
color: #666 !important;
}

#discuss-wrapper .btn-primary{
color: #fff !important;
}
·
Wednesday, 11 December 2013 13:03
·
0 Likes
·
0 Votes
·
0 Comments
·
Thank you Mark, that fixed all the problems of buttons blending into the template background.

A couple of final questions (refer to attached image in this post):

1. The 'type' button (Red in the summary posts page) is grey in the detail post, is this intentional or should it not be the same colour (red) as in the summary post?

2. The toolbar is slightly offline on the left (see top left of image).

3. Where/how do I get the background colour to be the same as EasySocial toolbar?

4. The 'Add a Reply' and 'View Reply' buttons have changed colour after adding the changes to the template css, how do i get them back to the original colour (see detailspostcolours image in above post)

5. The Optima template has a fixation with capitals and all the forum buttons fixed in this thread are in capitals instead of mixed text/characters. I removed text-transform: uppercase; from the main menu and header tags in Optima to change them, where/how can the forum buttons be switched to mixed text/characters?
·
Wednesday, 11 December 2013 14:18
·
0 Likes
·
0 Votes
·
0 Comments
·
Bump...in case missed....
·
Friday, 13 December 2013 22:04
·
0 Likes
·
0 Votes
·
0 Comments
·
Hello Richard,

So sorry for the delay in getting back to you. We did indeed missed your post Right for you post type issue the color is deliberate but if you want to change it i can provide a CSS hack. Asfor the buttons the please apply the followunf CSS hacks to correct the colour,
div#discuss-wrapper .btn-info {
color: #fff !important;
}
div#discuss-wrapper .btn-success {
color: #fff !important;
}

For the toolbar,

div#discuss-wrapper .navbar-inner
{
border: 1px solid #6ca0d9;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
background-color: #6aa8dc;
background-image: -moz-linear-gradient(top,#6baee2,#699ed4);
background-image: -webkit-gradient(linear,0 0,0 100%,from(#6baee2),to(#699ed4));
background-image: -webkit-linear-gradient(top,#6baee2,#699ed4);
background-image: -o-linear-gradient(top,#6baee2,#699ed4);
background-image: linear-gradient(to bottom,#6baee2,#699ed4);
background-repeat: repeat-x;
}
div#discuss-wrapper .navbar .nav>.active>a, div#discuss-wrapper .navbar .nav>.active>a:hover, div#discuss-wrapper .navbar .nav>.active>a:focus{
border: 1px solid #6ca0d9;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
background-color: #6aa8dc;
background-image: -moz-linear-gradient(top,#6baee2,#699ed4);
background-image: -webkit-gradient(linear,0 0,0 100%,from(#6baee2),to(#699ed4));
background-image: -webkit-linear-gradient(top,#6baee2,#699ed4);
background-image: -o-linear-gradient(top,#6baee2,#699ed4);
background-image: linear-gradient(to bottom,#6baee2,#699ed4);
background-repeat: repeat-x;
}
div#discuss-wrapper .navbar .nav>li>a{
color:#fff
}
div#discuss-wrapper .navbar .nav>.active>a, div#discuss-wrapper .navbar .nav>.active>a:hover, div#discuss-wrapper .navbar .nav>.active>a:focus
{
color:#fff
}

Hope this helps.

Thanks!
·
Saturday, 14 December 2013 01:15
·
0 Likes
·
0 Votes
·
0 Comments
·
Thank you for the CSS hacks Adelene.

I edited my post above to identify the questions from 1-5 and the updated position (with 2 more problems) is below:

1. A CSS hack to make the type button the same (red?) colour as in the summary post would be useful, thank you.

2. My description was not very good, I mean there is a gap between the 'Discussions' button and the outside border of the toolbar, there should not be a gap (see image in post above)

3. My apologies, I typed 'EasySocial toolbar' instead of EasyBlog toolbar, could you give me the CSS hack to make it the same as the EasyBlog toolbar?

4. Add a Reply and View Reply colours are perfect now, thank you.

5. How do I make all the forum buttons fixed in this thread mixed text/characters instead of capitals (for example 'Add a Reply' instead of ADD A REPLY)?

6. Also, I didn't notice the red LIKE button is fuzzy/out of focus, how do I correct it?

7. The Article and Read More buttons for a new or edit blog post also blend into the template backgroud (I know it is not an EasyDiscuss issue but thought it would be better to raise it here instead of a new post as it is a similar problem.
·
Saturday, 14 December 2013 03:52
·
0 Likes
·
0 Votes
·
0 Comments
·
Hello Richard,

I am really sorry for the delay of this reply, we might have missed your reply earlier. Please find the answers to your inquiries below:


1. A CSS hack to make the type button the same (red?) colour as in the summary post would be useful, thank you.

Sorry but not too sure which part are you referring to here. Can you please advise?


2. My description was not very good, I mean there is a gap between the 'Discussions' button and the outside border of the toolbar, there should not be a gap (see image in post above)

Sorry but I don't really get this, can you please include the image again?


3. My apologies, I typed 'EasySocial toolbar' instead of EasyBlog toolbar, could you give me the CSS hack to make it the same as the EasyBlog toolbar?

Sorry but I am not too sure if I understand you here. Can you please elaborate more on this?


5. How do I make all the forum buttons fixed in this thread mixed text/characters instead of capitals (for example 'Add a Reply' instead of ADD A REPLY)?

You need to edit the translation file in order to change the text.


6. Also, I didn't notice the red LIKE button is fuzzy/out of focus, how do I correct it?

Sorry but I don't quite get this issue. I have tried the like and it seems to be working fine, http://screencast.com/t/qkl2h8EbHjz


7. The Article and Read More buttons for a new or edit blog post also blend into the template backgroud (I know it is not an EasyDiscuss issue but thought it would be better to raise it here instead of a new post as it is a similar problem.

Can you try adding the block of css codes below:


#editor-xtd-buttons .btn{
color: #666 !important;
}
·
Tuesday, 24 December 2013 13:56
·
0 Likes
·
0 Votes
·
0 Comments
·
Hi Mark,

Ref 1 = see attached image, the type button (name = Question) beside the header 'Test Post for Sports' has a grey background, but it is a red background in the summary post. I would like it to always be the same colour as in the summary post.

Ref 2 = see attached image, there is a gap between the discussions icon in the toolbar and the outside border on the left, I assume there should not be any gap.

Ref 3 = I would like the ED toolbar to be the same colour as the EB toolbar, including the account/logout dropdown on the right hand side of the ED toolbar.

Ref 5 = This is resolved in the new Joomshaper Awetive template (released in the last few days) I am testing as their CSS is not as aggressive as the Optima template and does not override ED text into Capitals. It would only be a problem in the Optima template and I have decided not to use it since this thread was started.

Ref 6 = This is also resolved in the new Joomshaper Awetive template and is only fuzzy/out of focus in the Optima template (you would have been looking at Awetive with your screencast as I had switched a few days ago).****

Ref 7 = Sorted, thank you.

New 8 = The EasyBlog toolbar height is out of line with the rest of the toolbar in the Awetive template, needs to be reduced without affecting the width and other sizes (see blogtoolbar.png).

****Edit Update

The Like button was fine before I applied the CSS adjustments (see customlesscode.png image) to make the other buttons visible on the template, now it is fuzzy/out of focus (see fuzzylike.png).
·
Tuesday, 24 December 2013 18:40
·
0 Likes
·
0 Votes
·
0 Comments
·
Hello Richard,

Please find the answers to your inquiries below:


Ref 1 = see attached image, the type button (name = Question) beside the header 'Test Post for Sports' has a grey background, but it is a red background in the summary post. I would like it to always be the same colour as in the summary post.

Add this to your template's css file,


div#discuss-wrapper .label-post_type, div#discuss-wrapper .label-post_status{
background: #B94A48 !important;
}



Ref 2 = see attached image, there is a gap between the discussions icon in the toolbar and the outside border on the left, I assume there should not be any gap.

Sorry but I don't really understand you here. Can you highlight the area in the screen shot?


Ref 3 = I would like the ED toolbar to be the same colour as the EB toolbar, including the account/logout dropdown on the right hand side of the ED toolbar.

Please understand that this is beyond the scope of our support but we will help you out just this once. Also, do take note that due to the nature of the dropdown, you can't have the same background in the account dropdown.


div#discuss-wrapper .navbar-inner{
background: #444 !important;
}

div#discuss-wrapper .navbar-inner i {
color: #fff !important;
}

div#discuss-wrapper .navbar .nav > .active > a, div#discuss-wrapper .navbar .nav > .active > a:hover, div#discuss-wrapper .navbar .nav > .active > a:focus{
background: #333 !important;
}

.navbar .nav > li > a{
text-shadow: none !important;
}

div#discuss-wrapper .navbar .divider-vertical{
border-right: 1px solid #222 !important;
border-left: none !important;
}



New 8 = The EasyBlog toolbar height is out of line with the rest of the toolbar in the Awetive template, needs to be reduced without affecting the width and other sizes (see blogtoolbar.png).

Add the block of css codes below into your template's css file,


#ezblog-menu .blog-navi #ezblog-search{
min-height: 22px !important;
}



The Like button was fine before I applied the CSS adjustments (see customlesscode.png image) to make the other buttons visible on the template, now it is fuzzy/out of focus (see fuzzylike.png).

Add the block of css codes below,


div#discuss-wrapper .discuss-likes .btn-likes{
text-shadow: none !important;
color: #fff !important;
}
·
Wednesday, 25 December 2013 00:36
·
0 Likes
·
0 Votes
·
0 Comments
·
Thank you Mark, much appreciated, especially ref no. 3 and incredible support at this time of year, best wishes for Christmas to you, your family and all Stackideas staff!

I have circled the area I think is a gap that should not be there in the image below.
·
Wednesday, 25 December 2013 03:56
·
0 Likes
·
0 Votes
·
0 Comments
·
Hello Richard,

I am really sorry for the delay of this reply as it is a Christmas day for us here.
Actually that was because the system show out highlight tab effect when you view that discussion page (mean you're viewing this discussion page).
I already make a simple explanation in my 2 screenshot below :
When you click the Discussion homepage -> http://screencast.com/t/w5yT0SM8R3l
When you click another page e.g. category tab, badge tab or else -> http://screencast.com/t/O64hT9pAGQkX
Hope this explanation help and hope you have a Great Christmas day.
·
Wednesday, 25 December 2013 12:53
·
0 Likes
·
0 Votes
·
0 Comments
·
View Full Post