Jump to content
WebFlake

Advertisement

Advanced Custom Widgets 1.0.2 for IPS 4.2.x

unknoweb

By unknoweb
in IC4 Guides

 Share

Recommended Posts

unknoweb Apprentice

unknoweb

Posted
Posted

I post here because there is a problem under Download display if you want it go here

Go in your Theme and "Edit HTML and CSS" under Template select "Core => Global => Plugins" and select file customwidgets

delete code and copie and paste this code and save 

<div class="fw_Container{{if $fw_type == 'default'}} fw_default{{endif}}{{if $fw_switcher_type == 'advanced'}} fw_switchertype_advanced{{endif}}{{if $fw_switcher_style == 'stylea'}} fw_switcherstyle_A{{else}} fw_switcherstyle_B{{endif}}{{if $fw_height =='full'}} fw_fullScreen{{endif}}{{if $wheretoshow == 'rightcenter'}} fw_rightcenter{{elseif $wheretoshow == 'leftcenter'}} fw_leftcenter{{elseif $wheretoshow == 'righttop'}} fw_righttop{{elseif $wheretoshow == 'leftTop'}} fw_lefttop{{elseif $wheretoshow == 'rightbottom'}} fw_rightbottom{{elseif $wheretoshow == 'leftbottom'}} fw_leftbottom{{endif}}{{if $fw_mobile == '1'}} ipsResponsive_hidePhone ipsResponsive_hideTablet{{else}} fw_Responsive{{endif}}{{if $switcher_align == 'top'}} fw_sTop{{elseif $switcher_align == 'center'}} fw_sCenter{{elseif $switcher_align == 'bottom'}} fw_sBottom{{endif}}" data-controller='customWidget' id="fw_id_{$uniqueKey}" {{if $fw_height =='custom' && ($wheretoshow == 'righttop' or $wheretoshow == 'leftTop')}}style="top: {$wheretoshow_custom};"{{endif}}>
    <div class="fw_Widget_inner" style="{{if $fw_type == 'fixed'}}width:{$fw_width}px;{{endif}}background-color: {$fw_contentbg};border: 1px solid {$fw_contentborder}">
        <div class="fw_Switcher"><span class="fw_Arrow" style="background-color: {$fw_switcherbg};color: {$fw_switchercolor};"><i class="fa {$switcher_icon}" aria-hidden="true"></i>{{if $switcher_title != null}}<span class="fw_switcherTitle">{$switcher_title}</span>{{endif}}</span></div>
        <div class="fw_Content" {{if $fw_type == 'fixed'}}style="{{if $fw_height =='custom'}}height: {$fw_heightcustom}px;{{endif}}"{{endif}}>
            {{if $fw_title != null}}<h3 class="ipsType_reset ipsWidget_title" style="background-color: {$fw_titlebg}; color: {$fw_titlecolor}">{$fw_title}</h3>{{endif}}
            <div class="ipsType_normal ipsType_richText ipsContained ipsPad" style=" color:{$fw_contentcolor};">
            {{if $fw_content_type == 'txt'}}<p class='ipsType_reset ipsType_medium'>{$fw_contenttxt|raw}</p>{{elseif $fw_content_type == 'html'}}{$fw_contenthtml|raw}{{endif}}
        </div>
    </div>
    </div>
</div>

under CSS select "Core => Front => Custom" and select advancedcustom_widgets.css

delete code and copie and paste this code and save 

/*
* Advanced custom widgets By Taman.Sherzad
* https://invisionpower.com/profile/537452-taman
*/

