diff --git a/client/homebrew/assets/frame_border.png b/client/homebrew/assets/frame_border.png new file mode 100644 index 000000000..b0c0bf808 Binary files /dev/null and b/client/homebrew/assets/frame_border.png differ diff --git a/client/homebrew/editPage/editPage.jsx b/client/homebrew/editPage/editPage.jsx index 3cc542eff..0d1582674 100644 --- a/client/homebrew/editPage/editPage.jsx +++ b/client/homebrew/editPage/editPage.jsx @@ -2,6 +2,7 @@ var React = require('react'); var _ = require('lodash'); var cx = require('classnames'); +var Statusbar = require('../statusbar/statusbar.jsx'); var PHB = require('../phb/phb.jsx'); var Editor = require('../editor/editor.jsx'); @@ -25,7 +26,8 @@ var EditPage = React.createClass({ getInitialState: function() { return { - text: this.props.entry.text + text: this.props.entry.text, + pending : false }; }, @@ -65,6 +67,12 @@ var EditPage = React.createClass({ return
{temp} + + +
diff --git a/client/homebrew/editor/editor.jsx b/client/homebrew/editor/editor.jsx index a1bf70b20..6f6c3a536 100644 --- a/client/homebrew/editor/editor.jsx +++ b/client/homebrew/editor/editor.jsx @@ -38,7 +38,7 @@ var Icons = [ }, { icon : 'fa-table', - snippet : "", + snippet : Snippets.classTable, tooltip : "Class Table" }, { diff --git a/client/homebrew/editor/snippets.js b/client/homebrew/editor/snippets.js index 8be8686a0..09275f22d 100644 --- a/client/homebrew/editor/snippets.js +++ b/client/homebrew/editor/snippets.js @@ -104,7 +104,11 @@ module.exports = { "> ***Multiattack.*** The armor makes two two melee attacks.", ">", "> ***Slam.*** *Melee Weapon Attack:* +4 to hit, reach 5ft., one target. *Hit* 5 (1d6 + 2) ", - ].join('\n') + ].join('\n'), + + classTable : [ + + ].join('\n'), } \ No newline at end of file diff --git a/client/homebrew/phb/phb.less b/client/homebrew/phb/phb.less index 1cf2b9f64..b0cf07f1e 100644 --- a/client/homebrew/phb/phb.less +++ b/client/homebrew/phb/phb.less @@ -73,27 +73,17 @@ overflow: hidden; //Accents - &:before, &:after{ + &:after{ content : ""; position: absolute; height: 50px; width: 100%; - + bottom : 0px; left: 0px; background-size: cover; width : 100%; background-image : url('/assets/homebrew/assets/accent.png'); } - &:before{ - top: 0px; - } - &:after{ - -moz-transform: scaleY(-1); - -o-transform: scaleY(-1); - -webkit-transform: scaleY(-1); - transform: scaleY(-1); - bottom : 0px; - } p,ul,blockquote{ @@ -140,6 +130,14 @@ -webkit-column-span : all; column-span : all; background-color: white; + border-image-source: url('/assets/homebrew/assets/frame_border.png'); + border-image-slice: 150 200 150 200; + border-image-width: 47px; + border-image-outset: 37px 17px; + border-image-repeat: round; + margin: 40px 0px; + border-collapse: separate; + border: initial; } table{ width : 100%; @@ -151,13 +149,19 @@ th{ padding-bottom : 0.3em; } - } - tr{ - td{ - padding : 0.2em 0em; + tr{ + //background-color : white; } - &:nth-child(even){ - background : @green; + + } + tbody{ + tr{ + td{ + padding : 0.2em 0em; + } + &:nth-child(odd){ + background-color : @green; + } } } } @@ -218,6 +222,18 @@ -webkit-column-span : 1; column-span : 1; background-color: transparent; + border-image: none; + margin: 0; + thead{ + tr{ + //background-color: transparent; + } + } + tbody{ + tr:nth-child(odd), tr:nth-child(even){ + background-color: transparent; + } + } } table{ color : @header; @@ -323,7 +339,7 @@ &::first-letter{ float: left; margin-top: 0.3em; - margin-bottom: 0.3em; + margin-bottom: 0.4em; font-family: Solbera; font-size: 10em; color : #222; diff --git a/client/homebrew/statusbar/statusbar.jsx b/client/homebrew/statusbar/statusbar.jsx index 14cc12450..a77235fec 100644 --- a/client/homebrew/statusbar/statusbar.jsx +++ b/client/homebrew/statusbar/statusbar.jsx @@ -2,21 +2,73 @@ var React = require('react'); var _ = require('lodash'); var cx = require('classnames'); +var Logo = require('naturalCrit/logo/logo.jsx'); + var Statusbar = React.createClass({ getDefaultProps: function() { return { + editId: null, + shareId : null, + isPending : false, + info : null }; }, - render : function(){ - var self = this; - return( -
- Statusbar Ready! + renderInfo : function(){ + //render last update? + //number of times viewed? + }, + + renderNewButton : function(){ + if(this.props.editId) return null; + + return + + New + + }, + + renderLinks : function(){ + if(!this.props.editId) return null; + + return [ +
+ Edit Link + +
, +
+ Share Link +
- ); + ] + }, + + renderStatus : function(){ + if(!this.props.editId) return null; + + var text = 'Saved.' + if(this.props.isPending){ + text = 'Saving...' + } + return
+ {text} +
+ }, + + render : function(){ + console.log(this.props); + return
+ + Statusbar Ready! + +
+ {this.renderLinks()} + {this.renderStatus()} + {this.renderNewButton()} +
+
} }); diff --git a/client/homebrew/statusbar/statusbar.less b/client/homebrew/statusbar/statusbar.less index f287122a8..a9588bb65 100644 --- a/client/homebrew/statusbar/statusbar.less +++ b/client/homebrew/statusbar/statusbar.less @@ -1,3 +1,12 @@ .statusbar{ + font-size : 1.8em; + color : white; + svg{ + vertical-align : middle; + height : 1em; + margin-right : 0.2em; + cursor : pointer; + fill : white; + } } \ No newline at end of file diff --git a/client/naturalCrit/naturalCrit.less b/client/naturalCrit/naturalCrit.less index da9fcfd6a..0c81a9c0c 100644 --- a/client/naturalCrit/naturalCrit.less +++ b/client/naturalCrit/naturalCrit.less @@ -4,6 +4,8 @@ @import 'naturalCrit/styles/colors.less'; @import 'naturalCrit/styles/tooltip.less'; +@import 'font-awesome/css/font-awesome.css'; + html,body, #reactContainer, .naturalCrit{ min-height : 100%; } diff --git a/shared/naturalCrit/logo/CODE Bold.otf b/shared/naturalCrit/logo/CODE Bold.otf new file mode 100644 index 000000000..50dd77d23 Binary files /dev/null and b/shared/naturalCrit/logo/CODE Bold.otf differ diff --git a/shared/naturalCrit/logo/CODE Light.otf b/shared/naturalCrit/logo/CODE Light.otf new file mode 100644 index 000000000..1ff9d8795 Binary files /dev/null and b/shared/naturalCrit/logo/CODE Light.otf differ diff --git a/shared/naturalCrit/logo/logo.jsx b/shared/naturalCrit/logo/logo.jsx new file mode 100644 index 000000000..313dd32f4 --- /dev/null +++ b/shared/naturalCrit/logo/logo.jsx @@ -0,0 +1,12 @@ +var React = require('react'); + +var Logo = React.createClass({ + render : function(){ + return
+ + +
+ } +}); + +module.exports = Logo; diff --git a/shared/naturalCrit/logo/logo.less b/shared/naturalCrit/logo/logo.less new file mode 100644 index 000000000..e69de29bb