diff --git a/fonts/ascribe-logo-v2.eot b/fonts/ascribe-logo-v2.eot deleted file mode 100644 index cb57c523..00000000 Binary files a/fonts/ascribe-logo-v2.eot and /dev/null differ diff --git a/fonts/ascribe-logo-v2.svg b/fonts/ascribe-logo-v2.svg deleted file mode 100644 index 771fb1b8..00000000 --- a/fonts/ascribe-logo-v2.svg +++ /dev/null @@ -1,11 +0,0 @@ - - - -Generated by IcoMoon - - - - - - - \ No newline at end of file diff --git a/fonts/ascribe-logo-v2.ttf b/fonts/ascribe-logo-v2.ttf deleted file mode 100644 index 775c957d..00000000 Binary files a/fonts/ascribe-logo-v2.ttf and /dev/null differ diff --git a/fonts/ascribe-logo-v2.woff b/fonts/ascribe-logo-v2.woff deleted file mode 100644 index 8c7ed715..00000000 Binary files a/fonts/ascribe-logo-v2.woff and /dev/null differ diff --git a/fonts/ascribe-logo.eot b/fonts/ascribe-logo.eot index ed256abe..d4815136 100644 Binary files a/fonts/ascribe-logo.eot and b/fonts/ascribe-logo.eot differ diff --git a/fonts/ascribe-logo.svg b/fonts/ascribe-logo.svg index e765a6ce..4024b64a 100644 --- a/fonts/ascribe-logo.svg +++ b/fonts/ascribe-logo.svg @@ -7,9 +7,12 @@ - - - - - + + + + + + + + \ No newline at end of file diff --git a/fonts/ascribe-logo.ttf b/fonts/ascribe-logo.ttf index 4b4f26b8..b42d5303 100644 Binary files a/fonts/ascribe-logo.ttf and b/fonts/ascribe-logo.ttf differ diff --git a/fonts/ascribe-logo.woff b/fonts/ascribe-logo.woff index 0855f268..c3cd4d76 100644 Binary files a/fonts/ascribe-logo.woff and b/fonts/ascribe-logo.woff differ diff --git a/fonts/ascribe_logo.svg b/fonts/ascribe_logo.svg deleted file mode 100644 index 3d28d0a8..00000000 --- a/fonts/ascribe_logo.svg +++ /dev/null @@ -1,43 +0,0 @@ - - - - - - - - diff --git a/js/components/ascribe_accordion_list/accordion_list_item_edition_widget.js b/js/components/ascribe_accordion_list/accordion_list_item_edition_widget.js index 4ead8a2a..f5a37a2e 100644 --- a/js/components/ascribe_accordion_list/accordion_list_item_edition_widget.js +++ b/js/components/ascribe_accordion_list/accordion_list_item_edition_widget.js @@ -11,6 +11,7 @@ import PieceListStore from '../../stores/piece_list_store'; import Button from 'react-bootstrap/lib/Button'; import CreateEditionsButton from '../ascribe_buttons/create_editions_button'; +import AscribeSpinner from '../ascribe_spinner'; import { mergeOptions } from '../../utils/general_utils'; import { getLangText } from '../../utils/lang_utils'; @@ -75,7 +76,10 @@ let AccordionListItemEditionWidget = React.createClass({ // PLEASE FUTURE TIM, DO NOT FUCKING REMOVE IT AGAIN! if(typeof this.state.editionList[pieceId] === 'undefined') { return ( - + ); } else { return ( diff --git a/js/components/ascribe_buttons/create_editions_button.js b/js/components/ascribe_buttons/create_editions_button.js index 8eebeaf7..3cb6257c 100644 --- a/js/components/ascribe_buttons/create_editions_button.js +++ b/js/components/ascribe_buttons/create_editions_button.js @@ -5,6 +5,8 @@ import React from 'react'; import EditionListActions from '../../actions/edition_list_actions'; import EditionListStore from '../../stores/edition_list_store'; +import AscribeSpinner from '../ascribe_spinner'; + import { getLangText } from '../../utils/lang_utils'; import classNames from 'classnames'; @@ -76,7 +78,10 @@ let CreateEditionsButton = React.createClass({ ); } else { diff --git a/js/components/ascribe_spinner.js b/js/components/ascribe_spinner.js index 5c3ca5d7..ecdf641b 100644 --- a/js/components/ascribe_spinner.js +++ b/js/components/ascribe_spinner.js @@ -5,12 +5,14 @@ import classNames from 'classnames'; let AscribeSpinner = React.createClass({ propTypes: { + classNames: React.PropTypes.string, size: React.PropTypes.oneOf(['sm', 'md', 'lg']), color: React.PropTypes.oneOf(['blue', 'dark-blue', 'light-blue', 'pink', 'black', 'loop']) }, getDefaultProps() { return { + inline: false, size: 'md', color: 'loop' }; @@ -18,7 +20,10 @@ let AscribeSpinner = React.createClass({ render() { return ( -
+
A
diff --git a/js/components/piece_list.js b/js/components/piece_list.js index 5eb8a81e..eba51e70 100644 --- a/js/components/piece_list.js +++ b/js/components/piece_list.js @@ -152,7 +152,7 @@ let PieceList = React.createClass({ render() { //let loadingElement = (); - let loadingElement = ; + let loadingElement = ; let AccordionListItemType = this.props.accordionListItemType; return ( diff --git a/sass/ascribe-fonts/ascribe-fonts.scss b/sass/ascribe-fonts/ascribe-fonts.scss index cec52964..263c6f3a 100644 --- a/sass/ascribe-fonts/ascribe-fonts.scss +++ b/sass/ascribe-fonts/ascribe-fonts.scss @@ -9,27 +9,26 @@ font-style: normal; } -[class^="glyph-ascribe-"], [class*=" glyph-ascribe-"] { - font-family: 'ascribe'; - speak: none; - font-style: normal; - font-weight: normal; - font-variant: normal; - text-transform: none; - line-height: 1; +[class^="icon-ascribe-"], [class*=" icon-ascribe-"] { + font-family: 'ascribe-logo'; + speak: none; + font-style: normal; + font-weight: normal; + font-variant: normal; + text-transform: none; + line-height: 1; - /* Better Font Rendering =========== */ - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; + /* Better Font Rendering =========== */ + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; } - @font-face { font-family: 'ascribe-logo'; - src:url('#{$BASE_URL}static/fonts/ascribe-logo.eot?qdbpt8'); - src:url('#{$BASE_URL}static/fonts/ascribe-logo.eot?qdbpt8#iefix') format('embedded-opentype'), - url('#{$BASE_URL}static/fonts/ascribe-logo.ttf?qdbpt8') format('truetype'), - url('#{$BASE_URL}static/fonts/ascribe-logo.woff?qdbpt8') format('woff'), - url('#{$BASE_URL}static/fonts/ascribe-logo.svg?qdbpt8#ascribe-logo') format('svg'); + src:url('#{$BASE_URL}static/fonts/ascribe-logo.eot?ijga43'); + src:url('#{$BASE_URL}static/fonts/ascribe-logo.eot?ijga43#iefix') format('embedded-opentype'), + url('#{$BASE_URL}static/fonts/ascribe-logo.ttf?ijga43') format('truetype'), + url('#{$BASE_URL}static/fonts/ascribe-logo.woff?ijga43') format('woff'), + url('#{$BASE_URL}static/fonts/ascribe-logo.svg?ijga43#ascribe-logo') format('svg'); font-weight: normal; font-style: normal; } @@ -51,18 +50,31 @@ .icon-ascribe-sort:before { content: "\e800"; } -.icon-ascribe-filter:before { +.icon-ascribe-search:before { content: "\e801"; } -.icon-ascribe-search:before { +.icon-ascribe-filter:before { content: "\e802"; } -.icon-ascribe-logo-short:before { +.icon-ascribe-add-white:before { content: "\e803"; } -.icon-ascribe-logo:before { +.icon-ascribe-add .path1:before { content: "\e804"; + color: rgb(0, 60, 106); } +.icon-ascribe-add .path2:before { + content: "\e805"; + margin-left: -1em; + color: rgb(255, 255, 255); +} +.icon-ascribe-icon:before { + content: "\e806"; +} +.icon-ascribe-logo:before { + content: "\e807"; +} + .glyph-ascribe-logo-spool:before { diff --git a/sass/ascribe_custom_style.scss b/sass/ascribe_custom_style.scss index c30584de..180b5e9b 100644 --- a/sass/ascribe_custom_style.scss +++ b/sass/ascribe_custom_style.scss @@ -14,7 +14,8 @@ $ascribe--nav-fg-sec-color: $ascribe-light-blue; $ascribe--nav-bg-color: $ascribe-dark-blue; $ascribe--button-default-color: $ascribe--bg-color; -$ascribe--button-secondary-color: $ascribe--bg-color; +$ascribe--button-secondary-fg-color: $ascribe--bg-color; +$ascribe--button-secondary-bg-color: white; $ascribe--font-weight: 300; $ascribe--logo: 'https://s3-us-west-2.amazonaws.com/ascribe0/whitelabel/ikonotv/ikono_tv.png'; $ascribe--font: 'canada-type-gibson'; @@ -292,6 +293,15 @@ h1 { } } +.ascribe-accordion-list-item-table { + border-bottom: 0.1em solid $ascribe-blue-border; + border-left: 0.1em solid $ascribe-blue-border; + border-right: 0.1em solid $ascribe-blue-border; +} + +.ascribe-table-header-column { + span {font-weight: 300;} +} .route--login, .route--signup { @@ -359,10 +369,34 @@ fieldset[disabled] .btn-default.active { } } +// disabled buttons +.btn-secondary.disabled, +.btn-secondary.disabled:hover, +.btn-secondary.disabled:focus, +.btn-secondary.disabled.focus, +.btn-secondary.disabled:active, +.btn-secondary.disabled.active, +.btn-secondary[disabled], +.btn-secondary[disabled]:hover, +.btn-secondary[disabled]:focus, +.btn-secondary[disabled].focus, +.btn-secondary[disabled]:active, +.btn-secondary[disabled].active, +fieldset[disabled] .btn-secondary, +fieldset[disabled] .btn-secondary:hover, +fieldset[disabled] .btn-secondary:focus, +fieldset[disabled] .btn-secondary.focus, +fieldset[disabled] .btn-secondary:active, +fieldset[disabled] .btn-secondary.active { + background-color: darken($ascribe--button-secondary-bg-color, 20%); + border-color: darken($ascribe--button-secondary-fg-color, 20%); + color: darken($ascribe--button-secondary-fg-color, 20%); +} + .btn-secondary { - background-color: white; - border-color: $ascribe--button-secondary-color; - color: $ascribe--button-secondary-color; + background-color: $ascribe--button-secondary-bg-color; + border-color: $ascribe--button-secondary-fg-color; + color: $ascribe--button-secondary-fg-color; &:hover, &:active, @@ -373,8 +407,17 @@ fieldset[disabled] .btn-default.active { &.active:hover, &.active:focus, &.active.focus { - background-color: darken($ascribe--button-secondary-color, 20%); - border-color: darken($ascribe--button-secondary-color, 20%); + background-color: $ascribe--button-secondary-fg-color; + border-color: $ascribe--button-secondary-bg-color; + color: $ascribe--button-secondary-bg-color; + } +} + +.btn-secondary .spinner-wrapper { + .spinner-circle, + .spinner-inner { + border-color: $ascribe--button-secondary-fg-color; + color: $ascribe--button-secondary-fg-color; } } @@ -382,15 +425,22 @@ fieldset[disabled] .btn-default.active { .open > .btn-default.dropdown-toggle:focus, .open > .btn-default.dropdown-toggle.focus, .open > .btn-default.dropdown-toggle.dropdown-toggle { - background-color: darken($ascribe--button-secondary-color, 20%); - border-color: darken($ascribe--button-secondary-color, 20%); + background-color: darken($ascribe--button-secondary-fg-color, 20%); + border-color: darken($ascribe--button-secondary-fg-color, 20%); } -.pager li > a, .pager li > span { +.pager li > a, +.pager li > span { background-color: $ascribe--button-default-color; border-color: $ascribe--button-default-color; } +.pager .disabled > a, +.pager .disabled > span { + background-color: $ascribe--button-default-color!important; + border-color: $ascribe--button-default-color; +} + // inputs! .ascribe-input-glyph > .form-group > .input-group > .input-group-addon > .filter-glyph { color: $ascribe--button-default-color; diff --git a/sass/ascribe_spinner.scss b/sass/ascribe_spinner.scss index d58cbf8c..1a700411 100644 --- a/sass/ascribe_spinner.scss +++ b/sass/ascribe_spinner.scss @@ -6,8 +6,9 @@ $ascribe-pink: #D10074; $ascribe--spinner-color: $ascribe-blue; -$ascribe--spinner-size-md: 50px; -$ascribe--spinner-size-sm: 30px; +$ascribe--spinner-size-lg: 50px; +$ascribe--spinner-size-md: 30px; +$ascribe--spinner-size-sm: 15px; [class^="spinner-wrapper-"]{ @@ -48,6 +49,11 @@ $ascribe--spinner-size-sm: 30px; } } +.spinner-wrapper-lg { + width: $ascribe--spinner-size-lg; + height: $ascribe--spinner-size-lg; +} + .spinner-wrapper-md { width: $ascribe--spinner-size-md; height: $ascribe--spinner-size-md; @@ -71,6 +77,12 @@ $ascribe--spinner-size-sm: 30px; animation: spin 1s infinite linear; } +.spinner-wrapper-lg .spinner-circle { + width: $ascribe--spinner-size-lg; + height: $ascribe--spinner-size-lg; + border-width: 1px 1px 1px 0; +} + .spinner-wrapper-md .spinner-circle { width: $ascribe--spinner-size-md; height: $ascribe--spinner-size-md; @@ -88,16 +100,23 @@ $ascribe--spinner-size-sm: 30px; text-align: center; } +.spinner-wrapper-lg .spinner-inner { + font-size: $ascribe--spinner-size-lg; + top: -64px; + height: $ascribe--spinner-size-lg; + width: $ascribe--spinner-size-lg; +} + .spinner-wrapper-md .spinner-inner { font-size: $ascribe--spinner-size-md; - top: -64px; + top: -38px; height: $ascribe--spinner-size-md; width: $ascribe--spinner-size-md; } .spinner-wrapper-sm .spinner-inner { font-size: $ascribe--spinner-size-sm; - top: -38px; + top: -19px; height: $ascribe--spinner-size-sm; width: $ascribe--spinner-size-sm; }