.ipsApp_front:not(.cWidgetsManaging) .fw_Container:not(.fw_default){
  position: fixed;
  z-index: 9999;
}
.ipsApp_front:not(.cWidgetsManaging) .cWidgetContainer li[data-blockid*=_customwidgets_]{
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  box-shadow: none !important;
}
.ipsApp_front.cWidgetsManaging .fw_Container,
.ipsApp_front.cWidgetsManaging .fw_Container .fw_Widget_inner{
  width: auto  !important;
  height: auto  !important;
  background: none !important;
  -webkit-transform: none !important;
  -ms-transform: none !important;
  transform: none !important;
}
.ipsApp_front.cWidgetsManaging .fw_Container .fw_Switcher{
  display: none;
}
.ipsApp_front.cWidgetsManaging .fw_Container .fw_Widget_inner{
  max-height: 200px;
  min-height: 150px;
  overflow: hidden;
}
.fw_Container:not(.fw_default) .fw_Widget_inner:after{
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  -webkit-box-shadow: -4px 7px 15px 1px rgba(0,0,0,.2);
  -moz-box-shadow: -4px 7px 15px 1px rgba(0,0,0,.2);
  box-shadow: -4px 7px 15px 1px rgba(0,0,0,.2);
  z-index: -2;
}
.fw_Container .fw_Widget_inner{
  position: relative;
  text-align: center;
  padding: 5px;
  {prefix="transition" value="0.1s all linear"}
}
.fw_Container .fw_Widget_inner .ipsWidget_title{
  margin: 0 !important;
}
.fw_Container:not(.fw_default).fw_leftcenter .fw_Widget_inner,
.fw_Container:not(.fw_default).fw_lefttop .fw_Widget_inner,
.fw_Container:not(.fw_default).fw_leftbottom .fw_Widget_inner{
  border-radius: 0 2px 2px 0;
}
.fw_Container:not(.fw_default).fw_rightcenter .fw_Widget_inner,
.fw_Container:not(.fw_default).fw_righttop .fw_Widget_inner,
.fw_Container:not(.fw_default).fw_rightbottom .fw_Widget_inner{
  border-radius: 2px 0 0 2px;
}
.fw_Container.fw_fullScreen .fw_Widget_inner{
  border-radius: 0;
}
.fw_Content{
  width: auto;
  overflow: auto;
}
.fw_Container.fw_fullScreen .fw_Content{
  height: 100% !important;
}
.fw_Content::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	background-color: #F5F5F5;
}

.fw_Content::-webkit-scrollbar
{
	width: 6px;
	background-color: #F5F5F5;
}

.fw_Content::-webkit-scrollbar-thumb
{
	background-color: #40474c;
}

