1
0
mirror of https://github.com/ascribe/onion.git synced 2024-12-23 01:39:36 +01:00

editions styling

fix otherdata
collapsible styling
This commit is contained in:
diminator 2015-07-09 18:46:53 +01:00
parent 05a63f28e9
commit 8f78de3fb4
6 changed files with 33 additions and 18 deletions

View File

@ -59,15 +59,16 @@ let AccordionListItem = React.createClass({
overlay={<Tooltip>{this.props.content.title}</Tooltip>}> overlay={<Tooltip>{this.props.content.title}</Tooltip>}>
<h1 className="truncate" onClick={this.handleClick}>{this.props.content.title}</h1> <h1 className="truncate" onClick={this.handleClick}>{this.props.content.title}</h1>
</OverlayTrigger> </OverlayTrigger>
<h3>{getLangText('by %s', this.props.content.artist_name)}</h3> <h3 onClick={this.handleClick}>{getLangText('by %s', this.props.content.artist_name)}</h3>
<div>
<span onClick={this.handleClick}>{this.props.content.date_created.split('-')[0]}</span>
</div>
<div> <div>
<span>{this.props.content.date_created.split('-')[0]}</span>
<AccordionListItemEditionWidget <AccordionListItemEditionWidget
piece={this.props.content} /> piece={this.props.content} />
{/* <a href={this.props.content.license_type.url} target="_blank" className="pull-right"> {/* <a href={this.props.content.license_type.url} target="_blank" className="pull-right">
{getLangText('%s license', this.props.content.license_type.code)} {getLangText('%s license', this.props.content.license_type.code)}
</a> */} </a> */}
</div> </div>
</div> </div>
<span style={{'clear': 'both'}}></span> <span style={{'clear': 'both'}}></span>

View File

@ -75,15 +75,24 @@ let AccordionListItemEditionWidget = React.createClass({
<span <span
onClick={this.toggleTable} onClick={this.toggleTable}
className="ascribe-accordion-list-item-edition-widget"> className="ascribe-accordion-list-item-edition-widget">
{', ' + editionMapping + ' ' + getLangText('Edition')} {this.getGlyphicon()} {editionMapping + ' ' + getLangText('Edition')} {this.getGlyphicon()}
</span> </span>
); );
} else { } else if(numEditions === 0){
return ( return (
<span <span
onClick={this.toggleTable} onClick={this.toggleTable}
className="ascribe-accordion-list-item-edition-widget"> className="ascribe-accordion-list-item-edition-widget">
{', ' + numEditions + ' ' + getLangText('Editions')} {this.getGlyphicon()} {'+ Editions'}
</span>
);
}
else {
return (
<span
onClick={this.toggleTable}
className="ascribe-accordion-list-item-edition-widget">
{numEditions + ' ' + getLangText('Editions')} {this.getGlyphicon()}
</span> </span>
); );
} }

View File

@ -275,7 +275,7 @@ let EditionPersonalNote = React.createClass({
label={getLangText('Personal note (private)')} label={getLangText('Personal note (private)')}
editable={true}> editable={true}>
<InputTextAreaToggable <InputTextAreaToggable
rows={3} rows={1}
editable={true} editable={true}
defaultValue={this.props.edition.note_from_user} defaultValue={this.props.edition.note_from_user}
placeholder={getLangText('Enter a personal note%s', '...')} placeholder={getLangText('Enter a personal note%s', '...')}
@ -314,7 +314,7 @@ let EditionPublicEditionNote = React.createClass({
label={getLangText('Edition note (public)')} label={getLangText('Edition note (public)')}
editable={isEditable}> editable={isEditable}>
<InputTextAreaToggable <InputTextAreaToggable
rows={3} rows={1}
editable={isEditable} editable={isEditable}
defaultValue={this.props.edition.public_note} defaultValue={this.props.edition.public_note}
placeholder={getLangText('Enter a public note for this edition%', '...')} placeholder={getLangText('Enter a public note for this edition%', '...')}

View File

@ -276,7 +276,7 @@ var ReactS3FineUploader = React.createClass({
body: JSON.stringify({ body: JSON.stringify({
'filename': file.name, 'filename': file.name,
'key': file.key, 'key': file.key,
'bitcoin_id': this.props.createBlobRoutine.pieceId 'piece_id': this.props.createBlobRoutine.pieceId
}) })
}) })
.then((res) => { .then((res) => {

View File

@ -19,7 +19,7 @@ $ascribe-accordion-list-font: 'Source Sans Pro';
border-right: 0.1em solid rgba(0,0,0,.2); border-right: 0.1em solid rgba(0,0,0,.2);
border-top: 0.1em solid rgba(0,0,0,.2); border-top: 0.1em solid rgba(0,0,0,.2);
border-radius: 1px; border-radius: 1px;
border-bottom: 0.1em solid rgba(0,0,0,.2); border-bottom: 0.1em solid rgba(0,0,0,0);
.wrapper { .wrapper {
&:hover{ &:hover{
background-color: rgba(2, 182, 163, 0.05); background-color: rgba(2, 182, 163, 0.05);
@ -44,13 +44,14 @@ $ascribe-accordion-list-font: 'Source Sans Pro';
} }
} }
h1 { h1 {
margin-top: .3em; margin: .1em 0 .1em 0;
font-size: 2.25em; font-size: 2.2em;
cursor: pointer; cursor: pointer;
} }
h3 { h3 {
font-size: 1.1em; font-size: 1.3em;
margin: .2em 0 0 0; margin: .2em 0 .3em 0;
cursor: pointer;
} }
a { a {
color: #666; color: #666;
@ -88,6 +89,7 @@ $ascribe-accordion-list-font: 'Source Sans Pro';
} }
} }
border-left: 3px solid rgba(0,0,0,0); border-left: 3px solid rgba(0,0,0,0);
border-top: 1px solid rgba(0,0,0,.1);
border-bottom: 1px solid rgba(0,0,0,.05); border-bottom: 1px solid rgba(0,0,0,.05);
} }
tbody { tbody {
@ -143,9 +145,12 @@ span.ascribe-accordion-list-table-toggle {
.ascribe-accordion-list-item-edition-widget { .ascribe-accordion-list-item-edition-widget {
cursor: pointer; cursor: pointer;
//margin-left: 0.3em;
&:hover { &:hover {
color: $ascribe-color-full; color: $ascribe-color-dark;
}
.glyphicon {
top: 1px !important;
font-size: 0.8em;
} }
} }

View File

@ -11,8 +11,8 @@
.ascribe-edition-collapsible-wrapper > div:first-child { .ascribe-edition-collapsible-wrapper > div:first-child {
width: 100%; width: 100%;
cursor: pointer; cursor: pointer;
background-color: #F5F5F5; background-color: rgba(0,0,0,0);
padding: 10px; padding: 0 10px 10px 0;
margin-top: 20px; margin-top: 20px;
} }
.ascribe-edition-collapsible-wrapper > div > span { .ascribe-edition-collapsible-wrapper > div > span {