@import "mixins"; @import "icons"; @primary: #999999; /* Primary colour for buttons (alt) */ @primarytext: desaturate(lighten(@primary,50%),18%); /* Text on primary colour bg */ @secondary: desaturate(lighten(@primary,40%),18%); /* Secondary buttons */ @secondarytext: desaturate(darken(@secondary,60%),18%); /* Text on secondary colour bg */ @highlight: spin( @primary, 150 ); /* Prices, In stock labels, sales flash */ @highlightext: desaturate(lighten(@highlight,50%),18%); /* Text on highlight colour bg */ @contentbg: #fff; /* Content BG - Tabs (active state) */ @subtext: #777; /* small, breadcrumbs etc */ .display-icon { display: inline-block; width: 16px; height: 16px; -webkit-font-smoothing: antialiased; font-size: 16px; font-family: "event-manager" !important; text-decoration: none; font-weight: normal; font-style: normal; vertical-align: top; font-size: 16px; margin: 0 2px 0 0; *overflow: auto; *zoom: 1; *display: inline; } /* =Global styles/layout -------------------------------------------------------------- */ .event-manager-message, .event-manager-error, .event-manager-info { padding: 1em 2em 1em 3.5em !important; margin: 0 0 2em !important; position: relative; background-color: lighten(@secondary,5%); color: $secondarytext; border-top: 3px solid @primary; list-style: none outside !important; width: auto; .clearfix; box-shadow: 0 1px 1px rgba(0,0,0,0.2); &:before { content: ""; font-family: sans-serif; display: inline-block; position: absolute; top: 1em; left: 1.5em; } li { list-style: none outside !important; padding-left: 0 !important; margin-left: 0 !important; } &.event-manager-message { border-top-color: #8fae1b; &:before { color:#8fae1b; content: "\2713"; } } &.event-manager-info { border-top-color: #1e85be; &:before { color:#1e85be; content: "i"; font-family: Times, Georgia, serif; font-style: italic; } } &.event-manager-error { border-top-color: #b81c23; &:before { color:#b81c23; content: "\00d7"; font-weight: 700; } } } .event-manager-form { fieldset { margin: 0 0 1em 0; padding: 0 0 1em 0; line-height: 2em; border: 0; border-bottom: 1px solid #eee; .clearfix; label { display: block; margin: 0; width: 29%; float: left; vertical-align: middle; small { opacity: .75; font-size: 0.83em; } } div.field { width: 70%; float: right; vertical-align: middle; } .wp-editor-container { border: 1px solid #ccc; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .account-sign-in { .button { margin-right: .5em; &:before { .display-icon; content: '\e808'; } } } abbr.required { color: red; font-weight: bold; border: 0; } input.input-text, textarea, select { margin: 0; vertical-align: middle; width: 100%; -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */ -moz-box-sizing: border-box; /* Firefox, other Gecko */ box-sizing: border-box; /* Opera/IE 8+ */ } small.description { opacity: .75; font-size: 0.83em; margin: 1.2em 0 0 0; display: block; line-height: 1.2em; } .event-manager-uploaded-files { display: table; .event-manager-uploaded-file { line-height: 2em; font-style: italic; margin-bottom: 1em; display: block; .event-manager-uploaded-file-preview { img { height: 64px; margin: 0; vertical-align: top; } a { line-height: 64px; display: inline-block; padding: 0 0 0 1em; } } .event-manager-uploaded-file-name { display: block; } } } } .submit-event { padding: 1em 0; } .event-manager-term-checklist { list-style: none outside; max-height: 200px; overflow: auto; margin: 0; li { list-style: none outside; margin: 0; display: block; float: none; label { width: auto; float: none; } li { margin: 0 0 0 2em; } } } } div.event_listings { margin-bottom: 1em; ul.event_listings { margin: 0; } } .rp4wp-related-event_listing > ul, ul.event_listings { padding: 0; margin: 0; border-top: 1px solid #eee; &.loading { min-height: 96px; border-bottom: 1px solid #eee; background: url(../images/ajax-loader.gif) no-repeat center 32px; } li.event_listing, li.no_event_listings_found { list-style: none outside; padding: 0; margin: 0; border-bottom: 1px solid #eee; &.event_cancelled { a { opacity: 0.25; } } &.no_event_listings_found { padding: 1em; border-bottom: 1px solid #eee; } a { display: block; padding: 1em 1em 1em 2em; border: 0; overflow: hidden; zoom: 1; position: relative; line-height: 1.5em; text-decoration: none; &:hover, &:focus { background-color: #fcfcfc; } img.organizer_logo { width: 42px; height: 42px; position: absolute; left: 1em; float: left; margin-right: 1em; vertical-align: middle; box-shadow: none; } div.position, div.location, ul.meta { -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */ -moz-box-sizing: border-box; /* Firefox, other Gecko */ box-sizing: border-box; /* Opera/IE 8+ */ } div.position { float: left; width: 55%; padding: 0 0 0 42px; line-height: 1.5em; h3 { margin: 0; padding: 0; line-height: inherit; font-size: inherit; } .organizer { color: #999; .tagline { margin-left: .5em; } } } div.location { float: left; text-align: left; width: 25%; padding: 0 0 0 1em; color: #999; line-height: 1.5em; } .meta { float: right; text-align: right; width: 20%; padding: 0 0 0 1em; margin: 0; line-height: 1.5em; color: #999; list-style: none outside; li { list-style: none outside; display: block; margin: 0; } .event-type { font-weight: bold; } } } &.event_featured { a { background: #fefee5; &:hover, &:focus { background-color: #fefed8; } } } } } .widget { ul.event_listings { li.event_listing { a { padding: 1em 0; } .position { float: none; width: auto; padding: 0; } ul.meta { float: none; width: auto; padding: 0; margin: 0; text-align: left; li { float: none; display: inline; padding: 0; margin: 0 .5em 0 0; font-weight: normal; &:after { padding: 0 0 0 .5em; content: "\2023"; } &:last-child:after { content: ''; } } } } } } .event-manager, .event_listing, .event-types { .event-type { color: #555; } } .single_event_listing { .organizer { position: relative; border: 1px solid #eee; padding: 1em; margin: 0 0 2em; display: block; clear: both; min-height: 3em; box-shadow: 0 1px 1px rgba(0,0,0,0.1); img { width: 3em; height: 3em; position: absolute; left: 1em; float: left; vertical-align: middle; box-shadow: none; } .name { margin: 0 0 0 3em; padding: 0 0 0 1em; line-height: 1.5em; a { float: right; margin-left: 1em; } } .tagline { display: block; margin: 0 0 0 42px; padding: 0 0 0 1em; line-height: 1.5em; font-style: italic; color: #999; } .website:before { .display-icon; content: '\e809'; } .organizer_twitter:before { .display-icon; content: '\e80a'; } .organizer_video { border-top: 1px solid #eee; padding: 1em 0 0; margin: 1em 0 0 0; position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; iframe, object, embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0; display: block; } } } .meta { list-style: none outside; padding: 0; margin: 0 0 1.5em; overflow: hidden; zoom: 1; clear: both; li { margin: 0 1em 0 0; padding: .5em; float: left; line-height: 1em; color: #999; } .event-type { color: #fff; background-color: @part-time; } .event-cancelled, .listing-expired { color: #b81c23; } .location:before { .display-icon; content: '\e81d'; } .date-posted:before { .display-icon; content: '\e80f'; } .event-cancelled:before, .listing-expired:before { .display-icon; content: '\e80e'; } } } .event-manager-registration-wrapper { clear: both; border: 1px solid #eee; padding: .75em 1em 0; margin: 1em 0; line-height: 1.5em; display: block; position: relative; box-shadow: 0 1px 1px rgba(0,0,0,0.1); } .single_event_listing, .event-manager-registration-wrapper { .registration { padding: 0; margin: 0 0 1em; overflow: hidden; .registration_button, .registration_details { -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */ -moz-box-sizing: border-box; /* Firefox, other Gecko */ box-sizing: border-box; /* Opera/IE 8+ */ } .registration_button { text-align: center; font-size: 1.1em; line-height: 1em; display: inline-block; margin: 0 .5em 0 0; padding: 1/1.1em 2em; outline: 0; } .registration_details { clear: both; border: 1px solid #eee; padding: .75em 1em 0; margin: 1em 0; line-height: 1.5em; display: block; position: relative; box-shadow: 0 1px 1px rgba(0,0,0,0.1); p { margin: 0 0 .75em; } &:before { content: ""; position: absolute; margin: -10px 0 0 0; top: 0; left: 5em; width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom:10px solid #eee; } &:after { content: ""; position: absolute; margin: -9px 0 0 1px; left: 5em; top: 0; width: 0; height: 0; border-left: 9px solid transparent; border-right: 9px solid transparent; border-bottom: 9px solid #fff; } } } } .event_filters { background: #eee; .clearfix; .search_events { padding: 1em; .clearfix; div { -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */ -moz-box-sizing: border-box; /* Firefox, other Gecko */ box-sizing: border-box; /* Opera/IE 8+ */ label { display: none; } &.search_keywords, &.filter_first { float: left; padding-right: .5em; width: 50%; } &.search_location, &.filter_last { float: right; padding-left: .5em; width: 50%; } &.search_categories, &.filter_wide { padding-top: .5em; clear: both; width: 100%; } .showing_applied_filters { a { padding: .25em; } a.active { background: #ddd; text-decoration: none; } } } input, select { -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */ -moz-box-sizing: border-box; /* Firefox, other Gecko */ box-sizing: border-box; /* Opera/IE 8+ */ width: 100%; } } .event_types { list-style: none outside; margin: 0; padding: 0; font-size: 0.83em; background: #f9f9f9; border-top: 1px solid #e5e5e5; .clearfix; li { margin: 0; padding: .5em 1em; float: left; border-right: 1px solid #eee; &:last-child { border-right: 0; } } } .showing_applied_filters { padding: .5em 1em; display: none; font-size: 0.83em; background: #f9f9f9; border-top: 1px solid #e5e5e5; a { float: right; padding-left: 10px; border: 0; } } } div.event_listings { .event-manager-pagination { text-align: center; display: block; padding: 1em 0 1em 0; border-bottom: 1px solid #eee; line-height: 1; } .load_previous { border-top: 1px solid #eee; } .load_more_events + ul.event_listings { border-top: 0; } .load_more_events { text-align: center; display: block; padding: 1em 1em 1em 2em; border-bottom: 1px solid #eee; font-weight: bold; &.loading { background: url(../images/ajax-loader.gif) no-repeat center; strong { visibility: hidden; } } &:hover, &:focus { background-color: #fcfcfc; border-bottom: 1px solid #eee; } } } .event_listing_preview { padding: 0 1em 1em; border: 5px solid #eee; } .event_listing_preview_title, .entry-content .event_listing_preview_title { padding: .5em 1em; vertical-align: middle; position: relative; background: #eee; h2 { margin: 0; clear: none; } .button { float: right; margin-left: .25em; } } .event_summary_shortcode { border: 1px solid #ccc; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; text-align: center; position: relative; box-shadow: 0 2px 4px rgba(0,0,0,0.1),inset 0 1px 0 rgba(255,255,255,0.4); -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */ -moz-box-sizing: border-box; /* Firefox, other Gecko */ box-sizing: border-box; /* Opera/IE 8+ */ &.aligncenter { display: block; margin: 2em auto 2em; } &.alignleft { float: left; margin: 0 2em 2em 0; } &.alignright { float: right; margin: 0 0 2em 2em; } a { text-decoration: none; color: inherit; } img { margin: 0; padding: 0; display: block; width: 100%; -moz-border-radius: 0; -webkit-border-radius: 0; -moz-border-top-left-radius: 3px; -moz-border-top-right-radius: 3px; -webkit-border-top-left-radius: 3px; -webkit-border-top-right-radius: 3px; border-radius: 0; border-top-left-radius: 3px; border-top-right-radius: 3px; box-shadow: inset 0 1px 0 rgba(255,255,255,0.4); } .event_summary_content { padding: 0 1em; } .meta { font-style: italic; color: #777; } .event-type { -moz-border-radius: 1em; -webkit-border-radius: 1em; border-radius: 1em; color: #fff; text-shadow: 0 1px 0 rgba(255,255,255,0.5); box-shadow: 0 2px 4px rgba(0,0,0,0.1), inset 0 1px 0 rgba(255,255,255,0.4); position: absolute; top: 0; right: 0; padding: .5em; height: 1em; width: auto; min-width: 1em; font-size: 1em; text-align: center; vertical-align: middle; line-height: 1em; margin: -.5em -.5em 0 0; } } #event-manager-event-dashboard { .account-sign-in { .button { margin-right: .5em; &:before { .display-icon; content: '\e808'; } } } table { ul.event-dashboard-actions { margin: 0; padding:0; visibility: hidden; font-size: 0.92em; li { float: none; display: inline; padding: 0; margin: 0 .5em 0 0; font-weight: normal; list-style: none outside; &:after { padding: 0 0 0 .5em; content: "\2023"; } &:last-child:after { content: ''; } .event-dashboard-action-delete { color: red; } } } tr:hover, tr:focus { ul.event-dashboard-actions { visibility: visible; } } td, th { padding: .5em 1em .5em 0; } .event_title small { color: #999; } .cancelled, .expires, .applications { text-align: center; } } } nav.event-manager-pagination, #content nav.event-manager-pagination { text-align: center; ul { display: inline-block; white-space: nowrap; padding:0; clear: both; border-left: 1px solid #eee; margin: 1px; li { border-right: 1px solid #eee; border-top: 1px solid #eee; border-bottom: 1px solid #eee; padding: 0; margin: 0; float: left; display: inline; overflow: hidden; a, span { margin: 0; text-decoration: none; padding: 0; line-height: 1em; font-size: 1em; font-weight: normal; padding: .5em; min-width: 1em; display: block; border: 0; } span.current, a:hover, a:focus { background: #eee; color: darken( #eee, 40 ); } } } } /** * Mobile styles */ @media only screen and (max-width: 767px) { ul.event_listings { li.event_listing, li.no_event_listings_found { a { padding: 1em; img.organizer_logo { visibility: hidden; } div.position { float: left; width: 60%; padding: 0; } div.location { float: right; width: 40%; line-height: 2em; font-size: .75em; padding: 0 0 0 1em; text-align: right; } .meta { float: right; width: 40%; line-height: 2em; font-size: .75em; li { font-size: 1em; } } } } } } // Chosen fixes .chosen-container { width: 100% !important; } // Default theme fixes .twenty-eleven { ul.event_listings { li.event_listing, li.no_event_listings_found { padding: 0 !important; } } } .twenty-ten { .event_types, .chosen-choices { margin: 0 !important; } } .rtl { .event-manager-form { label { float: right; } div.field { float: left; } } .event_listing_preview_title, .entry-content .event_listing_preview_title { .button { float: left; } } .single_event_listing { .meta { li { float: right; margin: 0 0 0 1em; } } } }