.fw_Container .fw_Widget_inner:hover{
  box-shadow: -2px 0 4px 0 rgba(0,0,0,.2);
}
.fw_switcherTitle{
  {prefix="transition" value="0.1s all ease-in-out"}
}
.fw_Container .fw_Switcher{
  position: absolute;
  cursor: pointer;
  z-index: -1;
}
.fw_Container .fw_Switcher .fw_Arrow{
  position: relative;
}
.fw_fullScreen,
.fw_fullScreen .fw_Widget_inner{
  height: 100%;
}
/*
*Switcher styles
*/
.fw_Container.fw_switcherstyle_B .fw_Switcher .fw_Arrow{
  display: block;
  margin-top: 5px;
  margin-bottom: 5px;
  line-height: 40px;
  text-align: center;
  box-shadow: 0 0 4px 0 rgba(0,0,0,.2);
}
.fw_Container.fw_switcherstyle_B.fw_rightcenter .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_B.fw_righttop .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_B.fw_rightbottom .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_B.fw_leftcenter .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_B.fw_lefttop .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_B.fw_leftbottom .fw_Switcher .fw_Arrow{
  width: 25px;
  height: 40px;
}
.fw_Container.fw_switcherstyle_B.fw_rightcenter .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_B.fw_righttop .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_B.fw_rightbottom .fw_Switcher .fw_Arrow{
  margin-left: -25px;
  border-radius: 7px 0 0 7px;
}
.fw_Container.fw_switcherstyle_B.fw_leftcenter .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_B.fw_lefttop .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_B.fw_leftbottom .fw_Switcher .fw_Arrow{
  margin-right: -25px;
  border-radius: 0 10px 10px 0;
}
/*
*->
*/
.fw_Container.fw_switcherstyle_A .fw_Switcher .fw_Arrow{
  display: block;
  line-height: 40px;
  text-align: center;
}
.fw_Container.fw_switcherstyle_A.fw_sTop .fw_Switcher .fw_Arrow{
  margin-top: -1px;
}
.fw_Container.fw_switcherstyle_A.fw_sBottom .fw_Switcher .fw_Arrow{
  margin-bottom: -1px;
}
.fw_Container.fw_switcherstyle_A .fw_Switcher .fw_Arrow i{
  font-size: 18px;
  line-height: 70px;
}
.fw_Container.fw_switcherstyle_A.fw_sCenter .fw_Switcher .fw_Arrow::before,
.fw_Container.fw_switcherstyle_A .fw_Switcher .fw_Arrow::after{
  content: "";
  position: absolute;
  background: inherit;
  width: 65px;
  height: 40px;
  z-index: -1;
}
.fw_Container.fw_switcherstyle_A.fw_sCenter .fw_Switcher .fw_Arrow::before{
  -webkit-box-shadow: 5px 6px 10px -1px rgba(0,0,0,0.2);
  -moz-box-shadow: 5px 6px 10px -1px rgba(0,0,0,0.2);
  box-shadow: 5px 6px 10px -1px rgba(0,0,0,0.2);
}
.fw_Container.fw_switcherstyle_A .fw_Switcher .fw_Arrow::after{
  -webkit-box-shadow: 5px -6px 10px -1px rgba(0,0,0,0.2);
  -moz-box-shadow: 5px -6px 10px -1px rgba(0,0,0,0.2);
  box-shadow: 5px -6px 10px -1px rgba(0,0,0,0.2);
}
.fw_Container.fw_switcherstyle_A.fw_leftcenter.fw_sTop .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_lefttop.fw_sTop .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_leftbottom.fw_sTop .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_rightcenter.fw_sBottom .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_righttop.fw_sBottom .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_rightbottom.fw_sBottom .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_leftcenter.fw_sCenter .fw_Switcher .fw_Arrow::before,
.fw_Container.fw_switcherstyle_A.fw_lefttop.fw_sCenter .fw_Switcher .fw_Arrow::before,
.fw_Container.fw_switcherstyle_A.fw_leftbottom.fw_sCenter .fw_Switcher .fw_Arrow::before,
.fw_Container.fw_switcherstyle_A.fw_rightcenter.fw_sCenter .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_righttop.fw_sCenter .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_rightbottom.fw_sCenter .fw_Switcher .fw_Arrow::after{
  -webkit-transform: rotate(-30deg);
  -ms-transform: rotate(-30deg);
  transform: rotate(-30deg);
}
.fw_Container.fw_switcherstyle_A.fw_rightcenter.fw_sTop .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_righttop.fw_sTop .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_rightbottom.fw_sTop .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_leftcenter.fw_sBottom .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_lefttop.fw_sBottom .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_leftbottom.fw_sBottom .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_leftcenter.fw_sCenter .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_lefttop.fw_sCenter .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_leftbottom.fw_sCenter .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_rightcenter.fw_sCenter .fw_Switcher .fw_Arrow::before,
.fw_Container.fw_switcherstyle_A.fw_righttop.fw_sCenter .fw_Switcher .fw_Arrow::before,
.fw_Container.fw_switcherstyle_A.fw_rightbottom.fw_sCenter .fw_Switcher .fw_Arrow::before{
  -webkit-transform: rotate(30deg);
  -ms-transform: rotate(30deg);
  transform: rotate(30deg);
}
.fw_Container.fw_switcherstyle_A.fw_leftcenter.fw_sTop .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_lefttop.fw_sTop .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_leftbottom.fw_sTop .fw_Switcher .fw_Arrow::after{
  left: -16px;
  bottom: -19px;
}
.fw_Container.fw_switcherstyle_A.fw_leftcenter.fw_sTop .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_A.fw_lefttop.fw_sTop .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_A.fw_leftbottom.fw_sTop .fw_Switcher .fw_Arrow {
    border-radius: 0 13px 0 0;
}
.fw_Container.fw_switcherstyle_A.fw_rightcenter.fw_sTop .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_righttop.fw_sTop .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_rightbottom.fw_sTop .fw_Switcher .fw_Arrow::after{
  right: -16px;
  bottom: -19px;
}
.fw_Container.fw_switcherstyle_A.fw_rightcenter.fw_sTop .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_A.fw_righttop.fw_sTop .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_A.fw_rightbottom.fw_sTop .fw_Switcher .fw_Arrow {
    border-radius: 13px 0 0 0;
}
.fw_Container.fw_switcherstyle_A.fw_leftcenter.fw_sBottom .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_lefttop.fw_sBottom .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_leftbottom.fw_sBottom .fw_Switcher .fw_Arrow::after{
  left: -16px;
  top: -19px;
}
.fw_Container.fw_switcherstyle_A.fw_leftcenter.fw_sBottom .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_A.fw_lefttop.fw_sBottom .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_A.fw_leftbottom.fw_sBottom .fw_Switcher .fw_Arrow {
    border-radius: 0 0 13px 0;
}

