T3 Community Discussion & Support

Let's build the best free Joomla template framework, together!
  1. GTR
  2. General Discussion
  3. Friday, 28 March 2014
  4.  Subscribe via email
Hello

I have a customized T3 layout (last version) and it works.
Now I installed K2 for use with isotope funtionality.
The .modal class is used to display a big version of a picture (js).
But no luck : this class is also in css - a file called templates.t3_blank.less.bootstrap.less.css.
I can't modify the js file.
I have read that I should not modify the bootstrap files but I need to get rid of this .modal class in css.

Whats the "best" way to do this ?
Comment
There are no comments made yet.
Accepted Answer Pending Moderation
0
Votes
Undo
Here how you can fix for K2.
1. Copy k2.css from /components/com_k2/css/k2.css to your /templates/[yourtemplate]/css/k2.css
2. Upgrade class for a.modal

#k2Container a.modal {
border: 0px;
display: inline-block;
margin: 0 10px 0 0;
position: relative;
top: auto;
left: 0px;
width: auto;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
-webkit-box-shadow: 0 0 0 0;
-moz-box-shadow: 0 0 0 0;
box-shadow: 0 0 0 0;
}

Note: You can use this css selector #k2Container a.modal or any specific css selector .k2UserBlock .k2UserBlockActions a.modal


found on this website: https://github.com/t3framework/t3/issues/33
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 1
Accepted Answer Pending Moderation
0
Votes
Undo
Hello

Thanks for your answer
But sadly its this - its not a k2 file causing the problem
The file is called templates.t3_blank.less.bootstrap.less.css
After your answer I had another look - and found the file in the t3-assets/dev folder
I modified this file and it works for me !
But I wonder if I should modify first a less file but I know nothing at all about less
Do you think its necessary ?

Here's the css I removed :

.modal {
position: fixed;
top: 10%;
left: 50%;
z-index: 1050;
width: 560px;
margin-left: -280px;
background-color: #fff;
border: 1px solid #999;
border: 1px solid rgba(0,0,0,0.3);

*border: 1px solid #999;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
-webkit-box-shadow: 0 3px 7px rgba(0,0,0,0.3);
-moz-box-shadow: 0 3px 7px rgba(0,0,0,0.3);
box-shadow: 0 3px 7px rgba(0,0,0,0.3);
-webkit-background-clip: padding-box;
-moz-background-clip: padding-box;
background-clip: padding-box;
outline: none;
}
*/
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 2
Accepted Answer Pending Moderation
0
Votes
Undo
Less likes at css, for now you can keep it this way, but whenever you change your less files, or you compile less to css, than this will be overwriten. Another way to solve this problem is make a custom.css file inside the css folder from your template, and copy that code in there. T3 will automatically pick this custom.css file and add it to your site.
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 3
Accepted Answer Pending Moderation
0
Votes
Undo
I'm having trouble with T3 modal CSS & Sourcecoast SCLogin module too. The modal popup does not show and from initial investigation the .hide class on the div#login-modal is preventing it from displaying. But even when it displays I see the template's modal CSS is causing issues.
Attachments (1)
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 4
  • Page :
  • 1


There are no replies made for this post yet.
However, you are not allowed to reply to this post.