ascribe/onion
1
0
Fork 0
mirror of https://github.com/ascribe/onion.git synced 2024-12-22 17:33:14 +01:00
Code Issues Releases Wiki Activity

thumbnails, header, footer, pager

Browse Source
This commit is contained in:
diminator 2015-10-16 13:00:19 +02:00
parent ed24ec194e
commit f8d2d39b2d
5 changed files with 32 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
js/components/ascribe_accordion_list/accordion_list_item_piece.js
View File

@ -48,7 +48,7 @@ let AccordionListItemPiece = React.createClass({
return (
<AccordionListItem
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>}
subheading={
<h3>

5
js/components/ascribe_pagination/pagination_button.js
View File

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

16
sass/ascribe_accordion_list.scss
View File

@ -51,12 +51,20 @@ $ascribe-accordion-list-item-height: 100px;
max-width: 100%;
}
&::before {
content: ' ';
div {
display: inline-block;
height: 100%;
vertical-align: middle; // vertical alignment of the inline element
width: 100px;
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 {

26
sass/ascribe_custom_style.scss
View File

@ -11,9 +11,9 @@ $ascribe-red-error: rgb(169, 68, 66);
$ascribe--fg-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-bg-color: $ascribe-dark-blue;
$ascribe--nav-bg-color: white;
$ascribe--button-default-color: $ascribe--bg-color;
$ascribe--button-secondary-fg-color: $ascribe--bg-color;
@ -27,7 +27,7 @@ html,
body {
font-family: $ascribe--font;
font-weight: $ascribe--font-weight;
background-color: #fcfcfc !important;
background-color: #f8f8f8 !important;
}
h1, h3 {
font-family: $ascribe--font;
@ -50,8 +50,8 @@ hr {
.navbar-default {
background-color: $ascribe--nav-bg-color;
box-shadow: 0 0 2px rgba(0,0,0,.14),
0 2px 4px rgba(0,0,0,.28);
box-shadow: 0 0 1px rgba(0,0,0,.1),
0 1px 2px rgba(0,0,0,.2);
.navbar-nav > li > a,
.navbar-nav > li > .active a {
@ -194,11 +194,11 @@ hr {
}
}
.ascribe-footer {
position: fixed;
left: 0;
bottom: 0;
height: 80px;
width: 100%;
//position: fixed;
//left: 0;
//bottom: 0;
//height: 80px;
//width: 100%;
text-transform: uppercase;
background-color: $ascribe-white;
border-top: 1px solid rgba(0, 60, 105, 0.1);
@ -400,6 +400,12 @@ fieldset[disabled] .btn-secondary.active {
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 > span {
background-color: $ascribe--button-default-color!important;

6
sass/main.scss
View File

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