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

fix: remove margin, padding, and line-height for preview of finished projects

Browse Source
This commit is contained in:
moT01
2021-11-19 12:16:01 -06:00
parent fbcd160a49
commit 0db11a0819
4 changed files with 30 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
client/src/templates/Challenges/components/project-preview-modal.css
View File

@ -1,3 +1,4 @@
/* .project-preview-modal {
min-width: 70%;
} */
.project-preview-modal-body {
line-height: 0;
padding: 0;
}

16
client/src/templates/Challenges/rechallenge/builders.js
View File

@ -27,6 +27,16 @@ const defaultTemplate = ({ source }) => {
</body>`;
};
// for demo/preview modal of a finished project
const demoTemplate = ({ source }) => {
return `
<body id='display-body'>
<!-- fcc-start-source -->
${source}
<!-- fcc-end-source -->
</body>`;
};
const wrapInScript = partial(
transformContents,
content => `${htmlCatch}<script>${content}${jsCatch}</script>`
@ -73,9 +83,11 @@ function wasHtmlFile(challengeFile) {
export function concatHtml({
required = [],
template,
challengeFiles = []
challengeFiles = [],
useDemoTemplate = false
} = {}) {
const createBody = template ? _template(template) : defaultTemplate;
const templateToUse = useDemoTemplate ? demoTemplate : defaultTemplate;
const createBody = template ? _template(template) : templateToUse;
const head = required
.map(({ link, src }) => {
if (link && src) {

4
client/src/templates/Challenges/redux/execute-challenge-saga.js
View File

@ -244,7 +244,9 @@ function* previewProjectSolutionSaga({ payload }) {
try {
if (canBuildChallenge(challengeData)) {
const buildData = yield buildChallengeData(challengeData);
const buildData = yield buildChallengeData(challengeData, {
useDemoTemplate: true
});
if (challengeHasPreview(challengeData)) {
const document = yield getContext('document');
yield call(updateProjectPreview, buildData, document);

11
client/src/templates/Challenges/utils/build.js
View File

@ -99,6 +99,7 @@ export async function buildChallenge(challengeData, options) {
const { challengeType } = challengeData;
let build = buildFunctions[challengeType];
if (build) {
if (options?.useDemoTemplate) challengeData.useDemoTemplate = true;
return build(challengeData, options);
}
throw new Error(`Cannot build challenge of type ${challengeType}`);
@ -148,7 +149,8 @@ async function getDOMTestRunner(buildData, { proxyLogger }, document) {
export function buildDOMChallenge({
challengeFiles,
required = [],
template = ''
template = '',
useDemoTemplate = false
}) {
const finalRequires = [...globalRequires, ...required, ...frameRunner];
const loadEnzyme = challengeFiles.some(
@ -161,7 +163,12 @@ export function buildDOMChallenge({
.then(checkFilesErrors)
.then(challengeFiles => ({
challengeType: challengeTypes.html,
build: concatHtml({ required: finalRequires, template, challengeFiles }),
build: concatHtml({
required: finalRequires,
template,
challengeFiles,
useDemoTemplate
}),
sources: buildSourceMap(challengeFiles),
loadEnzyme
}));