.fw_Container.fw_switcherstyle_A.fw_rightcenter.fw_sBottom .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_righttop.fw_sBottom .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_rightbottom.fw_sBottom .fw_Switcher .fw_Arrow::after{
  right: -16px;
  top: -19px;
}
.fw_Container.fw_switcherstyle_A.fw_rightcenter.fw_sBottom .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_A.fw_righttop.fw_sBottom .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_A.fw_rightbottom.fw_sBottom .fw_Switcher .fw_Arrow {
    border-radius: 0 0 0 13px;
}

.fw_Container.fw_switcherstyle_A.fw_leftcenter.fw_sCenter .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_lefttop.fw_sCenter .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_leftbottom.fw_sCenter .fw_Switcher .fw_Arrow::after{
  left: -20px;
  top: -19px;
}
.fw_Container.fw_switcherstyle_A.fw_leftcenter.fw_sCenter .fw_Switcher .fw_Arrow::before,
.fw_Container.fw_switcherstyle_A.fw_lefttop.fw_sCenter .fw_Switcher .fw_Arrow::before,
.fw_Container.fw_switcherstyle_A.fw_leftbottom.fw_sCenter .fw_Switcher .fw_Arrow::before{
  left: -20px;
  bottom: -19px;
}
.fw_Container.fw_switcherstyle_A.fw_leftcenter.fw_sCenter .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_A.fw_lefttop.fw_sCenter .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_A.fw_leftbottom.fw_sCenter .fw_Switcher .fw_Arrow {
    border-radius: 0 7px 7px 0;
}

.fw_Container.fw_switcherstyle_A.fw_rightcenter.fw_sCenter .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_righttop.fw_sCenter .fw_Switcher .fw_Arrow::after,
.fw_Container.fw_switcherstyle_A.fw_rightbottom.fw_sCenter .fw_Switcher .fw_Arrow::after{
  right: -20px;
  top: -19px;
}
.fw_Container.fw_switcherstyle_A.fw_rightcenter.fw_sCenter .fw_Switcher .fw_Arrow::before,
.fw_Container.fw_switcherstyle_A.fw_righttop.fw_sCenter .fw_Switcher .fw_Arrow::before,
.fw_Container.fw_switcherstyle_A.fw_rightbottom.fw_sCenter .fw_Switcher .fw_Arrow::before{
  right: -20px;
  bottom: -19px;
}
.fw_Container.fw_switcherstyle_A.fw_rightcenter.fw_sCenter .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_A.fw_righttop.fw_sCenter .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_A.fw_rightbottom.fw_sCenter .fw_Switcher .fw_Arrow {
    border-radius: 7px 0 0 7px;
}

.fw_Container.fw_switcherstyle_A.fw_rightcenter .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_A.fw_righttop .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_A.fw_rightbottom .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_A.fw_leftcenter .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_A.fw_lefttop .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_A.fw_leftbottom .fw_Switcher .fw_Arrow{
  width: 55px;
  height: 70px;
}
.fw_Container.fw_switcherstyle_A.fw_rightcenter .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_A.fw_righttop .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_A.fw_rightbottom .fw_Switcher .fw_Arrow{
  margin-left: -55px;
}
.fw_Container.fw_switcherstyle_A.fw_leftcenter .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_A.fw_lefttop .fw_Switcher .fw_Arrow,
.fw_Container.fw_switcherstyle_A.fw_leftbottom .fw_Switcher .fw_Arrow{
  margin-right: -55px;
}
/*
*
*/
.fw_Container.fw_rightcenter .fw_Switcher,
.fw_Container.fw_righttop .fw_Switcher,
.fw_Container.fw_rightbottom .fw_Switcher{
  left: -100%;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}
.fw_Container.fw_rightcenter:hover .fw_Switcher,
.fw_Container.fw_righttop:hover .fw_Switcher,
.fw_Container.fw_rightbottom:hover .fw_Switcher{
  left: 0;
}
.fw_Container.fw_leftcenter .fw_Switcher,
.fw_Container.fw_lefttop .fw_Switcher,
.fw_Container.fw_leftbottom .fw_Switcher{
  right: -100%;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}
