Skip to content

Commit

Permalink
Baseline 3 w/ updated SLDS
Browse files Browse the repository at this point in the history
  • Loading branch information
michaelhoefer committed Mar 1, 2018
1 parent c638e8c commit 6094517
Show file tree
Hide file tree
Showing 1,980 changed files with 25,894 additions and 42,472 deletions.
3 changes: 2 additions & 1 deletion .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -3,4 +3,5 @@ node_modules
.idea/
.env
*.iml
temp.*
temp.*
temp/*
65 changes: 0 additions & 65 deletions README.md

This file was deleted.

11 changes: 11 additions & 0 deletions client/js/app.js
Original file line number Diff line number Diff line change
Expand Up @@ -21,13 +21,19 @@ import PackageOrgHome from './packageorgs/PackageOrgHome';
import PackageOrgRecord from './packageorgs/PackageOrgRecord';
import PackageOrgView from './packageorgs/PackageOrgView';

import OrgGroupRecord from "./orggroups/OrgGroupRecord";
import OrgGroupHome from "./orggroups/OrgGroupHome";
import OrgGroupView from "./orggroups/OrgGroupView";
import OrgGroupForm from "./orggroups/OrgGroupForm";

let App = React.createClass({
render: function () {
return (
<div>
<header className="menu">
<ul className="slds-list--horizontal">
<li className="slds-list__item"><IndexLink to="/"><Icon name="account" theme={null}/>Orgs</IndexLink></li>
<li className="slds-list__item"><IndexLink to="/orggroups"><Icon name="groups" theme={null}/>Org Groups</IndexLink></li>
<li className="slds-list__item"><Link to="/licenses"><Icon name="drafts" theme={null}/>Licenses</Link></li>
<li className="slds-list__item"><Link to="/packages"><Icon name="thanks" theme={null}/>Packages</Link></li>
<li className="slds-list__item"><Link to="/packageorgs"><Icon name="people" theme={null}/>Package Orgs</Link></li>
Expand All @@ -50,6 +56,11 @@ render((
<Route path="org" component={OrgRecord}>
<Route path=":orgId" component={OrgView}/>
</Route>
<Route path="orggroups" component={OrgGroupHome}/>
<Route path="orggroup" component={OrgGroupRecord}>
<Route path=":orgGroupId" component={OrgGroupView}/>
<Route path=":orgGroupId/edit" component={OrgGroupForm}/>
</Route>
<Route path="packages" component={PackageHome}/>
<Route path="package" component={PackageRecord}>
<Route path=":packageId" component={PackageView}/>
Expand Down
20 changes: 0 additions & 20 deletions client/js/common/StateChangeHandler.js

This file was deleted.

30 changes: 15 additions & 15 deletions client/js/components/DataGrid.js
Original file line number Diff line number Diff line change
Expand Up @@ -75,23 +75,23 @@ let Row = React.createClass({
for (let i=0; i<this.props.columns.length; i++) {
let column = this.props.columns[i];
if (column.props && column.props.field) {
columns.push(<Column label={column.props.header} data={this.props.data} field={column.props.field}
columns.push(<Column key={column.props.field} label={column.props.header} data={this.props.data} field={column.props.field}
textAlign={column.props.textAlign} format={column.props.format}
onLink={column.props.onLink}/>);
}
}

columns.push(
<td style={{width:"50px"}}>
<ActionButton onChange={this.actionHandler}>
<DropdownItem label="Edit"/>
<DropdownItem label="Delete"/>
</ActionButton>
</td>
);
let actionColumn = [];
if (this.props.actions) {
let items = [];
for (let i = 0; i < this.props.actions.length; i++) {
items.push(<DropdownItem key={this.props.actions[i]} label={this.props.actions[i]}/>);
}
actionColumn = <ActionButton onChange={this.actionHandler}>{items}</ActionButton>;
}
columns.push(<td key="_actions" style={{width: "50px"}}>{actionColumn}</td>);

return (
<tr className="slds-hint-parent">
<tr key={this.props.key} className="slds-hint-parent">
{columns}
</tr>
);
Expand All @@ -112,19 +112,19 @@ export default React.createClass({
for (let i=0; i<this.props.children.length; i++) {
let column = this.props.children[i];
if (column.props && column.props.field) {
headers.push(<ColumnHeader field={column.props.field} label={column.props.header}
headers.push(<ColumnHeader key={column.props.field} field={column.props.field} label={column.props.header}
sortable={column.props.sortable} textAlign={column.props.textAlign}
onSort={this.sortHandler}/>);
}
}
let rows;
if (this.props.data) {
rows = this.props.data.map(item => <Row data={item} columns={this.props.children} onAction={this.props.onAction}/>);
rows = this.props.data.map((item, index) => <Row key={index} data={item} columns={this.props.children} actions={this.props.actions} onAction={this.props.onAction}/>);
}
return (
<table className="slds-table slds-table--bordered slds-max-medium-table--stacked-horizontal slds-no-row-hover">
<table className="slds-table slds-table--bordered slds-table_cell-buffer">
<thead>
<tr className="slds-text-heading--label">
<tr key="-1" className="slds-text-title_caps">
{headers}
<th></th>
</tr>
Expand Down
64 changes: 0 additions & 64 deletions client/js/components/GoogleMaps.js

This file was deleted.

26 changes: 3 additions & 23 deletions client/js/components/PageHeader.js
Original file line number Diff line number Diff line change
Expand Up @@ -37,10 +37,6 @@ export let RecordHeader = React.createClass({
}
},

followHandler() {
alert("Not implemented in this demo app");
},

render() {
return (
<div className="slds-page-header">
Expand All @@ -54,22 +50,6 @@ export let RecordHeader = React.createClass({
<p className="slds-text-heading--label">{this.props.type}</p>
<div className="slds-grid">
<h1 className="slds-text-heading--medium slds-m-right--small slds-truncate slds-align-middle" title={this.props.title}>{this.props.title}</h1>
<div className="slds-col slds-shrink-none">
<button className="slds-button slds-button--neutral slds-not-selected" aria-live="assertive" onClick={this.followHandler}>
<span className="slds-text-not-selected">
<ButtonIcon name="add" stateful={true} position="left"/>
Follow
</span>
<span className="slds-text-selected">
<ButtonIcon name="check" stateful={true} position="left"/>
Following
</span>
<span className="slds-text-selected-focus">
<ButtonIcon name="close" stateful={true} position="left"/>
Unfollow
</span>
</button>
</div>
</div>
</div>
</div>
Expand Down Expand Up @@ -106,8 +86,8 @@ export let HomeHeader = React.createClass({
},

render() {
let viewItems = this.props.viewOptions.map(item => <DropdownItem value={item.value} label={item.label} icon={item.icon}/>);
let sortItems = this.props.sortOptions.map(item => <DropdownItem value={item.value} label={item.label}/>);
let viewItems = this.props.viewOptions.map(item => <DropdownItem key={item.label} value={item.value} label={item.label} icon={item.icon}/>);
let sortItems = this.props.sortOptions.map(item => <DropdownItem key={item.label} value={item.value} label={item.label}/>);
return (
<div className="slds-page-header">
<div className="slds-grid">
Expand Down Expand Up @@ -143,7 +123,7 @@ export let HomeHeader = React.createClass({
</div>
</div>
</div>
<p className="slds-text-body--small slds-m-top--x-small">{this.props.itemCount} {this.props.type.toLowerCase()} • Sorted by Address</p>
<p className="slds-text-body--small slds-m-top--x-small">{this.props.itemCount} {this.props.type.toLowerCase()}</p>
</div>
);
}
Expand Down
45 changes: 21 additions & 24 deletions client/js/licenses/LicenseCard.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,43 +9,40 @@ export default React.createClass({
return {};
},

actionHandler(data, value, label) {
alert("TBD");
},

render() {
return (
<div className="slds-card">
<header className="slds-card__header slds-grid">
<div className="slds-media slds-media--center slds-has-flexi-truncate">
<article className="slds-card">
<div className="slds-card__header slds-grid">
<header className="slds-media slds-media_center slds-has-flexi-truncate">
<div className="slds-media__figure">
<Icon name="groups" size="small"/>
<span className="slds-icon_container slds-icon-standard-shipment" title="Installed Packages">
<svg className="slds-icon slds-icon_small" aria-hidden="true">
<use xmlnsXlink="http://www.w3.org/1999/xlink" xlinkHref="/assets/icons/standard-sprite/svg/symbols.svg#shipment"/>
</svg>
</span>
</div>
<div className="slds-media__body">
<h3 className="slds-text-heading--small slds-truncate">Installed Package</h3>
<h2>
<a href="javascript:void(0);" className="slds-card__header-link slds-truncate"
title="">
<span className="slds-text-heading_small">Installed Packages</span>
</a>
</h2>
</div>
</div>
<div className="slds-no-flex">
<div className="slds-button-group">
<button className="slds-button slds-button--icon-border-filled">
<ButtonIcon name="down"/>
<span className="slds-assistive-text">Show More</span>
</button>
</div>
</div>
</header>

<section className="slds-card__body">
<DataGrid data={this.props.licenses} onSort={this.props.onSort} onAction={this.actionHandler}>
</header>
</div>
<div className="slds-card__body">
<DataGrid data={this.props.licenses} onSort={this.props.onSort}>
<div header="Name" field="name" sortable={true}/>
<div header="Package" field="package_name" sortable={true}/>
<div header="Version Name" field="version_name" sortable={true}/>
<div header="Version Number" field="version_number" sortable={true}/>
<div header="Status" field="status" textAlign="center" sortable={true}/>
<div header="Install Date" field="install_date" sortable={true} format="date"/>
</DataGrid>
</section>
</div>
</div>
<footer className="slds-card__footer"></footer>
</article>
);
}

Expand Down
Loading

0 comments on commit 6094517

Please sign in to comment.