gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

chore(ui): Minor UI/Copy fixes (#17237)

Browse Source
This commit is contained in:
Stuart Taylor
2018-05-25 16:49:47 +01:00
committed by mrugesh mohapatra
parent 0bb4fbfcea
commit 9eb7cf1ae1
11 changed files with 71 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
client/less/main.less
View File

@ -1059,3 +1059,4 @@ and (max-width : 400px) {
&{ @import "./code-mirror.less"; }
&{ @import "./toastr.less"; }
&{ @import "../../common/index.less"; }
&{ @import "./userHome.less"; }

7
client/less/userHome.less Normal file
View File

@ -0,0 +1,7 @@
.quote-partial {
blockquote {
font-size: 3.5rem;
border: none;
}
}

33
common/app/routes/Profile/components/Certificates.jsx
View File

@ -42,59 +42,59 @@ const mapStateToProps = createSelector(
currentCerts: [
{
show: is2018FullStackCert,
title: 'Full Stack Certification:',
title: 'Full Stack Certification',
showURL: '2018-full-stack'
},
{
show: isRespWebDesignCert,
title: 'Responsive Web Design Certification:',
title: 'Responsive Web Design Certification',
showURL: 'responsive-web-design'
},
{
show: isJsAlgoDataStructCert,
title: 'JavaScript Algorithms and Data Structures Certification:',
title: 'JavaScript Algorithms and Data Structures Certification',
showURL: 'javascript-algorithms-and-data-structures'
},
{
show: isFrontEndLibsCert,
title: 'Front End Libraries Certification:',
title: 'Front End Libraries Certification',
showURL: 'front-end-libraries'
},
{
show: is2018DataVisCert,
title: 'Data Visualization Certification:',
title: 'Data Visualization Certification',
showURL: 'data-visualization'
},
{
show: isApisMicroservicesCert,
title: 'APIs and Microservices Certification:',
title: 'APIs and Microservices Certification',
showURL: 'apis-and-microservices'
},
{
show: isInfosecQaCert,
title: 'Information Security and Quality Assurance Certification:',
title: 'Information Security and Quality Assurance Certification',
showURL: 'information-security-and-quality-assurance'
}
],
legacyCerts: [
{
show: isFullStackCert,
title: 'Full Stack Certification:',
title: 'Full Stack Certification',
showURL: 'legacy-full-stack'
},
{
show: isFrontEndCert,
title: 'Front End Certification:',
title: 'Front End Certification',
showURL: 'legacy-front-end'
},
{
show: isBackEndCert,
title: 'Back End Certification:',
title: 'Back End Certification',
showURL: 'legacy-back-end'
},
{
show: isDataVisCert,
title: 'Data Visualization Certification:',
title: 'Data Visualization Certification',
showURL: 'legacy-data-visualization'
}
]
@ -124,21 +124,14 @@ const propTypes = {
function renderCertShow(username, cert) {
return cert.show ? (
<Row key={ cert.showURL }>
<Col sm={ 8 }>
<p className='bigger-text'>
<strong>
{ cert.title }
</strong>
</p>
</Col>
<Col sm={ 2 } smPush={ 2 }>
<Col sm={ 10 } smPush={ 1 }>
<Button
block={ true }
bsSize='lg'
bsStyle='primary'
href={ `/certification/${username}/${cert.showURL}`}
>
Show
View {cert.title}
</Button>
</Col>
</Row>

10
common/app/routes/Settings/Toggle-Button/Toggle-Button.jsx
View File

@ -6,14 +6,18 @@ import ns from './ns.json';
const propTypes = {
name: PropTypes.string.isRequired,
offLabel: PropTypes.string,
onChange: PropTypes.func.isRequired,
onLabel: PropTypes.string,
value: PropTypes.bool.isRequired
};
export default function ToggleButton({
name,
onChange,
value
value,
onLabel = 'On',
offLabel = 'Off'
}) {
return (
<div className={ `${ns}-container` }>
@ -30,7 +34,7 @@ export default function ToggleButton({
type='radio'
value={ 1 }
>
On
{ onLabel }
</TB>
<TB
bsSize='lg'
@ -40,7 +44,7 @@ export default function ToggleButton({
type='radio'
value={ 2 }
>
Off
{ offLabel }
</TB>
</BSBG>
</div>

2
common/app/routes/Settings/components/Honesty.jsx
View File

@ -45,7 +45,7 @@ class Honesty extends PureComponent {
const isHonestAgreed = (
<Panel bsStyle='info'>
<p>
You have accepted our Academic Honesty Policy
You have accepted our Academic Honesty Policy.
</p>
</Panel>
);

25
common/app/routes/Settings/components/Privacy-Settings.jsx
View File

@ -57,43 +57,58 @@ function PrivacySettings(props) {
<FullWidthRow>
<p>
The settings in this section enable you to control what is show on{' '}
your freeCodeCamp public profile.
your freeCodeCamp public portfolio.
</p>
<ToggleSetting
action='Make my profile completely private'
explain='Your certifications will be disabled'
explain={
'While your profile is completely private, no one will be able to ' +
'see your certifications'
}
flag={ isLocked }
flagName='isLocked'
offLabel='Public'
onLabel='Private'
toggleFlag={ toggleFlag('isLocked') }
/>
<ToggleSetting
action='Make my name completely private'
flag={ !showName }
flagName='name'
offLabel='Public'
onLabel='Private'
toggleFlag={ toggleFlag('showName') }
/>
<ToggleSetting
action='Make my location completely private'
flag={ !showLocation }
flagName='showLocation'
offLabel='Public'
onLabel='Private'
toggleFlag={ toggleFlag('showLocation') }
/>
<ToggleSetting
action='Make my "about me" completely private'
flag={ !showAbout }
flagName='showAbout'
offLabel='Public'
onLabel='Private'
toggleFlag={ toggleFlag('showAbout') }
/>
<ToggleSetting
action='Make my points completely private'
flag={ !showPoints }
flagName='showPoints'
offLabel='Public'
onLabel='Private'
toggleFlag={ toggleFlag('showPoints') }
/>
<ToggleSetting
action='Make my heat map completely private'
flag={ !showHeatMap }
flagName='showHeatMap'
offLabel='Public'
onLabel='Private'
toggleFlag={ toggleFlag('showHeatMap') }
/>
<ToggleSetting
@ -101,18 +116,24 @@ function PrivacySettings(props) {
explain='Your certifications will be disabled'
flag={ !showCerts }
flagName='showCerts'
offLabel='Public'
onLabel='Private'
toggleFlag={ toggleFlag('showCerts') }
/>
<ToggleSetting
action='Make my portfolio completely private'
flag={ !showPortfolio }
flagName='showPortfolio'
offLabel='Public'
onLabel='Private'
toggleFlag={ toggleFlag('showPortfolio') }
/>
<ToggleSetting
action='Make my time line completely private'
flag={ !showTimeLine }
flagName='showTimeLine'
offLabel='Public'
onLabel='Private'
toggleFlag={ toggleFlag('showTimeLine') }
/>
</FullWidthRow>

6
common/app/routes/Settings/components/ToggleSetting.jsx
View File

@ -21,12 +21,13 @@ export default function ToggleSetting({
explain,
flag,
flagName,
toggleFlag
toggleFlag,
...restProps
}) {
return (
<Row className='inline-form'>
<Col sm={ 8 } xs={ 12 }>
<ControlLabel htmlFor={ flagName }>
<ControlLabel className='toggle-label' htmlFor={ flagName }>
<p>
<strong>
{ action }
@ -43,6 +44,7 @@ export default function ToggleSetting({
name={ flagName }
onChange={ toggleFlag }
value={ flag }
{...restProps}
/>
</Col>
</Row>

10
common/app/routes/Settings/settings.less
View File

@ -65,6 +65,16 @@
.privacy-settings {
.toggle-label {
margin: 0;
p {
display: flex;
flex-direction: column;
margin: 0;
}
}
.inline-form {
display: flex;
align-items: center;

2
server/views/homePartials/quote.jade
View File

@ -1,4 +1,4 @@
.row
.row.quote-partial
.col-xs-12.col-sm-8.col-sm-offset-2
blockquote.blockquote
span=quote

8
server/views/homePartials/stats.jade
View File

@ -7,7 +7,7 @@
| &nbsp;of&nbsp;
strong
span.green-text=challengeCount
| &nbsp;lessons.
| &nbsp;coding challenges.
p.stats
| You have built&nbsp;
strong
@ -15,7 +15,7 @@
| out of&nbsp;
strong
span.green-text 30
| projects
| projects.
if !!completedLegacyCertCount
p.stats
| You have earned&nbsp;
@ -24,7 +24,7 @@
| out of&nbsp;
strong
span.green-text 3
| legacy certifications
| legacy certifications.
p.stats
| You have earned&nbsp;
strong
@ -32,4 +32,4 @@
| out of&nbsp;
strong
span.green-text 6
| certifications
| certifications.

2
server/views/noUserHome.jade
View File

@ -84,8 +84,6 @@ block content
a.btn.btn-cta.signup-btn.btn-block(href="/signin") Start coding (it's free)
.big-break
.big-break
include homePartials/quote
.big-break
hr
.big-break
.big-break