.fw_Container.fw_leftcenter:hover .fw_Switcher,
.fw_Container.fw_lefttop:hover .fw_Switcher,
.fw_Container.fw_leftbottom:hover .fw_Switcher{
  right: 0;
}
.fw_Container:not(.fw_default).fw_sTop .fw_Switcher{
  top: 0;
  -webkit-transform: none;
  -ms-transform: none;
  transform: none;
}
.fw_Container:not(.fw_default).fw_sBottom .fw_Switcher{
  top: auto;
  bottom: 0;
  -webkit-transform: none;
  -ms-transform: none;
  transform: none;
}
/*
*Switcher title
*/
.fw_Arrow .fw_switcherTitle{
  position: absolute;
  top: 50%;
  display: inline-block;
  visibility: hidden;
  width: auto;
  height: 30px;
  white-space: nowrap;
  line-height: 2.3;
  padding: 0 10px;
  background: #40474c;
  color: #FFFFFF;
  border-radius: 3px;
  box-shadow: 0 0 4px 0 rgba(0,0,0,.2);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}
.fw_Arrow .fw_switcherTitle:before{
  content: "";
  position: absolute;
  top: 9px;
}
.fw_Arrow:hover .fw_switcherTitle{
    visibility: visible;
}
.fw_Container.fw_rightcenter .fw_Arrow .fw_switcherTitle,
.fw_Container.fw_righttop .fw_Arrow .fw_switcherTitle,
.fw_Container.fw_rightbottom .fw_Arrow .fw_switcherTitle{
    right: 0;
    margin-right: 40px;
}
.fw_Container.fw_rightcenter .fw_Arrow:hover .fw_switcherTitle,
.fw_Container.fw_righttop .fw_Arrow:hover .fw_switcherTitle,
.fw_Container.fw_rightbottom .fw_Arrow:hover .fw_switcherTitle{
      margin-right: 37px;
}
.fw_Container.fw_rightcenter .fw_Arrow .fw_switcherTitle:before,
.fw_Container.fw_righttop .fw_Arrow .fw_switcherTitle:before,
.fw_Container.fw_rightbottom .fw_Arrow .fw_switcherTitle:before{
    right: -5px;
    border-top: 5px solid transparent;
    border-left: 5px solid #40474c;
    border-bottom: 5px solid transparent;
}
.fw_Container.fw_leftcenter .fw_Arrow .fw_switcherTitle,
.fw_Container.fw_lefttop .fw_Arrow .fw_switcherTitle,
.fw_Container.fw_leftbottom .fw_Arrow .fw_switcherTitle{
  left: 0;
  margin-left: 40px;
}
.fw_Container.fw_leftcenter .fw_Arrow:hover .fw_switcherTitle,
.fw_Container.fw_lefttop .fw_Arrow:hover .fw_switcherTitle,
.fw_Container.fw_leftbottom .fw_Arrow:hover .fw_switcherTitle{
      margin-left: 37px;
}
.fw_Container.fw_leftcenter .fw_Arrow .fw_switcherTitle:before,
.fw_Container.fw_lefttop .fw_Arrow .fw_switcherTitle:before,
.fw_Container.fw_leftbottom .fw_Arrow .fw_switcherTitle:before{
    left: -5px;
    border-top: 5px solid transparent;
  	border-right: 5px solid #40474c;
  	border-bottom: 5px solid transparent;
}
.ipsApp_front:not(.cWidgetsManaging) .fw_Container:not(.fw_default).fw_Fixed{
  padding: 10px 0;
}
/*
*where to show
*/
  .ipsApp_front:not(.cWidgetsManaging) .fw_Container:not(.fw_default).fw_rightcenter {
    top: 50%;
    left: 100%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  .ipsApp_front:not(.cWidgetsManaging) .fw_Container:not(.fw_default).fw_leftcenter{
    top: 50%;
    right: 100%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  .ipsApp_front:not(.cWidgetsManaging) .fw_Container:not(.fw_default).fw_righttop{
    top: 0;
    left: 100%;
  }
  .ipsApp_front:not(.cWidgetsManaging) .fw_Container:not(.fw_default).fw_lefttop{
    top: 0;
    right: 100%;
  }
  .ipsApp_front:not(.cWidgetsManaging) .fw_Container:not(.fw_default).fw_rightbottom{
    bottom: 0;
    left: 100%;
  }
  .ipsApp_front:not(.cWidgetsManaging) .fw_Container:not(.fw_default).fw_leftbottom{
    bottom: 0;
    right: 100%;
  }
/*
*On Click
*/
.ipsApp_front:not(.cWidgetsManaging) .fw_Container:not(.fw_default).fw_rightcenter:hover,
.ipsApp_front:not(.cWidgetsManaging) .fw_Container:not(.fw_default).fw_rightbottom:hover,
.ipsApp_front:not(.cWidgetsManaging) .fw_Container:not(.fw_default).fw_righttop:hover{
  left: auto;
  right: 0;
}
.ipsApp_front:not(.cWidgetsManaging) .fw_Container:not(.fw_default).fw_leftcenter:hover,
.ipsApp_front:not(.cWidgetsManaging) .fw_Container:not(.fw_default).fw_leftbottom:hover,
.ipsApp_front:not(.cWidgetsManaging) .fw_Container:not(.fw_default).fw_lefttop:hover{
  left: 0;
  right: auto
}
.ipsApp_front:not(.cWidgetsManaging) .fw_Container:not(.fw_default).fw_rightcenter .fw_Widget_inner,
.ipsApp_front:not(.cWidgetsManaging) .fw_Container:not(.fw_default).fw_righttop .fw_Widget_inner,
.ipsApp_front:not(.cWidgetsManaging) .fw_Container:not(.fw_default).fw_rightbottom .fw_Widget_inner{
  left: 100%;
}
.ipsApp_front:not(.cWidgetsManaging) .fw_Container:not(.fw_default).fw_rightcenter:hover .fw_Widget_inner,
.ipsApp_front:not(.cWidgetsManaging) .fw_Container:not(.fw_default).fw_righttop:hover .fw_Widget_inner,
.ipsApp_front:not(.cWidgetsManaging) .fw_Container:not(.fw_default).fw_rightbottom:hover .fw_Widget_inner{
  left: 0;
}
.ipsApp_front:not(.cWidgetsManaging) .fw_Container:not(.fw_default).fw_leftcenter .fw_Widget_inner,
.ipsApp_front:not(.cWidgetsManaging) .fw_Container:not(.fw_default).fw_lefttop .fw_Widget_inner,
.ipsApp_front:not(.cWidgetsManaging) .fw_Container:not(.fw_default).fw_leftbottom .fw_Widget_inner{
  right: 100%;
}
.ipsApp_front:not(.cWidgetsManaging) .fw_Container:not(.fw_default).fw_leftcenter:hover .fw_Widget_inner,
.ipsApp_front:not(.cWidgetsManaging) .fw_Container:not(.fw_default).fw_lefttop:hover .fw_Widget_inner,
.ipsApp_front:not(.cWidgetsManaging) .fw_Container:not(.fw_default).fw_leftbottom:hover .fw_Widget_inner{
  right: 0;
}
/*
* If default
*/
.fw_Container.fw_default .fw_Switcher{
  display: none;
}
.fw_Container.fw_default .fw_Widget_inner{
  margin-top: 15px;
  border-radius: 2px;
}
.fw_Container.fw_default .fw_Widget_inner .fw_Content{
  height: auto;
  overflow: inherit;
}
/*
*Responsive
*/
@media screen and (max-width: 979px) {
  .ipsApp_front:not(.cWidgetsManaging) .fw_Container.fw_Responsive,
  .fw_Container .fw_Widget_inner,
  .fw_Container .fw_Widget_inner .fw_Content{
    position: relative;
    top: auto !important;
    bottom: auto !important;
    right: auto !important;
    left: auto !important;
    width: auto !important;
    height: auto !important;
    min-height: auto !important;
    z-index: auto !important;
    -webkit-transform: none !important;
    -ms-transform: none !important;
    transform: none !important;
  }
  .ipsApp_front:not(.cWidgetsManaging) .fw_Container .fw_Switcher{
    display: none;
  }
  .ipsApp_front:not(.cWidgetsManaging) .cWidgetContainer li[data-blockid*=_customwidgets_],
  .fw_Container .fw_Widget_inner{
    margin-top: 15px;
  }
}

I changed cursor clic with hover it's better :)

Your Welcome with pleasure

  • Thanks 1
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Unfortunately, your content contains terms that we do not allow. Please edit your content to remove the highlighted words below.
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to topic listing
×
×
  • Create New...