Andal.LND/edx-platform
4
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

fix: advanced editor styling on library authoring [FC-0076] (#36146)

Browse Source 
Fixes the styles for the advanced editors (poll, survey, LTI Provider, etc). Updated the code if `xblock_v2/xblock_iframe.html` to use `course-unit-mfe-iframe-bundle.scss`
This commit is contained in:
Rômulo Penido
2025-01-30 14:36:21 -03:00
committed by GitHub
parent 672ce2dcac
commit 4f13ee0171
6 changed files with 54 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
cms/envs/common.py
View File

@@ -843,6 +843,7 @@ LEARNER_PROGRESS_PROMPT_FOR_NON_ACTIVE_CONTRACT = ''
# Public domain name of Studio (should be resolvable from the end-user's browser)
CMS_BASE = 'localhost:18010'
CMS_ROOT_URL = "https://localhost:18010"
LOG_DIR = '/edx/var/log/edx'

1
cms/envs/production.py
View File

@@ -163,6 +163,7 @@ EMAIL_FILE_PATH = ENV_TOKENS.get('EMAIL_FILE_PATH', DATA_DIR / "emails" / "studi
CMS_BASE = ENV_TOKENS.get('CMS_BASE')
LMS_BASE = ENV_TOKENS.get('LMS_BASE')
LMS_ROOT_URL = ENV_TOKENS.get('LMS_ROOT_URL')
CMS_ROOT_URL = ENV_TOKENS.get('CMS_ROOT_URL')
LMS_INTERNAL_ROOT_URL = ENV_TOKENS.get('LMS_INTERNAL_ROOT_URL', LMS_ROOT_URL)
ENTERPRISE_API_URL = ENV_TOKENS.get('ENTERPRISE_API_URL', LMS_INTERNAL_ROOT_URL + '/enterprise/api/v1/')
ENTERPRISE_CONSENT_API_URL = ENV_TOKENS.get('ENTERPRISE_CONSENT_API_URL', LMS_INTERNAL_ROOT_URL + '/consent/api/v1/')

3
cms/envs/test.py
View File

@@ -136,6 +136,9 @@ LMS_BASE = "localhost:8000"
LMS_ROOT_URL = f"http://{LMS_BASE}"
FEATURES['PREVIEW_LMS_BASE'] = "preview.localhost"
CMS_BASE = "localhost:8001"
CMS_ROOT_URL = f"http://{CMS_BASE}"
COURSE_AUTHORING_MICROFRONTEND_URL = "http://course-authoring-mfe"
DISCUSSIONS_MICROFRONTEND_URL = "http://discussions-mfe"

33
cms/static/sass/course-unit-mfe-iframe-bundle.scss
View File

@@ -200,7 +200,7 @@ body {
}
}
.modal-window.modal-editor {
.modal-window.modal-editor, &.xblock-iframe-content {
background-color: $white;
border-radius: 6px;
@@ -381,6 +381,37 @@ body {
.modal-lg.modal-window.confirm.openassessment_modal_window {
height: 635px;
}
// Additions for the xblock editor on the Library Authoring
&.xblock-iframe-content {
// Reset the max-height to allow the settings list to grow
.wrapper-comp-settings .list-input.settings-list {
max-height: unset;
}
// For Google Docs and Google Calendar xblock editor
.google-edit-wrapper .xblock-inputs {
position: unset;
overflow-y: unset;
}
.xblock-actions {
padding: ($baseline*0.75) 2% ($baseline/2) 2%;
position: sticky;
bottom: 0;
.action-item {
@extend %t-action3;
display: inline-block;
margin-right: ($baseline*0.75);
&:last-child {
margin-right: 0;
}
}
}
}
}
.view-container .content-primary {

24
common/templates/xblock_v2/xblock_iframe.html
View File

@@ -1,6 +1,7 @@
<!DOCTYPE html>
<html>
<!-- Set the height of the iframe to 100% of the viewport height to avoid an extra scrollbar -->
<html style="height: 100vh;">
<head>
<!-- Open links in a new tab, not this iframe -->
<base target="_blank">
@@ -81,8 +82,11 @@
href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<!-- Capa Problem Editing requires CodeMirror -->
<link rel="stylesheet" href="{{ lms_root_url }}/static/js/vendor/CodeMirror/codemirror.css">
<!-- Built-in XBlocks (and some plugins) depends on LMS CSS -->
<link rel="stylesheet" href="{{ lms_root_url }}/static/css/lms-course.css">
<!-- Additional CSS for the XBlock Editor on the Library Authoring -->
<link rel="stylesheet" href="{{ cms_root_url }}/static/studio/css/vendor/normalize.css">
<link rel="stylesheet" href="{{ cms_root_url }}/static/studio/css/studio-main-v1.css" />
<link rel="stylesheet" href="{{ cms_root_url }}/static/studio/css/course-unit-mfe-iframe-bundle.css" />
<!-- Configure and load MathJax -->
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
@@ -156,11 +160,13 @@
<!-- The default stylesheet will set the body min-height to 100% (a common strategy to allow for background
images to fill the viewport), but this has the undesireable side-effect of causing an infinite loop via the onResize
event listeners below, in certain situations. Resetting it to the default "auto" skirts the problem.-->
<body style="min-height: auto; background-color: white;">
<!-- fragment body -->
{{ fragment.body_html | safe }}
<!-- fragment foot -->
{{ fragment.foot_html | safe }}
<body style="min-height: auto; background-color: white;" class="view-container">
<div class="wrapper xblock-iframe-content">
<!-- fragment body -->
{{ fragment.body_html | safe }}
<!-- fragment foot -->
{{ fragment.foot_html | safe }}
</div>
<script>
/**
* Map of all URL handlers for this block and its children, keyed by usage
@@ -216,7 +222,7 @@
return url;
},
notify: (eventName, data) => {
/**
/**
* Used in `studio_view` to notify events and errors
**/
window.parent.postMessage({

2
openedx/core/djangoapps/xblock/rest_api/views.py
View File

@@ -118,10 +118,12 @@ def embed_block_view(request, usage_key: UsageKeyV2, view_name: str):
# for key in itertools.chain([block.scope_ids.usage_id], getattr(block, 'children', []))
# }
lms_root_url = configuration_helpers.get_value('LMS_ROOT_URL', settings.LMS_ROOT_URL)
cms_root_url = configuration_helpers.get_value('CMS_ROOT_URL', settings.CMS_ROOT_URL)
context = {
'fragment': fragment,
'handler_urls_json': json.dumps(handler_urls),
'lms_root_url': lms_root_url,
'cms_root_url': cms_root_url,
'view_name': view_name,
'is_development': settings.DEBUG,
}