update task hints component styles

ShMcK · ShMcK · commit 2e0e278bcc30 · 2016-04-17T10:22:03.000+08:00
diff --git a/lib/components/page/hints/hints.js b/lib/components/page/hints/hints.js
@@ -11,5 +11,5 @@ exports.Hints = function (_a) {
         return null;
     }
     var hint = hints[hintPosition];
-    return (React.createElement(Card_1.Card, {className: 'cr-task-hints'}, React.createElement(Card_1.CardHeader, {title: 'Hints', avatar: React.createElement(help_1.default, null), actAsExpander: true, showExpandableButton: true}), React.createElement(Card_1.CardText, {className: 'cr-task-hint', expandable: true}, React.createElement(_components_1.Markdown, null, hint)), React.createElement(Card_1.CardActions, {expandable: true}, React.createElement(buttons_1.HintButton, {label: 'Previous', hintPosition: hintPosition, hintsLength: hints.length, type: 'prev'}), React.createElement(buttons_1.HintButton, {label: 'Next', hintPosition: hintPosition, hintsLength: hints.length, type: 'next'}))));
+    return (React.createElement(Card_1.Card, {className: 'cr-task-hints'}, React.createElement(Card_1.CardHeader, {title: 'Hints', avatar: React.createElement(help_1.default, null), actAsExpander: true, showExpandableButton: true}), React.createElement(Card_1.CardText, {className: 'cr-task-hint', expandable: true}, React.createElement(_components_1.Markdown, null, hint)), React.createElement(Card_1.CardActions, {expandable: true, className: 'cr-task-hints-actions'}, React.createElement(buttons_1.HintButton, {label: 'Previous', hintPosition: hintPosition, hintsLength: hints.length, type: 'prev'}), React.createElement(buttons_1.HintButton, {label: 'Next', hintPosition: hintPosition, hintsLength: hints.length, type: 'next'}))));
 };
diff --git a/src/components/page/hints/_hints.less b/src/components/page/hints/_hints.less
@@ -1,8 +1,12 @@
 .cr-task-hints {
   position: fixed;
-  bottom: 60px;
-  right: 0;
+  bottom: 20px;
+  padding-bottom: 20px;
+  right: 20px;
   margin: 0;
-  width: 400px;
+  width: 360px;
   text-align: center;
+  &-actions {
+      padding-bottom: 30px !important;
+  }
 }
diff --git a/src/components/page/hints/hints.tsx b/src/components/page/hints/hints.tsx
@@ -22,7 +22,7 @@ export const Hints: React.StatelessComponent<{
       <CardText className='cr-task-hint' expandable={true}>
         <Markdown>{hint}</Markdown>
       </CardText>
-      <CardActions expandable={true}>
+      <CardActions expandable={true} className='cr-task-hints-actions'>
         <HintButton label='Previous' hintPosition={hintPosition} hintsLength={hints.length} type='prev' />
         <HintButton label='Next' hintPosition={hintPosition} hintsLength={hints.length} type='next' />
       </CardActions>

Original file line number	Diff line number	Diff line change
`@@ -11,5 +11,5 @@ exports.Hints = function (_a) {`
`11`	`11`	`return null;`
`12`	`12`	`}`
`13`	`13`	`var hint = hints[hintPosition];`
`14`		- return (React.createElement(Card_1.Card, {className: 'cr-task-hints'}, React.createElement(Card_1.CardHeader, {title: 'Hints', avatar: React.createElement(help_1.default, null), actAsExpander: true, showExpandableButton: true}), React.createElement(Card_1.CardText, {className: 'cr-task-hint', expandable: true}, React.createElement(_components_1.Markdown, null, hint)), React.createElement(Card_1.CardActions, {expandable: true}, React.createElement(buttons_1.HintButton, {label: 'Previous', hintPosition: hintPosition, hintsLength: hints.length, type: 'prev'}), React.createElement(buttons_1.HintButton, {label: 'Next', hintPosition: hintPosition, hintsLength: hints.length, type: 'next'}))));
	`14`	+ return (React.createElement(Card_1.Card, {className: 'cr-task-hints'}, React.createElement(Card_1.CardHeader, {title: 'Hints', avatar: React.createElement(help_1.default, null), actAsExpander: true, showExpandableButton: true}), React.createElement(Card_1.CardText, {className: 'cr-task-hint', expandable: true}, React.createElement(_components_1.Markdown, null, hint)), React.createElement(Card_1.CardActions, {expandable: true, className: 'cr-task-hints-actions'}, React.createElement(buttons_1.HintButton, {label: 'Previous', hintPosition: hintPosition, hintsLength: hints.length, type: 'prev'}), React.createElement(buttons_1.HintButton, {label: 'Next', hintPosition: hintPosition, hintsLength: hints.length, type: 'next'}))));
`15`	`15`	`};`