By Michael on Saturday, 21 March 2015
Posted in General Issues
Replies 23
Likes 0
Views 1K
Votes 0
Hello,

I have just updated to easysocial v1.3.22

However some of my template overrides (custom.css) placed in templates/my_template/html/com_easysocial no longer function. E.g streams font size and type among others. I uploaded the custom.css file to my template again but it still isn't functioning.

Kindly assist
Hello Michael,

As mentioned in my reply earlier, there's no issue with the css file in EasySocial as the css file is actually loaded and the only reason that your own styling isn't kicking in is actually because your css rule isn't having the highest precedence. You should add an !important at the font-size in your custom.css and it should take higher precedence
·
Wednesday, 25 March 2015 03:15
·
0 Likes
·
0 Votes
·
0 Comments
·
Hello Michael,

I am really sorry for the delay of this reply as it is a weekend for us here. Firstly please do understand that customizations are actually not covered in our support policy. Anyway, we'll assist you just this once out of good faith

Both the site access and ftp access that you have provided isn't working for us. Can you please advise?
·
Saturday, 21 March 2015 17:47
·
0 Likes
·
0 Votes
·
0 Comments
·
Hello Mark,

Both the backend details and ftp work fine from my end.

I've provided alternatives below.

It's not about the customisation but rather the custom job I've put in my template as per your documentation on template overrides fails to function after updating to Es 1.3.22

Thanks for the help anyway.

Cheers!
·
Saturday, 21 March 2015 18:00
·
0 Likes
·
0 Votes
·
0 Comments
·
Hello MIchael,

The custom.css file is actually loaded and rendered on the site as you can see from my screen shot here, http://screen.stackideas.com/2015-03-21_1814.png . Which particular styling are you referring to that is not taking effect? Perhaps there is something not right with the css codes?
·
Saturday, 21 March 2015 18:16
·
0 Likes
·
0 Votes
·
0 Comments
·
Hello Mark,

Am referring to the stream font size and family. The custom.css file modifies e.g stream fonts to 14px and family: Tahoma amongst others but this is rendering Es core font size 11 px and font family.

Modifications where also made to the font size of the Spalsh page. They all functioned just fine before the update.

Thanks
·
Saturday, 21 March 2015 18:30
·
0 Likes
·
0 Votes
·
0 Comments
·
I have now reverted back to Es v1.3.20 and my customisations work perfectly well.

Log in and see for yourself.

I have attached screenshots to show the visible differences. Image 1 is 1.3.22, image 2 is 1.3.20. The font size is visibly different. Same goes with the toolbar images and other css stylings I modified.

This clearly shows it has nothing to do with my css codes by rather my update to v1.3.22

Should you need to recreate the issue, feel free to update to Es v1.3.22 from the backend and you'll realise the visible difference. Hopefully you'll understand the issue better this way.

Thanks
·
Saturday, 21 March 2015 19:46
·
0 Likes
·
0 Votes
·
0 Comments
·
Hello Michael,

I am really sorry for the delay of this reply as it is a weekend for us here. Hm, the screen shot doesn't seem to appear for me. Can you please advise?

Which particular "css" rule wasn't taking effect on 1.3.22?
·
Sunday, 22 March 2015 04:37
·
0 Likes
·
0 Votes
·
0 Comments
·
See attachment. Better still, if you login using the details provided you'll notice the difference.
·
Sunday, 22 March 2015 04:43
·
0 Likes
·
0 Votes
·
0 Comments
·
Hello Michael,

Can you please highlight the areas that is different? I can't really see the difference (Sorry! I am not really a designer and can't really tell the difference in both these screens) Perhaps I am getting a little blinded by looking at codes the whole day.

Also, which specific css codes did you place in the custom.css file?
·
Sunday, 22 March 2015 13:19
·
0 Likes
·
0 Votes
·
0 Comments
·
not to worry Mark. I'll have to explore workarounds but thanks all the same.

Cheers!
·
Sunday, 22 March 2015 22:03
·
0 Likes
·
0 Votes
·
0 Comments
·
Hello Michael,

