stylesheets/_iasd-widgets.scss in iasd-bootstrap-sass-1.1.0 vs stylesheets/_iasd-widgets.scss in iasd-bootstrap-sass-1.2.0

- old
+ new

@@ -85,21 +85,10 @@ } } .iasd-widget{ margin-bottom: 50px; - h1{ - @include main-title; - @include text-overflow(); - margin: 0 !important; - } - h2{ - font-size: 14px !important; - line-height: 17px !important; - margin: 0 0 10px 0 !important; - font-weight: 900 !important; - } a{ color: $text-color !important; &:hover, &:focus{ h2{ color: $theme-main-color; @@ -110,10 +99,21 @@ &:hover, &:focus{ color: lighten($theme-main-color, 15%) !important; } } } + h1{ + @include main-title; + @include text-overflow(); + margin: 0 !important; + } + h2{ + font-size: 14px !important; + line-height: 17px !important; + margin: 0 0 10px 0 !important; + font-weight: 900 !important; + } p{ font-weight: 400; line-height: 15px !important; text-align: left !important; } @@ -253,10 +253,11 @@ display: block; position: relative; width: 140px; img{ @include border-radius(5px); + max-width: 100%; } .post-taxonomy-tag{ background: $theme-main-color; //IE8 Fallback :( background: rgba($theme-main-color, .9); bottom: 10px; @@ -294,35 +295,35 @@ width: 0px; } } } .post-horizontal-list-item{ - margin: 0 0 20px 0; + margin: 0 0 10px 0; & > a{ @include box-shadow(0 1px 0 $border-base); display: block; min-height: 160px; &:hover, &:focus { border: 0; } h2{ display: inline-block; - min-height: 34px; + height: 34px; + overflow: hidden; width: 100%; } figure{ display: block; float: left; margin: 0 20px 0 0; width: 140px; } p{ - display: table-cell; + display: block; height: 90px; - padding: 0 0 10px 0; - vertical-align: middle; - text-align: left; + overflow: hidden; + padding: 0; } } } .post-vertical-list-item{ & > a{ @@ -331,10 +332,12 @@ &:hover { border: 0 !important; } h2{ display: inline-block; + height: 52px; + overflow: hidden; } figure{ @include border-radius(5px); display: block; height: 85px; @@ -350,12 +353,14 @@ position: relative; &:hover { border: 0 !important; } h2{ + display: block; font-size: 13px !important; font-weight: 700 !important; + height: 66px; padding: 15px 0 0 0; } p{ @include text-overflow(); background: $body-bg; @@ -382,12 +387,14 @@ &:hover { border: 0 !important; } h2{ font-size: 20px !important; + height: 65px; line-height: 25px !important; margin: 10px 0 0 !important; + overflow: hidden; padding: 0 0 15px 0 !important; } figure{ @include border-radius(5px); overflow: hidden; @@ -402,18 +409,20 @@ .highlight-excerpt{ margin-bottom: 20px; & > a{ @include box-shadow(0 1px 0 $border-base); display: block; - min-height: 340px; + min-height: 330px; &:hover, &:focus { border: 0 !important; } h2{ font-size: 20px !important; + height: 48px; line-height: 24px !important; - margin: 10px 0 11px !important; + margin: 10px 0 21px !important; + overflow: hidden; } figure{ @include border-radius(5px); overflow: hidden; height: 185px !important; @@ -431,12 +440,12 @@ } } .more-link{ padding-top: 10px; position: relative; - top: -20px; - } + top: -10px; + } } .entry-content, .iasd-archive { .iasd-widget-posts_grid{ h1{ margin: 0 0 35px 0 !important; @@ -480,11 +489,11 @@ img{ visibility: visible; } } h2{ - display: table-cell; + display: block; height: 85px; vertical-align: middle; } } & + .post-vertical-list-item{ @@ -492,21 +501,19 @@ @include box-shadow(inset 0 1px 0 $border-base); padding-top: 20px; } } &.no-thumb{ - & > a{ - + & > a{ min-height: 0; padding:{ top: 20px; } h2{ - display: inline-block; - padding: 0 0 10px 0; - margin: 0; - height: auto; + height: 34px; + margin: 0 !important; + padding: 0 !important; } } & + .no-thumb{ padding-bottom: 10px; } @@ -531,10 +538,13 @@ } } } } } + .iasd-widget-posts_grid .more-link { + top: -20px; + } } @media (min-width: $screen-sm) { .col-sm-4{ .iasd-widget-posts_grid{ .post-vertical-list-item{ @@ -632,13 +642,12 @@ img{ visibility: visible; } } h2{ - display: table-cell; - height: 90px; - vertical-align: middle; + display: block; + height: 85px; } } & + .post-vertical-list-item{ & > a{ @include box-shadow(inset 0 1px 0 $border-base); @@ -651,21 +660,25 @@ padding:{ bottom: 1px; top: 20px; } h2{ - display: inline-block; padding: 0 0 10px 0; - height: auto; + height: 44px; } } & + .no-thumb{ margin-top: -20px; } } } } + &.col-md-8 { + .more-link { + top: -20px; + } + } } .col-md-4{ .iasd-widget-posts_grid{ .post-vertical-list-item{ margin: 0 0 20px 0; @@ -680,13 +693,12 @@ img{ visibility: visible; } } h2{ - display: table-cell; - height: 90px; - vertical-align: middle; + display: block; + height: 85px; } } & + .post-vertical-list-item{ & > a{ @include box-shadow(inset 0 1px 0 $border-base); @@ -699,22 +711,26 @@ padding:{ bottom: 1px; top: 20px; } h2{ - display: inline-block; padding: 0 0 10px 0; - height: auto; + height: 44px; } } & + .no-thumb{ margin-top: -20px; } } } } } + .col-md-8 { + .more-link { + top: -20px; + } + } } /* ***************** */ /* Posts List Widget */ @@ -735,18 +751,16 @@ width: 100%; &:hover, &:focus { border: 0; } h2{ - display: table-cell; + display: block; font-size: 13px !important; font-weight: 700 !important; - margin: 0 !important; height: 65px; - padding: 13px 0; - overflow: hidden; - vertical-align: middle; + margin: 0 !important; + padding: 17px 0 9px 0; } figure{ display: table-cell !important; vertical-align: middle !important; width: 70px !important; @@ -782,12 +796,12 @@ display: table-cell; height: 90px; padding: 15px 0 15px 15px !important; vertical-align: middle; h2{ - display: inline-block; - height: auto; + height: 34px; + overflow: hidden; padding: 0; } time{ display: block; font-size: 11px; @@ -801,16 +815,16 @@ a{ display: block; height: auto; padding: 0; h2{ - display: table-cell; + display: block; font-size: 20px !important; font-weight: 900 !important; height: 75px; line-height: 24px !important; - margin: 5px 0 6px !important; + padding: 13px 0 0 0; } figure{ @include border-radius(5px); display: block !important; height: 185px; @@ -918,10 +932,12 @@ padding: 15px 0 5px 20px !important; vertical-align: middle; h2{ font-size: 13px !important; font-weight: 700 !important; + display: block; + height: 34px; margin: 0 0 6px 0 !important; padding: 0; overflow: hidden; vertical-align: middle; } @@ -944,11 +960,14 @@ } } } .info { p { + display: block; + height: 32px; margin: 0 0 10px !important; + overflow: hidden; } } .more-link{ padding-top: 10px; } @@ -1126,16 +1145,17 @@ display: table; height: 58px !important; padding: 0 10px 0; width: 100%; h2{ - display: table-cell; + display: block; font-size: 13px !important; font-weight: 700 !important; + height: 54px; margin: 0 !important; - padding: 10px 0; - vertical-align: middle; + overflow: hidden; + padding: 12px 0 8px 0; } figure{ @include border-radius(0); display: table-cell; height: 40px; @@ -1171,24 +1191,23 @@ } .info{ display: table-cell; vertical-align: middle; padding: 0 !important; - h2, address { - @include text-overflow(); - max-width: 190px; - } h2{ display: block; + height: 17px; padding: 0; - margin: 3px 0 0 0 !important; + margin-top: 3px !important; } address{ display: block; - margin: 0; font-size: 12px; font-weight: 400; + height: 20px; + margin: 0; + overflow: hidden; } } &:hover, &:focus{ border-bottom: 0 !important; border-left-color: $theme-main-color; @@ -1236,10 +1255,11 @@ top: 50%; width: 40px; } &.more-link{ padding-left: 10px; + top: 0; &:before{ display: none; } } } @@ -1264,14 +1284,37 @@ /* ************** */ /* Slider widgets */ /* ************** */ .iasd-widget-slider{ + &.highlights { + .owl-carousel { + &.header { + .slider-item { + a { + &>figure { + figcaption { + p { + height: auto; + } + } + } + } + } + } + } + } .owl-carousel{ margin-top: 35px; overflow: hidden; position: relative; + &.galleries { + p { + height: 45px; + overflow: hidden; + } + } .owl-wrapper-outer{ @include border-radius(5px); background: $body-bg-bevel; overflow: hidden; -webkit-mask-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC); // Fix Webkit bug :( @@ -1312,10 +1355,28 @@ border: 0 !important; color: $theme-main-color !important; } } } + &.header{ + .slider-item{ + min-height: 415px; + overflow: hidden; + position: relative; + a{ + & > figure{ + overflow: hidden; + img{ + display: block !important; + left: 50%; + margin-left: -470px; + position: absolute; + } + } + } + } + } &.posts{ .slider-item{ min-height: 300px; overflow: hidden; position: relative; @@ -1325,10 +1386,17 @@ img{ display: block !important; left: 50%; margin-left: -360px; position: absolute; + &:hover, &:focus { + -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; + filter: alpha(opacity=100); + -moz-opacity: 1; + -khtml-opacity: 1; + opacity: 1; + } } } } } } @@ -1399,16 +1467,21 @@ @include border-radius(5px); display: block; height: 185px; margin: 0 0 15px 0; overflow: hidden; + img { + max-width: 100%; + } } h2{ font-size: 20px !important; font-weight: 900 !important; + height: 48px; line-height: 24px !important; margin: 0 !important; + overflow: hidden; } time{ display: inline-block; font-size: 11px; margin: 4px 0; @@ -1454,15 +1527,17 @@ margin: 0 0 20px 0; text-align: center; width: 100%; img{ margin: 35px 0 0 0; + max-width: 145px; } } h2, time{ @include text-overflow(); display: block; + height: 18px; left: 50%; margin: 0 0 0 -70px !important; position: relative; width: 140px; } @@ -1509,15 +1584,17 @@ margin: 0 0 20px 0; text-align: center; width: 100%; img{ margin: 35px 0 0 0; + max-width: 145px; } } h2, time{ @include text-overflow(); display: block; + height: 18px; left: 50%; margin: 0 0 0 -70px !important; position: relative; width: 140px; } @@ -1609,11 +1686,11 @@ color: $theme-main-color; display: block; font-family: $alt-font-family-sans-serif; font-size: 17px !important; font-weight: 400 !important; - height: 20px; + height: 22px; left: auto; line-height: 22px !important; margin: 15px auto 5px !important; position: relative; right: auto; @@ -1622,12 +1699,14 @@ h3{ border-top: 1px solid $border-base; font-size: 14px; font-style: normal; font-weight: 900; + height: 45px; line-height: 17px; margin: 10px 0; + overflow: hidden; padding-top: 10px; } .post-taxonomy-tag{ @include text-overflow(); color: $alt-text-color; @@ -1721,10 +1800,16 @@ } } .iasd-widget-slider{ .owl-carousel { .slider-item { + h3 { + & + p { + height: 45px; + overflow: hidden; + } + } p { margin: 0 0 10px; } } } @@ -1766,29 +1851,50 @@ left: auto !important; right: 0; top: 0 !important; width: 200px !important; h2{ - display: inline-block; - height: auto; + height: 87px; line-height: 24px !important; padding: 15px 20px 0; white-space: normal; } p{ color: $body-bg; display: inline-block; + height: 192px; line-height: 18px !important; margin: 0; + overflow: hidden; padding: 15px 20px; } } } } } } } + .columns { + .owl-carousel { + .owl-item { + a { + h3 { + height: 62px; + } + } + } + } + } + .owl-carousel { + .slider-item { + h3 { + & + p { + height: 75px; + } + } + } + } } } @media (max-width: $screen-sm-max) { .iasd-widget-slider{ .owl-carousel{ @@ -1995,11 +2101,13 @@ a { color: $theme-main-color !important; } } a { + @include text-overflow(); color: $alt-text-color !important; + display: block; font-weight: 400 !important; height: auto !important; &:hover { border: 0 !important; } @@ -2221,11 +2329,10 @@ line-height: 30px; margin-top: -15px; position: absolute; right: 0; top: 50%; - vertical-align: middle; width: 20px; } } } } @@ -2320,6 +2427,23 @@ p{ font-size: 13px; line-height: 20px !important; } } +} + +/* ***************** */ +/* Posts List Widget */ +/* ***************** */ + +.iasd-widget-img, .iasd-widget-img_title { + img { + display: block; + height: auto; + margin-top: 35px; + max-width: 100%; + } +} + +.iasd-widget-img { + margin-top: -28px; } \ No newline at end of file