Helix_Website/wp-content/plugins/wp-event-manager/assets/css/frontend.less

909 lines
17 KiB
Plaintext

@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;
}
}
}
}