Working on a bunch of new changes
This commit is contained in:
Godwin
@@ -1,49 +1,8 @@
|
||||
/*
|
||||
*
|
||||
*/
|
||||
//@include fontface('AlteHaasGroteskBold', '/assets/AlteHaasGroteskBold', 'alte_haas_groteskbold', ttf, normal, bold);
|
||||
|
||||
/*
|
||||
* This is a manifest file that'll be compiled into application.css, which will include all the files
|
||||
* listed below.
|
||||
*
|
||||
* Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
|
||||
* or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
|
||||
*
|
||||
* You're free to add application-wide styles to this file and they'll appear at the top of the
|
||||
* compiled file, but it's generally better to create a new file per style scope.
|
||||
*
|
||||
*/
|
||||
//body {
|
||||
// font-family: 'AlteHaasGroteskBold';
|
||||
//}
|
||||
|
||||
@font-face {
|
||||
font-family: 'FontAwesome';
|
||||
src: url('/assets/fontawesome-webfont.eot');
|
||||
src: url('/assets/fontawesome-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('/assets/fontawesome-webfont.woff') format('woff'),
|
||||
url('/assets/fontawesome-webfont.ttf') format('truetype'),
|
||||
url('/assets/fontawesome-webfont.svg#alte_haas_groteskbold') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'AlteHaasGroteskBold';
|
||||
src: url('/assets/AlteHaasGroteskBold.eot');
|
||||
src: url('/assets/AlteHaasGroteskBold.eot?#iefix') format('embedded-opentype'),
|
||||
url('/assets/AlteHaasGroteskBold.woff') format('woff'),
|
||||
url('/assets/AlteHaasGroteskBold.ttf') format('truetype'),
|
||||
url('/assets/AlteHaasGroteskBold.svg#alte_haas_groteskbold') format('svg');
|
||||
font-weight: bold;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
// Libraries
|
||||
@import "compass";
|
||||
//@import "font-awesome";
|
||||
@import "foundation_and_overrides";
|
||||
|
||||
// Local settings (also edit foundation_and_overrides.scss to modify global variables)
|
||||
@import "sass/mixins";
|
||||
@import "sass/froala_editor";
|
||||
@import "sass/layout";
|
||||
@import "sass/typography";
|
||||
@import "sass/base";
|
||||
//@include breakpoint(medium-only) {
|
||||
//}
|
||||
|
||||
@@ -1,3 +0,0 @@
|
||||
// Place all the styles related to the event_types controller here.
|
||||
// They will automatically be included in application.css.
|
||||
// You can use Sass (SCSS) here: http://sass-lang.com/
|
||||
@@ -1,3 +0,0 @@
|
||||
// Place all the styles related to the events controller here.
|
||||
// They will automatically be included in application.css.
|
||||
// You can use Sass (SCSS) here: http://sass-lang.com/
|
||||
@@ -1,3 +0,0 @@
|
||||
// Place all the styles related to the Oauths controller here.
|
||||
// They will automatically be included in application.css.
|
||||
// You can use Sass (SCSS) here: http://sass-lang.com/
|
||||
@@ -1,510 +0,0 @@
|
||||
table#translations {
|
||||
table-layout: fixed;
|
||||
padding: 0;
|
||||
|
||||
.key, .pages {
|
||||
width: 25%;
|
||||
overflow: hidden;
|
||||
|
||||
&:hover {
|
||||
overflow: visible;
|
||||
}
|
||||
}
|
||||
|
||||
.pages {
|
||||
position: relative;
|
||||
|
||||
ul {
|
||||
font-size: 1em;
|
||||
margin: 0;
|
||||
list-style: none;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
a {
|
||||
display: block;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
ul {
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
a {
|
||||
background-color: $white;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
td.value {
|
||||
position: relative;
|
||||
cursor: text;
|
||||
|
||||
&:hover,
|
||||
.translation-form {
|
||||
color: $white;
|
||||
background-color: $body-font-color;
|
||||
}
|
||||
}
|
||||
|
||||
.not-exists {
|
||||
td.value {
|
||||
font-style: italic;
|
||||
color: lighten($body-font-color, 45);
|
||||
}
|
||||
}
|
||||
|
||||
.translation-form {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 10;
|
||||
padding: inherit;
|
||||
|
||||
textarea {
|
||||
height: 100%;
|
||||
font-size: inherit;
|
||||
padding: 0;
|
||||
color: inherit;
|
||||
background-color: inherit;
|
||||
}
|
||||
|
||||
button {
|
||||
right: 100%;
|
||||
position: absolute;
|
||||
border-radius: 0;
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.auto-translate {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
.grid.links {
|
||||
&.inactive li > a {
|
||||
opacity: 0.75;
|
||||
}
|
||||
|
||||
li > a {
|
||||
display: block;
|
||||
background-color: $color-5;
|
||||
color: $white;
|
||||
padding: 1em;
|
||||
min-height: 7em;
|
||||
|
||||
&.complete {
|
||||
background-color: $color-2;
|
||||
}
|
||||
|
||||
&.needs-work {
|
||||
background-color: $color-4;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: $color-1;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
h3 {
|
||||
color: inherit;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ul.tags,
|
||||
.tags > ul {
|
||||
display: inline;
|
||||
list-style: none;
|
||||
font-size: 0.9em;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.tags {
|
||||
li {
|
||||
display: inline-block;
|
||||
background-color: $black;
|
||||
color: $white;
|
||||
padding: 0 0.5em;
|
||||
margin: 0.6em 0 0 0.3em;
|
||||
}
|
||||
h5 {
|
||||
float: left;
|
||||
color: lighten($body-font-color, 10);
|
||||
}
|
||||
}
|
||||
|
||||
.org-preview {
|
||||
/*display: block;
|
||||
position: relative;
|
||||
margin: 3em 0 0;
|
||||
background-color: $organization-color;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
|
||||
/*&:before {
|
||||
content: '';
|
||||
display: block;
|
||||
padding-top: 50%;
|
||||
}*/
|
||||
|
||||
/*figcaption {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
a {
|
||||
display: block;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
h3 {
|
||||
position: absolute;
|
||||
bottom: 100%;
|
||||
height: 2em;
|
||||
width: 100%;
|
||||
background-color: $organization-color;
|
||||
margin: 0;
|
||||
font-size: 1em;
|
||||
padding: 0.25em 0.5em;
|
||||
}
|
||||
|
||||
img {
|
||||
background-color: $white;
|
||||
margin: auto;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
}*/
|
||||
}
|
||||
|
||||
.preview-list {
|
||||
li {
|
||||
position: relative;
|
||||
margin-bottom: 1em;
|
||||
|
||||
&:before {
|
||||
content: '';
|
||||
display: block;
|
||||
padding-top: 50%;
|
||||
}
|
||||
|
||||
h4, h5 {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
min-height: 2em;
|
||||
margin: 0;
|
||||
font-size: 1em;
|
||||
padding: 0.25em 0.5em;
|
||||
color: $white;
|
||||
//width: 100%;
|
||||
z-index: 1;
|
||||
left: 0;//.6667em;
|
||||
right: 0;//.6667em;
|
||||
}
|
||||
|
||||
h5 {
|
||||
left: 0.6667em;
|
||||
right: 0.6667em;
|
||||
}
|
||||
|
||||
figure {
|
||||
position: absolute;
|
||||
//width: 100%;
|
||||
height: 100%;
|
||||
left: 0.6667em;
|
||||
right: 0.6667em;
|
||||
margin: 0;
|
||||
bottom: 0;
|
||||
text-align: center;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
background-blend-mode: luminosity;
|
||||
@include single-transition(all, 100ms, ease-in);
|
||||
|
||||
&:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background-color: $white;
|
||||
opacity: 0.5;
|
||||
@include single-transition(all, 100ms, ease-in);
|
||||
}
|
||||
|
||||
img {
|
||||
margin: auto;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 2em;
|
||||
bottom: 0;
|
||||
max-width: 90%;
|
||||
max-height: 66.667%;
|
||||
z-index: 1;
|
||||
-webkit-transform: translate3d(0,0,0);
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
&:hover {
|
||||
figure {
|
||||
background-color: transparent;
|
||||
|
||||
&:after {
|
||||
opacity: 0.25;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.city figure {
|
||||
background-color: rgba($primary-color, 0.75);
|
||||
|
||||
&:after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.org-list li {
|
||||
h4 {
|
||||
background-color: $primary-color;
|
||||
}
|
||||
|
||||
h5 {
|
||||
background-color: $organization-color;
|
||||
}
|
||||
|
||||
figure {
|
||||
background-color: $organization-color;
|
||||
}
|
||||
}
|
||||
|
||||
&.conference-list li {
|
||||
h4 {
|
||||
background-color: $secondary-color;
|
||||
}
|
||||
|
||||
h5 {
|
||||
background-color: $conference-color;
|
||||
}
|
||||
|
||||
figure {
|
||||
background-color: $conference-color;
|
||||
}
|
||||
}
|
||||
|
||||
li.city figure {
|
||||
background-color: rgba($primary-color, 0.75);
|
||||
|
||||
&:after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@include breakpoint(medium) {
|
||||
margin-left: 3em;
|
||||
|
||||
aside & {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.org-mini-preview {
|
||||
position: relative;
|
||||
overflow: auto;
|
||||
margin: 0;
|
||||
background-color: $gray;
|
||||
border: 0.25em solid lighten($black, 33);
|
||||
|
||||
&.portrait {
|
||||
img {
|
||||
float: left;
|
||||
max-width: 50%;
|
||||
}
|
||||
|
||||
figcaption {
|
||||
float: right;
|
||||
max-width: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 0.9em;
|
||||
line-height: 1.25em;
|
||||
}
|
||||
|
||||
figcaption {
|
||||
padding: 0.25em
|
||||
}
|
||||
}
|
||||
|
||||
.org-list-select {
|
||||
|
||||
&.chosen {
|
||||
display: none;
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
overflow: auto;
|
||||
height: 25em;
|
||||
border: 0.25em solid $gray;
|
||||
}
|
||||
|
||||
li {
|
||||
background-color: lighten($gray, 5);//rgba(225, 225, 225, 0.5);
|
||||
margin: 0.25em;
|
||||
|
||||
&:hover {
|
||||
background-color: lighten($color-4, 25);//desaturate(lighten($organization-color, 33), 33);
|
||||
}
|
||||
|
||||
&.removable:hover {
|
||||
background-color: desaturate(lighten($color-3, 16), 16);
|
||||
}
|
||||
|
||||
&.selected {
|
||||
background-color: desaturate(lighten($organization-color, 33), 33);
|
||||
}
|
||||
|
||||
&.not-found {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
figure {
|
||||
margin: 0;
|
||||
padding: 0.25em;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
img {
|
||||
float: left;
|
||||
margin-right: 1em;
|
||||
}
|
||||
|
||||
h6 {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 0.8em;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
figcaption {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
@include breakpoint(medium) {
|
||||
&.chosen {
|
||||
display: block;
|
||||
}
|
||||
|
||||
&.choose {
|
||||
li.selected {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#org-filter {
|
||||
width: 100%;
|
||||
font-size: 1.25em;
|
||||
padding: 0.333em;
|
||||
border: 3px solid $gray;
|
||||
margin-top: 0.5em;
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
#register-dlg {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: transparent;
|
||||
visibility: hidden;
|
||||
z-index: 100;
|
||||
@include text-shadow(none);
|
||||
@include transition(background-color 250ms ease-in-out 125ms, visibility 0 linear 250ms);
|
||||
|
||||
form {
|
||||
position: fixed;
|
||||
min-width: 30em;
|
||||
left: 110%;
|
||||
right: 0;
|
||||
max-width: 30em;
|
||||
bottom: 0;
|
||||
margin: auto;
|
||||
top: 0;
|
||||
background-color: $white;
|
||||
height: 10em;
|
||||
padding: 1em;
|
||||
z-index: 101;
|
||||
@include transform(skewX(-30deg));
|
||||
@include transition(all 250ms ease-in-out 0);
|
||||
}
|
||||
|
||||
&.open {
|
||||
background-color: rgba($primary-color, 0.8);
|
||||
visibility: visible;
|
||||
@include transition(background-color 250ms ease-in-out);
|
||||
|
||||
form {
|
||||
left: 0;
|
||||
@include transform(skewX(0));
|
||||
@include transition(all 250ms ease-in-out 125ms);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@include breakpoint(medium) {
|
||||
.organizations-index,
|
||||
.conferences-index {
|
||||
#content {
|
||||
h2 {
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
h3 {
|
||||
margin-left: 1em;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.workshop {
|
||||
list-style: none;
|
||||
overflow: auto;
|
||||
|
||||
&:target {
|
||||
background-color: $color-5;
|
||||
}
|
||||
}
|
||||
|
||||
.registrations .user {
|
||||
vertical-align: top;
|
||||
|
||||
&:target {
|
||||
background-color: $color-5;
|
||||
}
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@@ -1,11 +0,0 @@
|
||||
@mixin breakpoint($query) {
|
||||
@if $query == small {
|
||||
@media #{$small-only} { @content; }
|
||||
} @else if $query == medium {
|
||||
@media #{$medium-up} { @content; }
|
||||
} @else if $query == large {
|
||||
@media #{$large-up} { @content; }
|
||||
} @else {
|
||||
@media #{$query} { @content; }
|
||||
}
|
||||
}
|
||||
@@ -1,656 +0,0 @@
|
||||
/**
|
||||
|
||||
Basic theme rules, html native elements only
|
||||
|
||||
*/
|
||||
|
||||
//$translate-me-bgcolor: rgba(255, 0, 0, 0.25) !default;
|
||||
//$translate-me-outline-color: rgba(255, 0, 0, 0.5) !default;
|
||||
|
||||
.button, button, input[type="file"] {
|
||||
/*background-color: rgba($white, 0.5);
|
||||
color: $primary-color;
|
||||
border: 1px solid;
|
||||
padding: 0.75em 1.5em;
|
||||
text-transform: uppercase;
|
||||
text-shadow: none;
|
||||
|
||||
&:hover {
|
||||
color: #FFF;
|
||||
}*/
|
||||
|
||||
background-color: $primary-color;
|
||||
color: $white;
|
||||
font-weight: bold;
|
||||
//font-family: $header-font-family;
|
||||
font-size: 1.333em;
|
||||
border: 0.15em solid transparent;
|
||||
padding: 0.5em 1em;
|
||||
vertical-align: middle;
|
||||
|
||||
&.organization, &.secondary, &.best {
|
||||
background-color: $organization-color;
|
||||
}
|
||||
|
||||
&.article, &.good {
|
||||
background-color: $article-color;
|
||||
}
|
||||
|
||||
&.better {
|
||||
background-color: darken($warning-color, 2);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: $primary-color;
|
||||
border: 0.15em solid;
|
||||
background-color: transparent;
|
||||
|
||||
&.organization, &.secondary, &.best {
|
||||
color: $organization-color;
|
||||
}
|
||||
|
||||
&.better {
|
||||
color: darken($warning-color, 2);
|
||||
}
|
||||
|
||||
&.article, &.good {
|
||||
color: $article-color;
|
||||
}
|
||||
}
|
||||
|
||||
&[id*="previous"],
|
||||
&.less,
|
||||
&.arrow-l {
|
||||
&:before {
|
||||
content: '\f053';
|
||||
font-family: $icons;
|
||||
vertical-align: middle;
|
||||
margin-right: 0.25em;
|
||||
}
|
||||
}
|
||||
|
||||
&[id*="next"],
|
||||
&.more,
|
||||
&.arrow-r {
|
||||
&:after {
|
||||
content: '\f054';
|
||||
font-family: $icons;
|
||||
vertical-align: middle;
|
||||
margin-left: 0.25em;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
input[type="file"] {
|
||||
display: none;/*inline-block;
|
||||
width: auto;
|
||||
text-align: center;
|
||||
-webkit-appearance: none;
|
||||
background-color: #FFF;
|
||||
border-radius: 1.5em;
|
||||
padding: 0.6em 0;
|
||||
cursor: pointer;
|
||||
font-family: $button-font-family;
|
||||
outline: none;
|
||||
|
||||
&:hover {
|
||||
background-color: $primary-color;
|
||||
}
|
||||
|
||||
&::-webkit-file-upload-button {
|
||||
visibility: none;
|
||||
opacity: 0;
|
||||
width: 0;
|
||||
}*/
|
||||
}
|
||||
|
||||
input[type="date"] {
|
||||
&:invalid {
|
||||
color: #CCC;
|
||||
}
|
||||
}
|
||||
|
||||
h2 {
|
||||
line-height: 1em;
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
select {
|
||||
border: 1px solid #CCC;
|
||||
border-radius: 0.2em;
|
||||
font-size: 1.25em;
|
||||
font-family: $body-font-family;
|
||||
color: rgba($black, 0.75);
|
||||
padding: 0 0.5em;
|
||||
height: 2em;
|
||||
box-shadow: 0 2px #CCC;
|
||||
outline: 0;
|
||||
background-color: #FFF;
|
||||
|
||||
&.small {
|
||||
font-size: 0.8em;
|
||||
margin: 0 0 0.25em;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
fieldset {
|
||||
background-color: #FFF;
|
||||
|
||||
legend {
|
||||
margin-left: -2em;
|
||||
font-family: $header-font-family;
|
||||
}
|
||||
}
|
||||
|
||||
.field {
|
||||
margin-bottom: 1em;
|
||||
position: relative;
|
||||
//border: 1px solid #CCC;
|
||||
//border-radius: 1.25em 0 0 1.25em;
|
||||
//overflow: hidden;
|
||||
|
||||
label {
|
||||
//float: left;
|
||||
font-family: $header-font-family;
|
||||
line-height: 2.5em;
|
||||
//margin-right: 1em;
|
||||
//background-color: rgba(#FFF, 0.2);
|
||||
//color: $white;
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
margin: -1.333em 1.75em 0;
|
||||
|
||||
span {
|
||||
padding: 0 1em;
|
||||
font-size: 0.9em;
|
||||
}
|
||||
}
|
||||
div {
|
||||
//border: 1px solid #EEE;
|
||||
//border-width: 1px 0 0 1px;
|
||||
}
|
||||
input, select, button {
|
||||
//margin: 0;
|
||||
height: auto;
|
||||
line-height: 1em;
|
||||
padding: 0.333em 0.5em;
|
||||
}
|
||||
|
||||
input:not([type="file"]) {
|
||||
border-bottom: 1px dashed #CCC;
|
||||
line-height: 1.25em;
|
||||
}
|
||||
|
||||
textarea {
|
||||
border: 1px dashed #CCC;
|
||||
height: 10em;
|
||||
font-size: 1.25em;
|
||||
}
|
||||
|
||||
&.text-area-field {
|
||||
label {
|
||||
/*top: 1px;
|
||||
right: 1px;
|
||||
bottom: 1px;
|
||||
left: 1px;
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background-color: rgba(255, 255, 255, 0.5);
|
||||
text-align: center;
|
||||
width: calc(100% - 2px);
|
||||
height: calc(100% - 2px);*/
|
||||
position: static;
|
||||
background-color: #252528;
|
||||
margin-top: 1em;
|
||||
|
||||
span {
|
||||
background-color: inherit;
|
||||
color: $white;
|
||||
/*position: relative;
|
||||
top: 50%;
|
||||
text-align: center;
|
||||
font-size: 1.25em;
|
||||
font-weight: 600;
|
||||
margin: -1em 0 0;
|
||||
padding: 0 0.5em;
|
||||
display: inline-block;
|
||||
border-radius: 0.5em;
|
||||
box-shadow: 0 0 1em;*/
|
||||
}
|
||||
}
|
||||
|
||||
.froala-element {
|
||||
min-height: 10em;
|
||||
}
|
||||
|
||||
textarea:focus + label {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.medium-8 > & {
|
||||
font-size: 0.75em;
|
||||
}
|
||||
}
|
||||
|
||||
input, select, button, label span {
|
||||
background-color: $white;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
&.field-slug {
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
right: 0;
|
||||
left: 50%;
|
||||
margin-top: -0.875em;
|
||||
margin-right: 0.9em;
|
||||
margin-left: 10em;
|
||||
z-index: 1;
|
||||
|
||||
input {
|
||||
font-size: 1em;
|
||||
padding-bottom: 0;
|
||||
background-color: $gray;
|
||||
}
|
||||
|
||||
label {
|
||||
margin-top: -3em;
|
||||
right: 100%;
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&.image-field {
|
||||
label {
|
||||
position: relative;
|
||||
margin: 0;
|
||||
border-bottom: 1px dotted #CCC;
|
||||
padding-bottom: 1.3em;
|
||||
text-align: center;
|
||||
|
||||
> span {
|
||||
position: absolute;
|
||||
background-color: transparent;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
img {
|
||||
@include opacity(0.75);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.check-box-field {
|
||||
margin-bottom: 0;
|
||||
|
||||
div {
|
||||
float: left;
|
||||
font-size: 1.75em;
|
||||
//display: none;
|
||||
|
||||
/*input {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
&:before {
|
||||
content: '';
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
display: inline-block;
|
||||
border: 1px solid #CCC;
|
||||
line-height: 0.75em;
|
||||
text-align: center;
|
||||
font-size: 1.6667em;
|
||||
border-radius: 0.2em;
|
||||
box-shadow: 0 1.9px #CCC;
|
||||
content: '✓';
|
||||
}*/
|
||||
}
|
||||
|
||||
input {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
label {
|
||||
position: relative;
|
||||
margin: 0;
|
||||
display: inline-block;
|
||||
line-height: 1.6em;
|
||||
|
||||
span {
|
||||
display: inline-block;
|
||||
vertical-align: text-top;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.select {
|
||||
overflow: auto;
|
||||
|
||||
label {
|
||||
position: static;
|
||||
margin: 0;
|
||||
float: left;
|
||||
|
||||
& + div {
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.user-select-field,
|
||||
&.organization-select-field {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
border: 1px solid #CCC;
|
||||
padding: 0.25em;
|
||||
margin: 1em 1em 0;
|
||||
border-radius: 0.25em;
|
||||
float: left;
|
||||
box-shadow: 0 2px #CCC;
|
||||
overflow: hidden;
|
||||
|
||||
label {
|
||||
display: block;
|
||||
position: relative;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
input[type="checkbox"] {
|
||||
position: absolute;
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
-ms-appearance: none;
|
||||
-o-appearance: none;
|
||||
appearance: none;
|
||||
width: 100%;
|
||||
width: calc(100% - 0.6em);
|
||||
height: 9em;
|
||||
border: 0;
|
||||
background-color: transparent;
|
||||
cursor: pointer;
|
||||
outline: none;
|
||||
|
||||
+ label {
|
||||
display: none;
|
||||
width: 100%;
|
||||
width: calc(100% - 0.06em);
|
||||
height: 0.94em;
|
||||
font-size: 8em;
|
||||
position: absolute;
|
||||
top: 0.03em;
|
||||
left: 0.03em;
|
||||
color: $white;
|
||||
line-height: 0.75em;
|
||||
text-align: center;
|
||||
text-shadow: 0 2px 0px $black;
|
||||
}
|
||||
|
||||
&:checked {
|
||||
|
||||
+ label {
|
||||
background-color: rgba($warning-color, 0.5);
|
||||
display: block;
|
||||
text-shadow: 0 2px 0px $warning-color;
|
||||
}
|
||||
}
|
||||
&:hover {
|
||||
+ label {
|
||||
display: block;
|
||||
color: $warning-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.new {
|
||||
input[type="checkbox"],
|
||||
input[type="checkbox"] + label {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
img {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.select-user,
|
||||
.select-organization {
|
||||
margin-bottom: 0.5em;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.remove-item {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
|
||||
&:before {
|
||||
content: '';
|
||||
height: 0;
|
||||
width: 0;
|
||||
border-width: 0 2.5em 2.5em 0;
|
||||
border-color: transparent $black;
|
||||
border-style: solid;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
&:after {
|
||||
content: '×';
|
||||
color: $white;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
width: 1.5em;
|
||||
height: 1.25em;
|
||||
text-align: center;
|
||||
line-height: 1.25em;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
form > div:first-child + .columns:not([class*="medium-"]) {
|
||||
margin-top: 1em;
|
||||
margin-bottom: 3em;
|
||||
|
||||
> .field:first-child {
|
||||
text-align: center;
|
||||
|
||||
label {
|
||||
//margin-left: 0;
|
||||
//margin-right: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
input {
|
||||
font-size: 3em;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
//+ .columns[class*="medium-"] {//+ .columns[class*="medium-"] {
|
||||
//padding-top: 1em;
|
||||
//}
|
||||
}
|
||||
|
||||
.actions {
|
||||
text-align: center;
|
||||
padding-top: 1em;
|
||||
}
|
||||
|
||||
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
|
||||
font-style: italic;
|
||||
color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
::-moz-placeholder { /* Mozilla Firefox 19+ */
|
||||
font-style: italic;
|
||||
color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
:-ms-input-placeholder { /* Internet Explorer 10+ */
|
||||
font-style: italic;
|
||||
color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
::-webkit-input-placeholder {
|
||||
font-style: italic;
|
||||
color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
input:-webkit-autofill {
|
||||
-webkit-box-shadow:0 0 0 5em $input-bg-color inset; /* Change the color to your own background color */
|
||||
-webkit-text-fill-color: $input-font-color;
|
||||
|
||||
&:focus {
|
||||
-webkit-box-shadow: 0 0 0 2em $input-focus-bg-color inset; /* Change the color to your own background color */
|
||||
}
|
||||
}
|
||||
|
||||
.tabs {
|
||||
display: inline-block;
|
||||
border: 1px solid #CCC;
|
||||
margin: 1em 0;
|
||||
box-shadow: 0 0.1em 0 #CCC;
|
||||
border-radius: 0.25em;
|
||||
overflow: hidden;
|
||||
font-family: $header-font-family;
|
||||
|
||||
.tab {
|
||||
border-right: 1px solid #CCC;
|
||||
display: inline-block;
|
||||
//padding: 0.25em 1em 0.3333em 0.75em;
|
||||
padding: 0.5em 1.5em 0.5em 1.25em;
|
||||
background-color: #FFF;
|
||||
color: $black;
|
||||
float: left;
|
||||
|
||||
&.current {
|
||||
background-color: #EEE;
|
||||
background-color: #EEE;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: #DDD;
|
||||
color: $black;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
border: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sub-tabs {
|
||||
background-color: #E1E1E1;
|
||||
padding: 1em;
|
||||
margin-bottom: 2em;
|
||||
|
||||
a {
|
||||
display: block;
|
||||
position: relative;
|
||||
padding: 1em;
|
||||
margin: 1px 0;
|
||||
height: 3.1em;
|
||||
font-size: 1.1em;
|
||||
font-family: $header-font-family;
|
||||
color: $white;
|
||||
background-color: $black;
|
||||
text-transform: uppercase;
|
||||
|
||||
&.current {
|
||||
background-color: $primary-color;
|
||||
|
||||
&:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 100%;
|
||||
width: 0;
|
||||
height: 0;
|
||||
border: 1.55em solid $primary-color;
|
||||
border-color: transparent transparent transparent $primary-color;
|
||||
border-width: 1.55em 0 1.55em 1.55em;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
svg {
|
||||
height: 0%;
|
||||
}
|
||||
|
||||
#footer {
|
||||
color: $white;
|
||||
padding: 2.5em 0;
|
||||
font-size: 1.25em;
|
||||
|
||||
a {
|
||||
margin: 0 1em;
|
||||
}
|
||||
|
||||
a, a:visited {
|
||||
color: $white;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: rgba($white, 0.5);
|
||||
}
|
||||
}
|
||||
|
||||
article {
|
||||
p {
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
}
|
||||
.error {
|
||||
position: relative;
|
||||
padding: 0.5em 1em;
|
||||
background-color: $warning-color;
|
||||
|
||||
&:before {
|
||||
content: '!';
|
||||
position: absolute;
|
||||
font-family: $header-font-family;
|
||||
background-color: $alert-color;
|
||||
color: $white;
|
||||
font-size: 2em;
|
||||
line-height: 1em;
|
||||
width: 1em;
|
||||
text-align: center;
|
||||
border-radius: 50%;
|
||||
right: -0.333em;
|
||||
top: -0.333em;
|
||||
}
|
||||
}
|
||||
p.help {
|
||||
font-size: 1.1em;
|
||||
}
|
||||
|
||||
.small-form {
|
||||
> .field {
|
||||
display: inline-block;
|
||||
vertical-align: baseline;
|
||||
width: 10em;
|
||||
|
||||
input {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
label {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.actions {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
@@ -1,69 +0,0 @@
|
||||
body {
|
||||
background-color: #fff;
|
||||
color: #333;
|
||||
font-family: verdana, arial, helvetica, sans-serif;
|
||||
font-size: 13px;
|
||||
line-height: 18px;
|
||||
}
|
||||
|
||||
p, ol, ul, td {
|
||||
font-family: verdana, arial, helvetica, sans-serif;
|
||||
font-size: 13px;
|
||||
line-height: 18px;
|
||||
}
|
||||
|
||||
pre {
|
||||
background-color: #eee;
|
||||
padding: 10px;
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #000;
|
||||
&:visited {
|
||||
color: #666;
|
||||
}
|
||||
&:hover {
|
||||
color: #fff;
|
||||
background-color: #000;
|
||||
}
|
||||
}
|
||||
|
||||
div {
|
||||
&.field, &.actions {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
#notice {
|
||||
color: green;
|
||||
}
|
||||
|
||||
.field_with_errors {
|
||||
padding: 2px;
|
||||
background-color: red;
|
||||
display: table;
|
||||
}
|
||||
|
||||
#error_explanation {
|
||||
width: 450px;
|
||||
border: 2px solid red;
|
||||
padding: 7px;
|
||||
padding-bottom: 0;
|
||||
margin-bottom: 20px;
|
||||
background-color: #f0f0f0;
|
||||
h2 {
|
||||
text-align: left;
|
||||
font-weight: bold;
|
||||
padding: 5px 5px 5px 15px;
|
||||
font-size: 12px;
|
||||
margin: -7px;
|
||||
margin-bottom: 0px;
|
||||
background-color: #c00;
|
||||
color: #fff;
|
||||
}
|
||||
ul li {
|
||||
font-size: 12px;
|
||||
list-style: square;
|
||||
}
|
||||
}
|
||||
@@ -1,3 +0,0 @@
|
||||
// Place all the styles related to the workshop_facilitators controller here.
|
||||
// They will automatically be included in application.css.
|
||||
// You can use Sass (SCSS) here: http://sass-lang.com/
|
||||
@@ -1,3 +0,0 @@
|
||||
// Place all the styles related to the workshop_requested_resources controller here.
|
||||
// They will automatically be included in application.css.
|
||||
// You can use Sass (SCSS) here: http://sass-lang.com/
|
||||
@@ -1,3 +0,0 @@
|
||||
// Place all the styles related to the workshops controller here.
|
||||
// They will automatically be included in application.css.
|
||||
// You can use Sass (SCSS) here: http://sass-lang.com/
|
||||
Reference in New Issue
Block a user