Skip to content
This repository was archived by the owner on Apr 8, 2020. It is now read-only.

Commit b34f4f1

Browse files
ShMcKShMcK
committed
adjust page styles, add margin gaps
1 parent 10fa9b7 commit b34f4f1

File tree

16 files changed

+59
-59
lines changed

16 files changed

+59
-59
lines changed

‎lib/components/app.js‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -24,8 +24,6 @@ var __metadata = (this && this.__metadata) || function (k, v) {
2424
var React = require('react');
2525
var react_redux_1 = require('react-redux');
2626
var _components_1 = require('./_components');
27-
var theme_1 = require('./theme/theme');
28-
var MuiThemeProvider_1 = require('material-ui/styles/MuiThemeProvider');
2927
var height = atom.getSize().height;
3028
window.onresize = function () {
3129
height = atom.getSize().height;
@@ -36,7 +34,7 @@ var App = (function (_super) {
3634
_super.apply(this, arguments);
3735
}
3836
App.prototype.render = function () {
39-
return (React.createElement(MuiThemeProvider_1.default, {muiTheme: theme_1.muiTheme}, React.createElement("section", {className: 'cr', key: 'main', style: { height: height }}, React.createElement(_components_1.AppMenu, __assign({}, this.props.store)), React.createElement(_components_1.Routes, __assign({}, this.props.store, {ref: 'route'})), React.createElement(_components_1.Alert, __assign({}, this.props.store)))));
37+
return (React.createElement("section", {className: 'cr', key: 'main', style: { height: height }}, React.createElement(_components_1.AppMenu, __assign({}, this.props.store)), React.createElement(_components_1.Routes, __assign({}, this.props.store, {ref: 'route'})), React.createElement(_components_1.Alert, __assign({}, this.props.store))));
4038
};
4139
App = __decorate([
4240
react_redux_1.connect(function (store) {

‎lib/components/page/content.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,5 +4,5 @@ var _components_1 = require('../_components');
44
var Card_1 = require('material-ui/Card');
55
exports.PageContent = function (_a) {
66
var page = _a.page;
7-
return (React.createElement(Card_1.Card, null, React.createElement(Card_1.CardHeader, {title: page.title}), React.createElement(Card_1.CardText, null, React.createElement(_components_1.Markdown, null, page.description))));
7+
return (React.createElement(Card_1.Card, {className: 'cr-page-content'}, React.createElement(Card_1.CardHeader, {title: page.title}), React.createElement(Card_1.CardText, null, React.createElement(_components_1.Markdown, null, page.description))));
88
};

‎lib/components/page/page.js‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -14,8 +14,6 @@ var __assign = (this && this.__assign) || Object.assign || function(t) {
1414
};
1515
var React = require('react');
1616
var ReactDOM = require('react-dom');
17-
var Paper_1 = require('material-ui/Paper');
18-
var Divider_1 = require('material-ui/Divider');
1917
var content_1 = require('./content');
2018
var tasks_1 = require('./tasks/tasks');
2119
var hints_1 = require('./hints/hints');
@@ -38,7 +36,7 @@ var Page = (function (_super) {
3836
var _a = this.props, page = _a.page, taskPosition = _a.taskPosition, hintPosition = _a.hintPosition, tasks = _a.tasks, testRun = _a.testRun;
3937
var task = taskPosition <= tasks.length ? tasks[taskPosition] : null;
4038
var allComplete = taskPosition >= tasks.length;
41-
return (React.createElement(Paper_1.default, {style: pageStyle, zDepth: 1, className: 'cr-page', ref: 'page'}, React.createElement(content_1.PageContent, __assign({}, this.props)), React.createElement(Divider_1.default, null), React.createElement(tasks_1.Tasks, __assign({}, this.props)), React.createElement("div", {className: 'listEnd', ref: 'listEnd'}), React.createElement(page_complete_1.PageCompleteMessage, {page: page}), React.createElement(hints_1.Hints, {task: task, hintPosition: hintPosition}), React.createElement(toolbar_1.PageToolbar, __assign({}, this.props), React.createElement(progress_bar_1.ProgressBar, {taskPosition: taskPosition, taskCount: tasks.length}))));
39+
return (React.createElement("section", {className: 'cr-page'}, React.createElement(content_1.PageContent, __assign({}, this.props)), React.createElement(tasks_1.Tasks, __assign({}, this.props)), React.createElement("div", {className: 'listEnd', ref: 'listEnd'}), React.createElement(page_complete_1.PageCompleteMessage, {page: page}), React.createElement(hints_1.Hints, {task: task, hintPosition: hintPosition}), React.createElement(toolbar_1.PageToolbar, __assign({}, this.props), React.createElement(progress_bar_1.ProgressBar, {taskPosition: taskPosition, taskCount: tasks.length}))));
4240
};
4341
return Page;
4442
}(React.Component));

‎lib/components/page/tasks/tasks.js‎

Lines changed: 12 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,17 @@
11
"use strict";
2+
var __assign = (this && this.__assign) || Object.assign || function(t) {
3+
for (var s, i = 1, n = arguments.length; i < n; i++) {
4+
s = arguments[i];
5+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6+
t[p] = s[p];
7+
}
8+
return t;
9+
};
10+
var _this = this;
211
var React = require('react');
312
var _components_1 = require('../../_components');
413
var List_1 = require('material-ui/List');
14+
var Card_1 = require('material-ui/Card');
515
var Subheader_1 = require('material-ui/Subheader');
616
var colors_1 = require('material-ui/styles/colors');
717
var check_box_1 = require('material-ui/svg-icons/toggle/check-box');
@@ -24,21 +34,13 @@ var TaskCheckbox = function (_a) {
2434
}
2535
return React.createElement("span", {className: 'cr-task-checkbox'}, icon);
2636
};
27-
var TaskIndex = function (_a) {
28-
var index = _a.index;
29-
return (React.createElement("span", {className: 'cr-task-index'}, index + 1, "."));
30-
};
31-
var TaskContent = function (_a) {
32-
var task = _a.task;
33-
return (React.createElement("div", {className: 'cr-task-description'}, React.createElement(_components_1.Markdown, null, task.description)));
34-
};
3537
exports.Task = function (_a) {
3638
var task = _a.task, taskPosition = _a.taskPosition, index = _a.index, testRun = _a.testRun;
3739
var isCompleted = index < taskPosition;
38-
return (React.createElement(List_1.ListItem, {key: index, className: 'cr-task', style: { backgroundColor: isCompleted ? '#c8e6c9' : 'inherit' }}, React.createElement(TaskCheckbox, {index: index, taskPosition: taskPosition, testRun: testRun}), React.createElement(TaskIndex, {index: index}), React.createElement(TaskContent, {task: task})));
40+
return (React.createElement(List_1.ListItem, {key: index, className: 'cr-task', style: { backgroundColor: isCompleted ? '#c8e6c9' : 'inherit' }}, React.createElement(TaskCheckbox, __assign({}, _this.props)), React.createElement("span", {className: 'cr-task-index'}, index + 1, "."), React.createElement("div", {className: 'cr-task-description'}, React.createElement(_components_1.Markdown, null, task.description))));
3941
};
4042
exports.Tasks = function (_a) {
4143
var tasks = _a.tasks, taskPosition = _a.taskPosition, testRun = _a.testRun;
4244
var visTasks = visibleTasks(tasks, taskPosition);
43-
return React.createElement(List_1.List, {className: 'cr-tasks'}, React.createElement(Subheader_1.default, null, "Tasks"), visTasks.map(function (task, index) { return React.createElement(exports.Task, {key: index, task: task, taskPosition: taskPosition, index: index, testRun: testRun}); }));
45+
return React.createElement(Card_1.Card, {className: 'cr-tasks'}, React.createElement(List_1.List, null, React.createElement(Subheader_1.default, null, "Tasks"), visTasks.map(function (task, index) { return React.createElement(exports.Task, {key: index, index: index, task: task, taskPosition: taskPosition, testRun: testRun}); })));
4446
};

‎lib/components/progress/progress.js‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -76,7 +76,6 @@ var ProgressPage = (function (_super) {
7676
}(React.Component));
7777
;
7878
var style = {
79-
height: '100%',
8079
width: '100%',
8180
margin: 0
8281
};

‎lib/components/render.js‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,14 @@
1-
'use strict';
1+
"use strict";
22
var React = require('react');
33
var ReactDOM = require('react-dom');
44
var react_redux_1 = require('react-redux');
55
var store_1 = require('../store/store');
66
var app_1 = require('./app');
7+
var theme_1 = require('./theme/theme');
8+
var MuiThemeProvider_1 = require('material-ui/styles/MuiThemeProvider');
79
require('./remove-later');
810
function render(target) {
9-
ReactDOM.render(React.createElement(react_redux_1.Provider, {store: store_1.store}, React.createElement(app_1.App, null)), target);
11+
ReactDOM.render(React.createElement(react_redux_1.Provider, {store: store_1.store}, React.createElement(MuiThemeProvider_1.default, {muiTheme: theme_1.muiTheme}, React.createElement(app_1.App, null))), target);
1012
}
1113
exports.render = render;
1214
var rootName = 'crv';

‎lib/components/start/start.js‎

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,14 @@ var __extends = (this && this.__extends) || function (d, b) {
44
function __() { this.constructor = d; }
55
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
66
};
7+
var __assign = (this && this.__assign) || Object.assign || function(t) {
8+
for (var s, i = 1, n = arguments.length; i < n; i++) {
9+
s = arguments[i];
10+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
11+
t[p] = s[p];
12+
}
13+
return t;
14+
};
715
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
816
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
917
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
@@ -13,6 +21,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
1321
var __metadata = (this && this.__metadata) || function (k, v) {
1422
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
1523
};
24+
var _this = this;
1625
var React = require('react');
1726
var react_redux_1 = require('react-redux');
1827
var store_1 = require('../../store/store');
@@ -51,5 +60,5 @@ exports.Start = function (_a) {
5160
var checks = _a.checks;
5261
return (React.createElement("section", {className: 'cr-start'}, React.createElement("div", {className: 'cr-start-header'}, checks.passed
5362
? React.createElement(Welcome, null)
54-
: React.createElement(checks_1.Checks, {checks: checks}))));
63+
: React.createElement(checks_1.Checks, __assign({}, _this.props)))));
5564
};

‎src/components/app.tsx‎

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,7 @@
11
import * as React from 'react';
22
import {connect} from 'react-redux';
33
import {AppMenu, Routes, Alert} from './_components';
4-
import {muiTheme} from './theme/theme';
5-
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
4+
65

76
let height: number = atom.getSize().height;
87
window.onresize = function() {
@@ -15,14 +14,11 @@ window.onresize = function() {
1514
export class App extends React.Component<{store?: CR.State}, {}> {
1615
render(): React.ReactElement<{}> {
1716
return (
18-
<MuiThemeProvider muiTheme={muiTheme}>
1917
<section className='cr' key='main' style={{height}}>
2018
<AppMenu {...this.props.store} />
2119
<Routes {...this.props.store} ref='route' />
2220
<Alert {...this.props.store} />
2321
</section>
24-
</MuiThemeProvider>
25-
2622
);
2723
}
2824
};

‎src/components/page/_page.less‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,10 @@
77
.cr-page {
88
position: relative;
99
overflow-y: scroll;
10+
&-content {
11+
margin: 5px;
12+
}
1013
.listEnd {
11-
margin-bottom: 100px;
14+
margin-bottom: 130px;
1215
}
1316
}

‎src/components/page/content.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import {Card, CardHeader, CardText} from 'material-ui/Card';
55
export const PageContent: React.StatelessComponent<{
66
page: CR.Page
77
}> = ({page}) => (
8-
<Card>
8+
<Card className='cr-page-content'>
99
<CardHeader title={page.title} />
1010
<CardText>
1111
<Markdown>{page.description}</Markdown>

0 commit comments

Comments
 (0)