Thanks for updating but I am just curious as to what the issue is
·
Monday, 23 March 2015 04:33
·
0 Likes
·
0 Votes
·
0 Comments
·
Well I'm uncertain myself. For some reason, the font size and toolbar icons size as modified in my custom.css within my template fail to apply with v1.3.22. Therefore am going to have to stick with v1.3.20 till I find out why.
·
Monday, 23 March 2015 04:40
·
0 Likes
·
0 Votes
·
0 Comments
·
Hello Michael,

Perhaps you should update it back to 1.3.22 and let me try to figure this out for you. I just need to know which css codes you have added
·
Monday, 23 March 2015 04:45
·
0 Likes
·
0 Votes
·
0 Comments
·
Hi Mark,

These are my custom.css tweaks within my template. I've also updated back to v1.3.22.

If you take a look, the stream font size, toolbar item size & a few others don't take precedence.



Thanks



#jsn-header {
z-index: 601;
position: relative;
}
.jfbconnect-wrapper {
text-align: center;
}
.jfbconnect-wrapper .social-login .pull-left {
float: none !important;
margin: 0 !important;
}
.jfbconnect-wrapper .social-login .pull-left a {
display: inline-block !important;
}
.jfbconnect-wrapper .social-login .pull-left a img {
max-width: 90px !important;
}
.jfbconnect-wrapper .social-login >div {
display: inline-block !important;
}
[class^="tm-"] div#fd button,
[class^="tm-"] div#fd input,
[class^="tm-"] div#fd textarea {
-webkit-box-sizing: border-box !important;
-moz-box-sizing: border-box !important;
box-sizing: border-box !important;
}
.method-totp .well {
display: none;
}
.method-totp fieldset legend {
font-size: 12px;
font-weight: 700;
}
.method-totp fieldset ul {
padding: 0;
margin: 0;
list-style: none;
}
.method-totp fieldset ul li {
list-style: none;
}
.method-totp fieldset .span6 {
width: 100%;
}
.method-totp fieldset .alert-info {
background: none;
border: none;
}
.method-totp fieldset .control-group label.control-label {
width: 20%;
}
.method-totp fieldset .control-group .controls {
margin-left: 0;
}
.method-totp fieldset .control-group .controls #totpsecuritycode {
font-size: 12px;
padding: 5px 10px;
line-height: 1.5;
border-radius: 3px;
height: 30px;
width: 160px;
}
body div#fd.es .es-stream-content {
font-size: 14px;
font-family: tahoma;
padding: 0 10px;
margin: 10px 0;
word-wrap: break-word;
color: rgba(0,0,0,0.8);
}
body div#fd.es .es-stream-meta {
padding: 10px;
border-bottom: 1px solid #d7d7d7;
background-color: #f4f6f7;
}
body div#fd.es.view-friends .es-item {
background: #f4f6f7;
}
body div#fd.es .es-item {
border: 1px solid #d7d7d7;
border-radius: 3px;
padding: 10px;
background-color: #f4f6f7;
}
body div#fd.es .es-toolbar .fd-nav>li>a [class^="ies-"], body div#fd.es .es-toolbar .fd-nav>li>a [class*=" ies-"] {
vertical-align: top;
position: relative;
width: 20px;
height: 14px;
line-height: 14px;
color: #3a77b6;
font-size: 20px;
text-align: center;
}
body div#fd.es .es-stream-meta .es-stream-title a {
font-size: 12px;
font-weight: 900;
}
body div#fd.es .es-widget * {
font-size: 11px;
font-weight: 900;
}
body div#fd.es .es-container .es-sidebar {
width: 210px;
padding-top: 3px;
position: relative;
border-right: 1px solid #d7d7d7;
display: table-cell;
vertical-align: top;
}
body div#fd.es .es-streams {
padding: 10px 0 0 15px;
color: rgba(0,0,0,0.8);
}
body div#fd.es .es-filterbar {
position: relative;
z-index: 2;
height: 40px;
padding: 4px 14px;
border-bottom: 0px solid #d7d7d7;
}
body div#fd.es.popbox-notifications {
font-family: 'Lucida Grande','Gisha','Lucida Sans Unicode','Lucida Sans',Lucida,Arial,Verdana,sans-serif;
font-size: 12px;
width: 380px;
font-size: 12px;
font-weight: bold;
min-height: 64px;
}
body div#fd.es.view-conversations .es-sidebar .es-conversation-username {
margin: 5px 0 0 5px;
font-size: 12px;
font-weight: bold;
line-height: 16px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
body div#fd.es.view-conversations.layout-read ul.conversation-messages>li.message-item {
padding: 15px 0;
font-size: 14px;
font-family: tahoma;
width: 100%;
}
body div#fd.es.view-conversations.layout-read ul.conversation-messages>li.message-item {
padding: 15px 0;
font-size: 13px;
width: 100%;
}
body div#fd.es.popbox li>a {
color: #666 !important;
font-size: 12px;
display: block;
padding: 3px 20px;
clear: both;
font-weight: normal;
line-height: 16px;
white-space: nowrap;
border-top: 1px solid transparent;
border-bottom: 1px solid transparent;
}
body div#fd.es .login-box-title {
font-weight: bold;
font-size: 29px;
font-family: ta;
color: #13294a;
margin-top: 20px;
text-align: center;
line-height: 34px;
}
body div#fd.es {
font-family: 'Lucida Grande','Gisha','Lucida Sans Unicode','Lucida Sans',Lucida,Arial,Verdana,sans-serif;
font-size: 15px;
line-height: 18px;
font-size-adjust: none;
}
·
Monday, 23 March 2015 05:02
·
0 Likes
·
0 Votes
·
0 Comments
·
Hello Michael,

