1
0
mirror of https://github.com/ascribe/onion.git synced 2025-02-14 21:10:27 +01:00

Merge branch 'AD-1080-restyle-webapp-with-new-corporate-identity' of bitbucket.org:ascribe/onion into AD-1080-restyle-webapp-with-new-corporate-identity

This commit is contained in:
Tim Daubenschütz 2015-10-16 13:10:44 +02:00
commit b964bde281
8 changed files with 56 additions and 66 deletions

View File

@ -48,7 +48,7 @@ let AccordionListItemPiece = React.createClass({
return ( return (
<AccordionListItem <AccordionListItem
className={this.props.className} className={this.props.className}
thumbnail={<img src={this.props.piece.thumbnail.url_safe}/>} thumbnail={<div style={{backgroundImage: 'url("' + this.props.piece.thumbnail.url_safe + '")'}}/>}
heading={<h1>{this.props.piece.title}</h1>} heading={<h1>{this.props.piece.title}</h1>}
subheading={ subheading={
<h3> <h3>

View File

@ -44,11 +44,9 @@ let UnConsignRequestForm = React.createClass({
</div>} </div>}
spinner={ spinner={
<div className="modal-footer"> <div className="modal-footer">
<div className="modal-footer"> <p className="pull-right">
<p className="pull-right"> <AscribeSpinner color='dark-blue' size='md'/>
<AscribeSpinner color='dark-blue' size='md'/> </p>
</p>
</div>
</div>}> </div>}>
<Property <Property
name='unconsign_request_message' name='unconsign_request_message'

View File

@ -3,6 +3,7 @@
import React from 'react'; import React from 'react';
import Router from 'react-router'; import Router from 'react-router';
import Glyphicon from 'react-bootstrap/lib/Glyphicon';
import { getLangText } from '../../utils/lang_utils'; import { getLangText } from '../../utils/lang_utils';
let Link = Router.Link; let Link = Router.Link;
@ -29,14 +30,14 @@ let PaginationButton = React.createClass({
page -= 1; page -= 1;
directionDisplay = ( directionDisplay = (
<span> <span>
<span aria-hidden="true">&larr;</span> {getLangText('Previous')} <span aria-hidden="true"><Glyphicon glyph='chevron-left'/></span> {getLangText('Previous')}
</span> </span>
); );
} else { } else {
page += 1; page += 1;
directionDisplay = ( directionDisplay = (
<span> <span>
{getLangText('Next')} <span aria-hidden="true">&rarr;</span> {getLangText('Next')} <span aria-hidden="true"><Glyphicon glyph='chevron-right'/></span>
</span> </span>
); );
} }

View File

@ -51,12 +51,20 @@ $ascribe-accordion-list-item-height: 100px;
max-width: 100%; max-width: 100%;
} }
&::before { div {
content: ' ';
display: inline-block; display: inline-block;
height: 100%; width: 100px;
vertical-align: middle; // vertical alignment of the inline element height: 100px;
background-position: center center;
background-size: cover;
} }
//&::before {
// content: ' ';
// display: inline-block;
// height: 100%;
// vertical-align: middle; // vertical alignment of the inline element
//}
} }
h1 { h1 {

View File

@ -11,16 +11,14 @@ $ascribe-red-error: rgb(169, 68, 66);
$ascribe--fg-color: $ascribe-dark-blue; $ascribe--fg-color: $ascribe-dark-blue;
$ascribe--bg-color: $ascribe-dark-blue; $ascribe--bg-color: $ascribe-dark-blue;
$ascribe--nav-fg-prim-color: white; $ascribe--nav-fg-prim-color: $ascribe-dark-blue;
$ascribe--nav-fg-sec-color: $ascribe-light-blue; $ascribe--nav-fg-sec-color: $ascribe-light-blue;
$ascribe--nav-bg-color: $ascribe-dark-blue; $ascribe--nav-bg-color: white;
$ascribe--button-default-color: $ascribe--bg-color; $ascribe--button-default-color: $ascribe--bg-color;
$ascribe--button-secondary-fg-color: $ascribe--bg-color; $ascribe--button-secondary-fg-color: $ascribe--bg-color;
$ascribe--button-secondary-bg-color: white; $ascribe--button-secondary-bg-color: white;
$ascribe--logo: 'https://s3-us-west-2.amazonaws.com/ascribe0/whitelabel/ikonotv/ikono_tv.png';
//$ascribe--font: 'canada-type-gibson', sans-serif !important; //$ascribe--font: 'canada-type-gibson', sans-serif !important;
$ascribe--font: 'gibson-local', sans-serif !important; $ascribe--font: 'gibson-local', sans-serif !important;
$ascribe--font-weight: 300 !important; $ascribe--font-weight: 300 !important;
@ -29,7 +27,7 @@ html,
body { body {
font-family: $ascribe--font; font-family: $ascribe--font;
font-weight: $ascribe--font-weight; font-weight: $ascribe--font-weight;
background-color: #fcfcfc !important; background-color: #f8f8f8 !important;
} }
h1, h3 { h1, h3 {
font-family: $ascribe--font; font-family: $ascribe--font;
@ -52,9 +50,8 @@ hr {
.navbar-default { .navbar-default {
background-color: $ascribe--nav-bg-color; background-color: $ascribe--nav-bg-color;
box-shadow: 0 0 2px rgba(0,0,0,.14), box-shadow: 0 0 1px rgba(0,0,0,.1),
0 2px 4px rgba(0,0,0,.28); 0 1px 2px rgba(0,0,0,.2);
//box-shadow: 0 2px 2px -2px rgba(0, 0, 0, .52);
.navbar-nav > li > a, .navbar-nav > li > a,
.navbar-nav > li > .active a { .navbar-nav > li > .active a {
@ -129,10 +126,7 @@ hr {
padding-right: 120px; padding-right: 120px;
padding-bottom: 36px; padding-bottom: 36px;
padding-left: 30px; padding-left: 30px;
background-image: url($ascribe--logo); background: transparent no-repeat center 4px;
background-color: transparent;
background-position: center 4px;
background-repeat: no-repeat;
background-size: 150px; background-size: 150px;
margin-bottom: 0; margin-bottom: 0;
position: relative; position: relative;
@ -166,9 +160,7 @@ hr {
} }
.ascribe-accordion-list-item { .ascribe-accordion-list-item {
border: 1px solid $ascribe-blue-border; border: 1px solid $ascribe-blue-border;
-webkit-box-shadow: 0 2px 2px -2px rgba(0,0,0,.18); box-shadow: 0 2px 2px -2px rgba(0,0,0,.18);
-moz-box-shadow: 0 2px 2px -2px rgba(0,0,0,.18);
box-shadow: 0 2px 2px -2px rgba(0,0,0,.18);
} }
.ascribe-accordion-list-item .wrapper { .ascribe-accordion-list-item .wrapper {
@ -202,11 +194,11 @@ hr {
} }
} }
.ascribe-footer { .ascribe-footer {
position: fixed; //position: fixed;
left: 0; //left: 0;
bottom: 0; //bottom: 0;
height: 80px; //height: 80px;
width: 100%; //width: 100%;
text-transform: uppercase; text-transform: uppercase;
background-color: $ascribe-white; background-color: $ascribe-white;
border-top: 1px solid rgba(0, 60, 105, 0.1); border-top: 1px solid rgba(0, 60, 105, 0.1);
@ -408,6 +400,12 @@ fieldset[disabled] .btn-secondary.active {
border-color: $ascribe--button-default-color; border-color: $ascribe--button-default-color;
} }
.pager li > a:hover,
.pager li > span:hover {
background-color: lighten($ascribe--button-default-color, 20%);
border-color: lighten($ascribe--button-default-color, 20%);
}
.pager .disabled > a, .pager .disabled > a,
.pager .disabled > span { .pager .disabled > span {
background-color: $ascribe--button-default-color!important; background-color: $ascribe--button-default-color!important;
@ -431,16 +429,16 @@ fieldset[disabled] .btn-secondary.active {
color: rgba($ascribe-dark-blue, 0.5); color: rgba($ascribe-dark-blue, 0.5);
font-style: normal; font-style: normal;
} }
/* firefox 19+ */
input::-moz-placeholder { input::-moz-placeholder {
color: rgba($ascribe-dark-blue, 0.5); color: rgba($ascribe-dark-blue, 0.5);
font-style: normal; font-style: normal;
} }
/* firefox 19+ */ /* ie */
input:-ms-input-placeholder { input:-ms-input-placeholder {
color: rgba($ascribe-dark-blue, 0.5); color: rgba($ascribe-dark-blue, 0.5);
font-style: normal; font-style: normal;
} }
/* ie */
input:-moz-placeholder { input:-moz-placeholder {
color: rgba($ascribe-dark-blue, 0.5); color: rgba($ascribe-dark-blue, 0.5);
font-style: normal; font-style: normal;
@ -480,7 +478,6 @@ fieldset[disabled] .btn-secondary.active {
} }
.ascribe-property-wrapper:hover { .ascribe-property-wrapper:hover {
//border-left-color: rgba($ascribe--button-default-color, .5);
border-left-color: rgba($ascribe-blue, .5); border-left-color: rgba($ascribe-blue, .5);
} }
@ -506,23 +503,22 @@ fieldset[disabled] .btn-secondary.active {
} }
> span:not(.glyphicon) { > span:not(.glyphicon) {
color: $ascribe--button-default-color; color: $ascribe--button-default-color;
//font-weight: normal !important;
} }
textarea::-webkit-input-placeholder { textarea::-webkit-input-placeholder {
color: rgba($ascribe-dark-blue, 0.5); color: rgba($ascribe-dark-blue, 0.5);
font-style: normal; font-style: normal;
} }
/* firefox 19+ */
textarea::-moz-placeholder { textarea::-moz-placeholder {
color: rgba($ascribe-dark-blue, 0.5); color: rgba($ascribe-dark-blue, 0.5);
font-style: normal; font-style: normal;
} }
/* firefox 19+ */ /* ie */
textarea:-ms-input-placeholder { textarea:-ms-input-placeholder {
color: rgba($ascribe-dark-blue, 0.5); color: rgba($ascribe-dark-blue, 0.5);
font-style: normal; font-style: normal;
} }
/* ie */
textarea:-moz-placeholder { textarea:-moz-placeholder {
color: rgba($ascribe-dark-blue, 0.5); color: rgba($ascribe-dark-blue, 0.5);
font-style: normal; font-style: normal;
@ -532,16 +528,16 @@ fieldset[disabled] .btn-secondary.active {
color: rgba($ascribe-dark-blue, 0.5); color: rgba($ascribe-dark-blue, 0.5);
font-style: normal; font-style: normal;
} }
/* firefox 19+ */
input::-moz-placeholder { input::-moz-placeholder {
color: rgba($ascribe-dark-blue, 0.5); color: rgba($ascribe-dark-blue, 0.5);
font-style: normal; font-style: normal;
} }
/* firefox 19+ */ /* ie */
input:-ms-input-placeholder { input:-ms-input-placeholder {
color: rgba($ascribe-dark-blue, 0.5); color: rgba($ascribe-dark-blue, 0.5);
font-style: normal; font-style: normal;
} }
/* ie */
input:-moz-placeholder { input:-moz-placeholder {
color: rgba($ascribe-dark-blue, 0.5); color: rgba($ascribe-dark-blue, 0.5);
font-style: normal; font-style: normal;

View File

@ -37,9 +37,11 @@ $ascribe--spinner-size-sm: 15px;
} }
.spinner-wrapper-loop { .spinner-wrapper-loop {
animation: spinner-color-loop 20s;
-moz-animation: spinner-color-loop 20s infinite;
-webkit-animation: spinner-color-loop 20s infinite; -webkit-animation: spinner-color-loop 20s infinite;
-moz-animation: spinner-color-loop 20s infinite;
-o-animation: spinner-color-loop 20s infinite;
animation: spinner-color-loop 20s;
} }
.spinner-wrapper-black { .spinner-wrapper-black {
@ -65,10 +67,7 @@ $ascribe--spinner-size-sm: 15px;
} }
.spinner-circle { .spinner-circle {
-webkit-border-radius: 50%; border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
border-style: solid; border-style: solid;
-webkit-animation: spin 1s infinite linear; -webkit-animation: spin 1s infinite linear;
@ -76,22 +75,27 @@ $ascribe--spinner-size-sm: 15px;
-o-animation: spin 1s infinite linear; -o-animation: spin 1s infinite linear;
animation: spin 1s infinite linear; animation: spin 1s infinite linear;
} }
.spinner-wrapper-lg .spinner-inner,
.spinner-wrapper-lg .spinner-circle { .spinner-wrapper-lg .spinner-circle {
width: $ascribe--spinner-size-lg; width: $ascribe--spinner-size-lg;
height: $ascribe--spinner-size-lg; height: $ascribe--spinner-size-lg;
border-width: 1px 1px 1px 0;
} }
.spinner-wrapper-md .spinner-inner,
.spinner-wrapper-md .spinner-circle { .spinner-wrapper-md .spinner-circle {
width: $ascribe--spinner-size-md; width: $ascribe--spinner-size-md;
height: $ascribe--spinner-size-md; height: $ascribe--spinner-size-md;
border-width: 1px 1px 1px 0;
} }
.spinner-wrapper-sm .spinner-inner,
.spinner-wrapper-sm .spinner-circle { .spinner-wrapper-sm .spinner-circle {
width: $ascribe--spinner-size-sm; width: $ascribe--spinner-size-sm;
height: $ascribe--spinner-size-sm; height: $ascribe--spinner-size-sm;
}
.spinner-wrapper-lg .spinner-circle,
.spinner-wrapper-sm .spinner-circle,
.spinner-wrapper-md .spinner-circle {
border-width: 1px 1px 1px 0; border-width: 1px 1px 1px 0;
} }
@ -99,26 +103,19 @@ $ascribe--spinner-size-sm: 15px;
position: relative; position: relative;
text-align: center; text-align: center;
} }
.spinner-wrapper-lg .spinner-inner { .spinner-wrapper-lg .spinner-inner {
font-size: $ascribe--spinner-size-lg; font-size: $ascribe--spinner-size-lg;
top: -64px; top: -64px;
height: $ascribe--spinner-size-lg;
width: $ascribe--spinner-size-lg;
} }
.spinner-wrapper-md .spinner-inner { .spinner-wrapper-md .spinner-inner {
font-size: $ascribe--spinner-size-md; font-size: $ascribe--spinner-size-md;
top: -38px; top: -38px;
height: $ascribe--spinner-size-md;
width: $ascribe--spinner-size-md;
} }
.spinner-wrapper-sm .spinner-inner { .spinner-wrapper-sm .spinner-inner {
font-size: $ascribe--spinner-size-sm; font-size: $ascribe--spinner-size-sm;
top: -19px; top: -19px;
height: $ascribe--spinner-size-sm;
width: $ascribe--spinner-size-sm;
} }
@-webkit-keyframes spin { @-webkit-keyframes spin {

View File

@ -58,10 +58,6 @@ html {
padding-top: 70px; padding-top: 70px;
} }
.ascribe-body {
margin-bottom: 100px;
}
hr { hr {
margin-bottom: 15px; margin-bottom: 15px;
} }
@ -76,8 +72,6 @@ hr {
.no-margin { .no-margin {
margin: 0; margin: 0;
margin-left: 0;
margin-right: 0;
} }
.no-padding { .no-padding {

View File

@ -19,10 +19,6 @@ $ikono--font: 'Helvetica Neue', 'Helvetica', sans-serif !important;
} }
.navbar-default .navbar-nav > .active a:hover, .navbar-default .navbar-nav > .active a:focus {
}
.client--ikonotv .navbar-default { .client--ikonotv .navbar-default {
background-color: $ikono--bg-color; background-color: $ikono--bg-color;
box-shadow: none; box-shadow: none;