@@ -21,22 +21,21 @@ const styles = {
2121alignItems :'center' as 'center' ,
2222fontSize :'1rem' ,
2323lineHeight :'1rem' ,
24- padding :'1rem ' ,
24+ padding :'0.5rem ' ,
2525} ,
2626title :{
2727fontSize :'3rem' ,
28+ fontWeight :'bold' as 'bold' ,
2829} ,
2930subtitle :{
3031fontSize :'1.3rem' ,
3132} ,
3233options :{
3334flex :1 ,
34- backgroundColor :'#EBEBEB' ,
3535display :'flex' as 'flex' ,
3636flexDirection :'column' as 'column' ,
3737justifyContent :'flex-start' as 'flex-start' ,
3838alignItems :'center' as 'center' ,
39- padding :'1rem' ,
4039} ,
4140betaBadge :{
4241backgroundColor :'#6a67ce' ,
@@ -57,21 +56,27 @@ export const StartPage = (props: Props) => (
5756< div css = { styles . page } >
5857< div css = { styles . header } >
5958< Badge content = "beta" style = { styles . betaBadge } >
60- < span css = { styles . title } > CodeRoad </ span >
59+ < h1 css = { styles . title } >
60+ CodeRoad< span > </ span >
61+ </ h1 >
6162</ Badge >
6263< h3 css = { styles . subtitle } > Play Interactive Coding Tutorials in VSCode</ h3 >
64+ < p > Learn by coding in a real environment.</ p >
65+ < p > Instant feedback on save.</ p >
66+ < p > Progress saves to Git.</ p >
67+ < p > Build your portfolio as you learn.</ p >
6368</ div >
6469
6570< div css = { styles . options } >
6671< div css = { styles . buttonContainer } >
67- < Button size = "large" type = "primary" onClick = { props . onNew } style = { { width :'12rem ' } } >
68- New Tutorial
72+ < Button size = "large" type = "primary" onClick = { props . onNew } style = { { padding :'0 2.5rem ' } } >
73+ Start New Tutorial
6974</ Button >
7075</ div >
7176{ props . tutorial && (
7277< div css = { styles . buttonContainer } >
73- < Button size = "large" onClick = { props . onContinue } style = { { width :'12rem ' } } >
74- Continue" { props . tutorial . summary . title } "
78+ < Button size = "large" onClick = { props . onContinue } style = { { padding :'0 1rem ' } } >
79+ ContinueCurrent Tutorial
7580</ Button >
7681</ div >
7782) }