I am currently sampling on the stream contents and take a look at my screen shot here, http://screen.stackideas.com/2015-03-23_0509.png it's actually inheriting from your custom.css theme file correctly.
·
Monday, 23 March 2015 05:10
·
0 Likes
·
0 Votes
·
0 Comments
·
Hi mark,

Do see my own screen attachment. For reasons I cannot phantom, it does not present the same font size as show in your own screenshot.
·
Monday, 23 March 2015 05:20
·
0 Likes
·
0 Votes
·
0 Comments
·
This shows what I see
·
Monday, 23 March 2015 05:32
·
0 Likes
·
0 Votes
·
0 Comments
·
Hello Michael,

Hm, what should be the correct font type for the stream contents? In my screen shot I sent you earlier, it's actually tahoma.
·
Monday, 23 March 2015 10:33
·
0 Likes
·
0 Votes
·
0 Comments
·
Hello Mark,

you sure do spend alot of time coding

Well yes the font family is tahoma but the font size is 14px in my custom.css file.

}
body div#fd.es .es-stream-content {
font-size: 14px;
font-family: tahoma;
padding: 0 10px;
margin: 10px 0;
word-wrap: break-word;
color: rgba(0,0,0,0.8);
}



However es v1.3.22 & v1.3.23 does not respect this, rather it displays the font size as your standard 11px.


Also,

body div#fd.es .es-toolbar .fd-nav>li>a [class^="ies-"], body div#fd.es .es-toolbar .fd-nav>li>a [class*=" ies-"] {
vertical-align: top;
position: relative;
width: 20px;
height: 14px;
line-height: 14px;
color: #3a77b6;
font-size: 20px;
text-align: center;
}

Here font size has been edited to 20px as you can see however it displays your standard 14px

Some font sizes are just not being observed.

Hopefully this helps
·
Tuesday, 24 March 2015 02:36
·
0 Likes
·
0 Votes
·
0 Comments
·
Hi Michael,

Thanks for your reply.
I have inspected your site and it seems like your issue is now resolved. May I know how do you fix this issue? It might help others who having this issue as well.

Thanks.
·
Tuesday, 24 March 2015 19:21
·
0 Likes
·
0 Votes
·
0 Comments
·
Hello Mohd,

The issue has not been fix. The font in my custom.css file is not what's showing on the website. See my previous post. Unfortunately I am still having this issue.
·
Tuesday, 24 March 2015 21:38
·
0 Likes
·
0 Votes
·
0 Comments
·
Thanks Mark. That's why you're the guru works just fine.

Cheers!
·
Wednesday, 25 March 2015 05:03
·
0 Likes
·
0 Votes
·
0 Comments
·
Hi Michael,

Thanks for updating us back on this issue. I am glad to hear that your issue is now resolved.

Have a nice day.
·
Wednesday, 25 March 2015 12:40
·
0 Likes
·
0 Votes
·
0 Comments
·
View Full Post