assets/css/the-events-calendar/the-events-calendar-5.scss
//Events Calendar 5.0
@import "../scss/global/variables";
@import "../scss/global/mixins";
@import "../scss/global/placeholders";
@import "the-events-calendar.scss";
%lsx-title {
font-size: 30px !important;
line-height: 1.2;
margin-bottom: 4.25rem;
margin-top: 0;
text-align: center;
&:after {
content: "";
display: block;
height: 2px;
margin: 2.4rem auto 0;
width: 80px;
}
& > small {
color: inherit;
display: block;
line-height: inherit;
margin-top: 8px;
&.long-text {
margin-top: 16px;
}
}
}
@mixin small-button() {
&,
&:active,
&:visited {
font-weight: 700;
height: initial;
@include media(">tablet") {
padding: 10px 30px !important;
}
}
}
@mixin event-colours(
$link: map-get($content, link),
$hover: map-get($header, hover)
) {
.content {
.tribe-events-header,
.tribe-events-c-events-bar {
background-color: transparent;
}
.tribe-events-header {
.tribe-events-header__breadcrumbs {
display: none;
}
}
.tribe-events {
.datepicker {
.day.active,
.month.active,
.year.active {
background: nth($blue, 1);
}
}
}
.archive.post-type-archive-tribe_events &,
.single.single-tribe_events &,
.single.single-tribe_venue &,
.single.single-tribe_organizer & {
padding-top: $lsx-medium-gap;
#primary {
margin: $lsx-gap;
}
}
.tribe-filters-open & {
#tribe_events_filters_wrapper {
@include media("<=tablet") {
position: relative;
z-index: 1;
}
@media (min-width: 767px) and (max-width: 991px) {
margin-top: $lsx-gap;
}
}
}
> .tribe-events:first-child {
margin-top: $lsx-medium-gap;
}
.tribe-events-calendar-month__mobile-events-icon--event {
background-color: nth($blue, 1);
}
.tribe-events-pro .tribe-events-pro-photo__event-featured-image {
width: 100%;
}
.tribe-events-pro-week-day-selector__day--active {
border-color: nth($blue, 1);
}
#tribe_events_filters_wrapper {
@media (min-width: 767px) {
background: #e8e5e5 !important;
}
padding: 16px !important;
.tribe-events-filters-content {
background: transparent;
border: none;
.tribe-events-filters-label {
font-weight: normal;
}
}
.tribe_events_filter_control {
button {
font-weight: normal;
&.tribe_events_filters_show_filters {
font-size: 15px;
}
}
}
#tribe_events_filters_form {
.tribe_events_filter_item {
.tribe-events-filters-group-heading {
font-weight: normal;
color: $text-color;
}
}
}
}
.tribe-events-c-top-bar__datepicker {
.tribe-events-c-top-bar__datepicker-time {
font-family: $font-family-serif;
}
}
.tribe-events,
#tribe-events-content {
> .tribe-events-l-container {
overflow: hidden;
margin-top: 0;
padding-top: 0;
padding-left: 15px;
padding-right: 15px;
padding-bottom: $lsx-medium-gap;
}
.tribe-common {
img {
width: 100%;
}
}
.tribe-events-c-nav {
border-top: 0;
}
.tribe-common-anchor-alt,
a:hover,
a:focus,
a:active,
a:visited {
@include lsx-link-colour($link, $hover);
border-bottom: none;
}
.tribe-common-c-btn,
.tribe-events-c-ical__link,
.tribe-events-button {
@include lsx-button-scaffolding();
@include lsx-button-colour();
@include small-button();
font-family: $font-family-sans-serif;
font-weight: 600;
}
.tribe-common-svgicon--featured {
display: none;
}
.tribe-events-c-messages__message {
margin-top: $lsx-gap;
}
#tribe-events-search-filters-container {
#tribe-events-events-bar-search {
.tribe-events-c-search__button {
margin-right: 2px;
}
}
}
.tribe-events-c-view-selector {
background-color: white;
}
.tribe-events-calendar-month__header-column-title-desktop {
color: black;
}
.tribe-events-calendar-month__day--current {
.tribe-events-calendar-month__day-date,
.tribe-events-calendar-month__day-date-link {
@include lsx-link-colour($link);
}
}
.tribe-events-calendar-list__event-datetime-featured-text {
@include lsx-link-colour($link);
}
.tribe-events-calendar-list__event-row--featured
.tribe-events-calendar-list__event-date-tag-datetime:after,
.tribe-events-calendar-month__calendar-event--featured:before,
.tribe-events-calendar-month__day-cell--selected,
.tribe-events-calendar-month__multiday-event-bar {
background-color: nth($blue, 1);
}
.tribe-events-calendar-month__multiday-event-hidden-title,
.tribe-events-calendar-month__multiday-event-bar-title,
.tribe-events-calendar-month__day-cell--selected
h3.tribe-common-h6 {
color: white;
}
.tribe-events-calendar-month__day {
background-color: white;
.tribe-events-calendar-month__day-cell {
.tribe-events-calendar-month__day-date,
.tribe-events-calendar-month__calendar-event-details
.tribe-events-calendar-month__calendar-event-title-link {
color: #222222;
}
}
}
.tribe-events-calendar-list__event,
.tribe-events-pro-photo__event {
.tribe-events-calendar-list__event-details,
.tribe-events-pro-photo__event-details-wrapper {
.tribe-events-calendar-list__event-title a,
.tribe-events-pro-photo__event-title a {
color: black;
font-family: $font-family-serif;
font-size: 24px;
line-height: 31px;
font-weight: 300;
&:hover {
color: nth($blue, 1);
}
}
.tribe-events-calendar-list__event-venue span {
color: $text-color;
font-weight: normal;
}
}
.tribe-events-pro-photo__event-featured-image-wrapper {
margin-bottom: 0;
}
.tribe-events-pro-photo__event-details-wrapper {
background-color: white;
padding: 16px 10px;
}
.tribe-events-pro-photo__event-datetime-featured-text {
color: nth($blue, 1);
}
}
.tribe-events-c-nav__list-item {
.tribe-events-c-nav__next-label,
.tribe-events-c-nav__prev-label {
@include lsx-link-colour($link, $hover);
}
.tribe-events-c-nav__next-label {
opacity: 0.7;
}
}
}
.tribe-events-pro {
&.tribe-events-view--week {
.tribe-events-pro-week-grid {
margin-top: $lsx-large-gap;
}
.tribe-events-pro-week-grid__header-column--current {
.tribe-events-pro-week-grid__header-column-daynum {
color: nth($blue, 1);
}
}
.tribe-events-pro-week-grid__events-day {
background: white;
}
.tribe-events-pro-week-grid__event-link-inner {
background-color: $light-gray;
}
}
.tribe-events-pro-map__event-datetime-featured-text {
color: nth($blue, 1);
}
.tribe-events-pro-map__event-actions a {
color: $text-color !important;
border-bottom: 1px solid $text-color;
&:hover {
color: nth($blue, 1) !important;
}
}
.tribe-events-pro-map__event-card-wrapper,
.tribe-events-pro-map__nav {
background-color: white;
}
.tribe-events-pro-map__event-card-wrapper--active {
.tribe-events-pro-map__event-card-button {
border-color: nth($blue, 1);
}
}
}
.single.single-tribe_events & {
#primary {
#tribe-events-content {
.tribe-events-schedule {
display: none;
}
.tribe-events-related-events-title {
@extend %lsx-title;
}
.tribe-related-events {
margin-bottom: $lsx-gap;
li {
border: none;
background: white;
@include media("<=tablet") {
display: flex;
flex-direction: column;
> * {
width: 100%;
}
}
.tribe-related-event-info {
padding: 20px 25px;
.tribe-related-events-title a {
color: $text-color;
font-size: 20px;
line-height: 25px;
}
.moretag {
@include lsx-button-scaffolding();
@include lsx-button-colour();
@include small-button();
font-family: $font-family-sans-serif;
display: block !important;
margin-top: $lsx-gap;
text-align: center;
}
}
}
}
#comments {
margin-top: $lsx-gap;
}
}
}
}
}
.tribe-events-calendar-month__calendar-event-tooltip-title a {
font-family: $font-family-serif;
font-size: 18px;
color: $text-color;
line-height: 23px;
&:hover {
color: nth($blue, 1);
}
}
}
@include event-colours();