Files
4WDCSA.co.za/assets/sass/sections/_widgets.sass
Local Administrator b83134aca3 Initial commit
2025-04-18 10:32:42 +02:00

327 lines
8.3 KiB
Sass

/*******************************************************/
/***************** ## Sidebar Widgets *****************/
/*******************************************************/
.widget
&:not(:last-child)
margin-bottom: 45px
.widget-title
margin-bottom: 14px
.widget-search
form
display: flex
padding: 15px 30px
align-items: center
background: $lighter-color
input
padding: 0
border: none
background: transparent
button
flex: none
background: transparent
.widget-gallery .gallery
display: flex
flex-wrap: wrap
margin-right: -10px
margin-bottom: -10px
a
margin-right: 10px
margin-bottom: 10px
max-width: calc(33.333% - 10px)
img
border-radius: 7px
.widget-cta
z-index: 1
border: none
overflow: hidden
position: relative
padding: 0 !important
background: $heading-color
.content
padding: 40px
+res-bt(lg, xl)
+gapLR(padding, 25px)
+res-bl(xs)
+gapLR(padding, 25px)
.h6
display: block
font-weight: 300
margin-bottom: 5px
h3
margin-bottom: 20px
+res-bl(xs)
font-size: 28px
.theme-btn.style-two
padding: 5px 20px
font-size: 14px
.image img
width: 100%
.cta-shape
z-index: -1
+poRT(20px, 0)
max-width: 44%
.price-filter-wrap
margin-top: 25px
.price
display: flex
margin-top: 20px
align-items: center
color: $heading-color
span
margin-right: 5px
input
padding: 0
border: none
font-size: 16px
font-weight: 500
background: transparent
.ui-widget.ui-widget-content
height: 5px
border: none
cursor: pointer
background: rgba($primary-rgb, 0.2)
.ui-widget-header
background: $primary-color
.ui-slider .ui-slider-handle
+size(12px)
top: -4px
border: none
cursor: e-resize
border-radius: 50%
background: $primary-color
.widget-news li
display: flex
align-items: center
&:not(:last-child)
margin-bottom: 30px
.image
flex: none
max-width: 100px
margin-right: 30px
+res-bt(lg, xl)
max-width: 80px
margin-right: 15px
+res-bl(xs)
max-width: 75px
margin-right: 12px
img
border-radius: 7px
.content
h6
margin-bottom: 5px
+res-bt(lg, xl)
font-size: 15px
+res-bt(xl, lp)
font-size: 17px
+res-bl(ms)
font-size: 16px
+res-bl(xs)
font-size: 15px
.date
+res-bl(xs)
font-size: 14px
i
margin-right: 5px
.tag-coulds
display: flex
flex-wrap: wrap
margin-right: -10px
margin-bottom: -10px
a
padding: 3px 15px
font-size: 16px
font-weight: 500
margin: 0 10px 10px 0
border-radius: 7px
border: 1px solid $border-color
&:hover
color: white
background: $secondary-color
border-color: $secondary-color
.widget-booking
form
.date
display: flex
align-items: center
justify-content: space-between
b
line-height: 1.3
input
max-width: 190px
padding: 5px 15px
border: 1px solid $border-color
.time
display: flex
align-items: center
justify-content: space-between
.radio-filter
width: 55%
display: flex
align-items: center
justify-content: space-between
li
margin-bottom: 0
.tickets li
display: flex
align-items: center
justify-content: space-between
.nice-select
width: auto
border: none
padding: 0 18px 0 0
background: transparent
&:after
+size(9px)
right: 2px
margin-top: -6px
h6
display: flex
align-items: center
justify-content: space-between
span
font-size: 1.2em
/* Blog Sidebar */
.blog-sidebar
.widget
padding: 40px 30px
border-radius: 10px
border: 1px solid $border-color
+res-bt(lg, xl)
+gapLR(padding, 20px)
+res-bl(xs)
+gapLR(padding, 20px)
&:not(:last-child)
margin-bottom: 30px
.widget-title
margin-top: -8px
margin-bottom: 25px
padding-bottom: 15px
border-bottom: 1px solid $border-color
.list-style-one,
.list-style-three
li:last-child
margin-bottom: 0
.widget-search
padding: 0
/* Tour Sidebar */
.tour-sidebar
.widget:not(.widget-cta)
background: $lighter-color
+res-ab(xl)
+gapLR(padding, 40px)
.widget-cta
.content
.h6
font-size: 14px
h3
font-size: 22px
.cta-shape
right: 0
/* Shop Sidebar */
.radio-filter li
display: flex
align-items: center
&:not(:last-child)
margin-bottom: 10px
input
+size(15px)
flex: none
padding: 0
margin-top: 0
margin-right: 7px
border-radius: 50%
position: relative
background: transparent
border: 1px solid $border-color
&:before
content: ''
+size(5px)
opacity: 0
+absmiddle()
transition: 0.2s
border-radius: 50%
background: $secondary-color
&:checked
background: transparent
border-color: $secondary-color
&:before
opacity: 1
&:focus
box-shadow: none
label
width: 100%
display: flex
margin-bottom: 0
align-items: center
justify-content: space-between
.ratting i
font-size: 12px
line-height: 1.8
&.white
color: #AAAAAA
.widget-tour
.tour-grid.style-three
border: none
border-radius: 0
margin-bottom: 0
background: transparent
&:not(:last-child)
margin-bottom: 22px
padding-bottom: 18px
border-bottom: 1px solid $border-color
.image
width: 100%
margin: 0 0 12px
.content
padding: 0
.destination-header
font-size: 14px
justify-content: space-between
.location
margin-right: 0
.ratting
padding: 0
h6
font-size: 16px
font-weight: 500
margin-bottom: 0
color: $heading-color
.shop-sidebar
padding: 30px
border-radius: 10px
border: 1px solid $border-color
+res-bt(lg, xl)
+gapLR(padding, 15px)
.widget
&:not(:last-child)
margin-bottom: 30px
padding-bottom: 30px
border-bottom: 1px solid $border-color
.widget-title
margin-bottom: 15px
+ .widget-cta
border-radius: 7px
.content
.h6
font-size: 14px
h3
font-size: 22px
.cta-shape
right: 0
top: 22%
max-width: 35%