[#1897] My details + results framework improvement WIP

akvo · Feb 8, 2016 · 96bb48f · 96bb48f
1 parent 6efe02a
commit 96bb48f
Show file tree

Hide file tree

Showing 12 changed files with 323 additions and 188 deletions.
diff --git a/akvo/rsr/static/scripts-src/my-details-employments.js b/akvo/rsr/static/scripts-src/my-details-employments.js
@@ -207,7 +207,7 @@ var FormButton = React.createClass({displayName: 'FormButton',
             return button(
                 {
                     onClick: this.handleAddEmployment,
-                    className: 'btn btn-primary',
+                    className: 'btn btn-default btn-sm',
                     type: "button"
                 },
                 i18n.request_join_text
@@ -377,7 +377,7 @@ var EmploymentApp = React.createClass({displayName: 'EmploymentApp',
     render: function() {
         var icon = React.createFactory("i");
         var headingIcon = icon({className: 'fa fa-users'});
-        var heading = React.createElement("h3", null, headingIcon, ' ', i18n.my_organisations_text);
+        var heading = React.createElement("h4", null, ' ', i18n.my_organisations_text);
         var employmentList = React.createElement(EmploymentList, {employments: this.state.employments, removeEmployment: this.removeEmployment});
         var addEmploymentForm = React.createElement(AddEmploymentForm, {link: this.props.link, org_link: this.props.org_link, country_link: this.props.country_link, addEmployment: this.addEmployment, existingEmployment: this.existingEmployment});
         return React.createElement("span", null, heading, employmentList, addEmploymentForm);

diff --git a/akvo/rsr/static/scripts-src/my-details-employments.jsx b/akvo/rsr/static/scripts-src/my-details-employments.jsx
@@ -207,7 +207,7 @@ var FormButton = React.createClass({
             return button(
                 {
                     onClick: this.handleAddEmployment,
-                    className: 'btn btn-primary',
+                    className: 'btn btn-default btn-sm',
                     type: "button"
                 },
                 i18n.request_join_text
@@ -377,7 +377,7 @@ var EmploymentApp = React.createClass({
     render: function() {
         var icon = React.createFactory("i");
         var headingIcon = icon({className: 'fa fa-users'});
-        var heading = React.createElement("h3", null, headingIcon, ' ', i18n.my_organisations_text);
+        var heading = React.createElement("h4", null, ' ', i18n.my_organisations_text);
         var employmentList = React.createElement(EmploymentList, {employments: this.state.employments, removeEmployment: this.removeEmployment});
         var addEmploymentForm = React.createElement(AddEmploymentForm, {link: this.props.link, org_link: this.props.org_link, country_link: this.props.country_link, addEmployment: this.addEmployment, existingEmployment: this.existingEmployment});
         return React.createElement("span", null, heading, employmentList, addEmploymentForm);

diff --git a/akvo/rsr/static/scripts-src/my-user-management.js b/akvo/rsr/static/scripts-src/my-user-management.js
@@ -554,7 +554,7 @@ InviteButton = React.createClass({displayName: 'InviteButton',
     render: function() {
         return (
             ModalTrigger( {modal:InviteModal(null )}, 
-                Button( {title:i18n.invite_users_text, className:"btn btn-default btn-xs"}, 
+                Button( {title:i18n.invite_users_text, className:"btn btn-default btn-sm"}, 
                     React.DOM.i( {className:"glyphicon glyphicon-user"}), " +"
                 )
             )

diff --git a/akvo/rsr/static/scripts-src/my-user-management.jsx b/akvo/rsr/static/scripts-src/my-user-management.jsx
@@ -554,7 +554,7 @@ InviteButton = React.createClass({
     render: function() {
         return (
             <ModalTrigger modal={<InviteModal />}>
-                <Button title={i18n.invite_users_text} className="btn btn-default btn-xs">
+                <Button title={i18n.invite_users_text} className="btn btn-default btn-sm">
                     <i className="glyphicon glyphicon-user"></i> +
                 </Button>
             </ModalTrigger>

diff --git a/akvo/rsr/static/scripts-src/results-data.js b/akvo/rsr/static/scripts-src/results-data.js
@@ -859,14 +859,14 @@ var MainContent = React.createClass({displayName: 'MainContent',
                     React.DOM.div( {className:"indicator-description"}, 
                         this.props.selectedIndicator.description
                     ),
-                    React.DOM.dl( {className:"baseline"}, 
+                    React.DOM.div( {className:"baseline"}, 
                         React.DOM.div( {className:"baseline-year"}, 
-                            React.DOM.dt(null, i18n.baseline_year),
-                            React.DOM.dd(null, this.props.selectedIndicator.baseline_year)
-                        ),
+                            i18n.baseline_year,
+                            React.DOM.span(null, this.props.selectedIndicator.baseline_year)
+                        ), 
                         React.DOM.div( {className:"baseline-value"}, 
-                            React.DOM.dt(null, i18n.baseline_value),
-                            React.DOM.dd(null, this.props.selectedIndicator.baseline_value)
+                            i18n.baseline_value,
+                            React.DOM.span(null, this.props.selectedIndicator.baseline_value)
                         )
                     ),
                     React.createElement(IndicatorPeriodList, {

diff --git a/akvo/rsr/static/scripts-src/results-data.jsx b/akvo/rsr/static/scripts-src/results-data.jsx
@@ -859,16 +859,16 @@ var MainContent = React.createClass({
                     <div className="indicator-description">
                         {this.props.selectedIndicator.description}
                     </div>
-                    <dl className="baseline">
+                    <div className="baseline">
                         <div className="baseline-year">
-                            <dt>{i18n.baseline_year}</dt>
-                            <dd>{this.props.selectedIndicator.baseline_year}</dd>
-                        </div>
+                            {i18n.baseline_year}
+                            <span>{this.props.selectedIndicator.baseline_year}</span>
+                        </div> 
                         <div className="baseline-value">
-                            <dt>{i18n.baseline_value}</dt>
-                            <dd>{this.props.selectedIndicator.baseline_value}</dd>
+                            {i18n.baseline_value}
+                            <span>{this.props.selectedIndicator.baseline_value}</span>
                         </div>
-                    </dl>
+                    </div>
                     {React.createElement(IndicatorPeriodList, {
                         selectedIndicator: this.props.selectedIndicator,
                         selectedPeriod: this.props.selectedPeriod,