Andal.LND/frontend-app-learning
6
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

AA-512: underline links within iframes (#347)

Browse Source
This commit is contained in:
Carla Duarte
2021-01-25 11:11:14 -05:00
committed by GitHub
parent 984010a8ec
commit 47fd6bfe18
4 changed files with 34 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/course-home/outline-tab/LmsHtmlFragment.css Normal file
View File

@@ -0,0 +1,11 @@
body a {
color: #00688D;
}
body.inline-link a {
text-decoration: underline;
}
body.small {
font-size: 0.875rem;
}

29
src/course-home/outline-tab/LmsHtmlFragment.jsx
View File

@@ -3,16 +3,22 @@ import PropTypes from 'prop-types';
import { getConfig } from '@edx/frontend-platform';
export default function LmsHtmlFragment({ html, title, ...rest }) {
export default function LmsHtmlFragment({
className,
html,
title,
...rest
}) {
const wholePage = `
<html>
<head>
<base href="${getConfig().LMS_BASE_URL}" target="_parent">
<link rel="stylesheet" href="/static/css/bootstrap/lms-main.css">
</head>
<body>${html}</body>
</html>
`;
<html>
<head>
<base href="${getConfig().LMS_BASE_URL}" target="_parent">
<link rel="stylesheet" href="/static/css/bootstrap/lms-main.css">
<link rel="stylesheet" type="text/css" href="${getConfig().BASE_URL}/src/course-home/outline-tab/LmsHtmlFragment.css">
</head>
<body class="${className}">${html}</body>
</html>
`;
const iframe = useRef(null);
function handleLoad() {
@@ -33,7 +39,12 @@ export default function LmsHtmlFragment({ html, title, ...rest }) {
);
}
LmsHtmlFragment.defaultProps = {
className: '',
};
LmsHtmlFragment.propTypes = {
className: PropTypes.string,
html: PropTypes.string.isRequired,
title: PropTypes.string.isRequired,
};

1
src/course-home/outline-tab/widgets/CourseHandouts.jsx
View File

@@ -20,6 +20,7 @@ function CourseHandouts({ courseId, intl }) {
<section className="mb-4">
<h2 className="h4">{intl.formatMessage(messages.handouts)}</h2>
<LmsHtmlFragment
className="small"
html={handoutsHtml}
title={intl.formatMessage(messages.handouts)}
/>

2
src/course-home/outline-tab/widgets/WelcomeMessage.jsx
View File

@@ -55,6 +55,7 @@ function WelcomeMessage({ courseId, intl }) {
<TransitionReplace className="mb-3" enterDuration={200} exitDuration={200}>
{showShortMessage ? (
<LmsHtmlFragment
className="inline-link"
data-testid="short-welcome-message-iframe"
key="short-html"
html={shortWelcomeMessageHtml}
@@ -62,6 +63,7 @@ function WelcomeMessage({ courseId, intl }) {
/>
) : (
<LmsHtmlFragment
className="inline-link"
data-testid="long-welcome-message-iframe"
key="full-html"
html={welcomeMessageHtml}