Override Jquery UI CSS

[Jude_AAZ]

Hello,

 

I've included the jQuery UI Tabs using the method recommended in the controller (in override of course)

$ this-> addJqueryUI ('ui.tabs');

 

Now, I would change the CSS which handles tabs (or any UI).

By default, the CSS used is present in the /js/jquery/ui/themes/THEME_NAME (default 'base').

 

What is the best method to deploy my own CSS?

• creating a new theme /js/jquery/ui/themes/ ? For me the best method, but what about updating Prestashop?
  
• creating a CSS file in my theme Prestashop? Yes, but where? /themes/my_theme/css/? In a subfolder?
  

This question is for all overloads jQuery: jQuery UI or jQuery plugins.

 

Thank you

[vivek.sakhilati]

hey can you pelase let us how to do it ...

[SupaMonkey]

I also want to know how to do this?

[Richard S]

Ping.

So what to do when you do not want any base ui stylng? How to properly remove default base theme UI Styling?

[miki22]

  On 11/13/2012 at 4:21 AM, Jude_AAZ said:

Hello,

 

I've included the jQuery UI Tabs using the method recommended in the controller (in override of course)

$ this-> addJqueryUI ('ui.tabs');

Now, I would change the CSS which handles tabs (or any UI).

By default, the CSS used is present in the /js/jquery/ui/themes/THEME_NAME (default 'base').

 

What is the best method to deploy my own CSS?

• creating a new theme /js/jquery/ui/themes/ ? For me the best method, but what about updating Prestashop?
• creating a CSS file in my theme Prestashop? Yes, but where? /themes/my_theme/css/? In a subfolder?

This question is for all overloads jQuery: jQuery UI or jQuery plugins.

 

Thank you

 

 

I start with: 

 

public function setMedia()
{
parent::setMedia();
$this->addCSS(_THEME_CSS_DIR_.'identity.css');
$this->addJqueryUi(array('ui.slider', 'ui.tabs'));
$this->addJS(_PS_JS_DIR_.'validate.js');}

in Controller.

 

Slider and tabs display with jquery style's only

if i add this tag to .tpl:

(i try copy content of this css but to own css, but don't know where):

 <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">

Where to put it?

In theme/css i add jquery-ui.css

and paste the content of tag file

and use

$this->addCSS(_THEME_CSS_DIR_.'jquery-ui.css');

but i have img problem:

 

 

How to make it use default Prestashop css files - path

Maybe there is some thing like?:

$this->addCSS(_PS_CSS_DIR_.'jquery-ui.css');

Edited March 31, 2015 by miki22 (see edit history)