Merge branch 'MDL-68209-master-2' of git://github.com/bmbrands/moodle

This commit is contained in:
Víctor Déniz Falcón 2020-05-28 16:37:21 +01:00
commit 37f2c91a8c
10 changed files with 200 additions and 76 deletions

View File

@ -33,15 +33,15 @@
}
}}
<div data-region="carousel" class="carousel slide">
<div class="carousel-inner" aria-live="polite">
<div class="carousel-item px-4 py-3 active" data-region="modules">
<div class="modchoosercontainer" aria-label="{{#str}} activitymodules, core {{/str}}">
<div data-region="carousel" class="carousel slide d-flex flex-fill">
<div class="carousel-inner d-flex flex-fill" aria-live="polite">
<div class="carousel-item p-3 active" data-region="modules">
<div class="modchoosercontainer d-flex flex-column flex-fill" aria-label="{{#str}} activitymodules, core {{/str}}">
<div class="searchcontainer mb-3">
{{>core_course/local/activitychooser/search}}
</div>
<div data-region="chooser-container">
<div class="nav nav-tabs mb-3" id="activities-{{uniqid}}" role="tablist">
<div data-region="chooser-container" class="chooser-container">
<div class="nav nav-tabs z-index-1" id="activities-{{uniqid}}" role="tablist">
<a class="nav-item nav-link {{#favouritesFirst}}active{{/favouritesFirst}} {{^favourites}}d-none{{/favourites}}"
id="starred-tab-{{uniqid}}"
data-toggle="tab"
@ -108,7 +108,7 @@
{{#str}} recommended, core {{/str}}
</a>
</div>
<div class="tab-content" id="tabbed-activities-{{uniqid}}">
<div class="tab-content flex-fill border-left border-right border-bottom bg-light" id="tabbed-activities-{{uniqid}}">
<div class="tab-pane {{#favouritesFirst}}active{{/favouritesFirst}}" id="starred-{{uniqid}}" data-region="favourites" role="tabpanel" aria-labelledby="starred-tab-{{uniqid}}">
<div class="optionscontainer d-flex flex-wrap p-1 mw-100 position-relative" role="menubar" data-region="chooser-options-container" data-render="favourites-area">
{{>core_course/local/activitychooser/favourites}}

View File

@ -33,7 +33,7 @@
}
}}
<div class="optionsummary" tabindex="-1" data-region="chooser-option-summary-container" aria-labelledby="optionsummary_label" aria-describedby="optionsumary_desc">
<div class="content text-left mb-5 px-5 py-4" data-region="chooser-option-summary-content-container">
<div class="content text-left mb-5 p-2 px-sm-5 py-sm-4" data-region="chooser-option-summary-content-container">
<div class="heading mb-4">
<h5 id="optionsummary_label-{{uniqid}}" data-region="summary-header" tabindex="0">
{{{icon}}}

View File

@ -29,15 +29,15 @@
"icon": "<img class='icon' src='http://urltooptionicon'>"
}
}}
<div role="menuitem" tabindex="-1" aria-label="{{title}}" class="option d-block text-center py-1 mb-1 aabtn" data-region="chooser-option-container" data-internal="{{name}}" data-modname="{{componentname}}_{{link}}">
<div class="optioninfo w-100" data-region="chooser-option-info-container">
<a class="d-block" href="{{link}}" title="{{#str}} addnew, moodle, {{title}} {{/str}}" tabindex="-1" data-action="add-chooser-option">
<span class="optionicon d-block">
<div role="menuitem" tabindex="-1" aria-label="{{title}}" class="option border-0 card m-1 bg-white" data-region="chooser-option-container" data-internal="{{name}}" data-modname="{{componentname}}_{{link}}">
<div class="optioninfo card-body d-flex flex-column text-center p-1" data-region="chooser-option-info-container">
<a class="d-flex flex-column justify-content-between flex-fill" href="{{link}}" title="{{#str}} addnew, moodle, {{title}} {{/str}}" tabindex="-1" data-action="add-chooser-option">
<div class="optionicon mt-2 mb-1 icon-size-5 icon-no-margin">
{{{icon}}}
</span>
<p class="optionname d-block mt-2 mb-0"> {{#shortentext}}20, {{title}}{{/shortentext}}</p>
</div>
<div class="optionname clamp-2">{{title}}</div>
</a>
<div class="optionactions btn-group" role="group" data-region="chooser-option-actions-container">
<div class="optionactions d-flex justify-content-center" role="group" data-region="chooser-option-actions-container">
{{^legacyitem}}
<button class="btn btn-icon icon-no-margin icon-size-3 m-0 optionaction {{#favourite}}text-primary{{/favourite}}{{^favourite}}text-muted{{/favourite}}"
data-action="manage-module-favourite"

View File

@ -33,8 +33,10 @@
}
}}
<p class="mt-4 px-3 pb-1">{{#str}} resultsfound, core, {{searchresultsnumber}} {{/str}}</p>
<div class="searchresultitemscontainer d-flex flex-wrap mw-100 position-relative p-1 mt-4" role="menubar" data-region="search-result-items-container">
<div class="bg-light searchresultitemscontainer-wrapper border">
<div class="searchresultitemscontainer d-flex flex-wrap mw-100 position-relative p-1" role="menubar" data-region="search-result-items-container">
{{#searchresults}}
{{>core_course/local/activitychooser/item}}
{{/searchresults}}
</div>
</div>

View File

@ -250,7 +250,7 @@ class behat_course extends behat_base {
// Clicks the selected activity if it exists.
$activityxpath = "//div[contains(concat(' ', normalize-space(@class), ' '), ' modchooser ')]" .
"/descendant::div[contains(concat(' ', normalize-space(@class), ' '), ' optioninfo ')]" .
"/descendant::p[contains(concat(' ', normalize-space(@class), ' '), ' optionname ')]" .
"/descendant::div[contains(concat(' ', normalize-space(@class), ' '), ' optionname ')]" .
"[normalize-space(.)=$activityliteral]" .
"/parent::a";

View File

@ -279,7 +279,7 @@
{{#attachments}}
{{^isimage}}
<div class="mt-3">
<span class="icon-size-5">{{#pix}} {{icon}}, core {{/pix}}</span>
<span class="icon-size-6">{{#pix}} {{icon}}, core {{/pix}}</span>
<div class="align-bottom d-inline-block">
<a
href="{{{url}}}"

View File

@ -1605,8 +1605,23 @@ body#page-lib-editor-tinymce-plugins-moodlemedia-preview {
*/
.modchooser .modal-body {
padding: 0;
min-height: 640px;
overflow-y: auto;
min-height: 640px;
display: flex;
flex-direction: column;
.searchresultitemscontainer-wrapper {
min-height: 495px;
}
.carousel-item.active {
display: flex;
}
.chooser-container {
display: flex;
flex-direction: column;
flex: 1 1 auto;
}
.loading-icon {
opacity: 1;
@ -1618,7 +1633,7 @@ body#page-lib-editor-tinymce-plugins-moodlemedia-preview {
}
}
.carousel-item .loading-icon .icon {
margin: 5em auto;
margin: 1em auto;
}
}
@ -1643,8 +1658,8 @@ body#page-lib-editor-tinymce-plugins-moodlemedia-preview {
.modchoosercontainer .searchresultitemscontainer {
overflow-x: hidden;
.option {
// Six items per line.
flex-basis: 16.66%;
// 2 items per line.
flex-basis: calc(50% - 0.5rem);
.optionactions {
.optionaction {
cursor: pointer;
@ -1660,15 +1675,6 @@ body#page-lib-editor-tinymce-plugins-moodlemedia-preview {
&:hover {
text-decoration: none;
}
.optionicon {
.icon {
margin: 0;
padding: 0;
width: 32px;
height: 32px;
font-size: 32px;
}
}
}
}
}
@ -1698,14 +1704,6 @@ body#page-lib-editor-tinymce-plugins-moodlemedia-preview {
}
}
@include media-breakpoint-down(lg) {
.modchoosercontainer .optionscontainer .option,
.modchoosercontainer .searchresultitemscontainer .option {
// Five items per line.
flex-basis: 20%;
}
}
@include media-breakpoint-down(xs) {
.path-course-view .modal-dialog.modal-lg,
.path-course-view .modal-content,
@ -1717,15 +1715,31 @@ body#page-lib-editor-tinymce-plugins-moodlemedia-preview {
.modchoosercontainer,
.optionscontainer,
.searchresultitemscontainer {
min-height: auto;
height: 100%;
overflow-y: auto;
}
.path-course-view .modal-dialog.modal-lg {
margin: 0;
}
.modchooser .modal-body .searchresultitemscontainer-wrapper {
min-height: auto;
}
}
@include media-breakpoint-up(sm) {
.modchoosercontainer .optionscontainer .option,
.modchoosercontainer .searchresultitemscontainer .option {
// Four items per line.
flex-basis: 25%;
// Three items per line.
flex-basis: calc(33.33% - 0.5rem);
}
}
@include media-breakpoint-up(lg) {
.modchoosercontainer .optionscontainer .option,
.modchoosercontainer .searchresultitemscontainer .option {
// Six items per line.
flex-basis: calc(16.66% - 0.5rem);
}
}

View File

@ -16,7 +16,9 @@ $iconsizes: map-merge((
2: ($icon-width * .5),
3: $icon-width,
4: ($icon-width * 1.5),
5: ($icon-width * 3)
5: ($icon-width * 2),
6: ($icon-width * 2.5),
7: ($icon-width * 3)
), $iconsizes);
// stylelint-enable

View File

@ -10979,8 +10979,18 @@ body#page-lib-editor-tinymce-plugins-moodlemedia-preview {
*/
.modchooser .modal-body {
padding: 0;
overflow-y: auto;
min-height: 640px;
overflow-y: auto; }
display: flex;
flex-direction: column; }
.modchooser .modal-body .searchresultitemscontainer-wrapper {
min-height: 495px; }
.modchooser .modal-body .carousel-item.active {
display: flex; }
.modchooser .modal-body .chooser-container {
display: flex;
flex-direction: column;
flex: 1 1 auto; }
.modchooser .modal-body .loading-icon {
opacity: 1; }
.modchooser .modal-body .loading-icon .icon {
@ -10989,7 +10999,7 @@ body#page-lib-editor-tinymce-plugins-moodlemedia-preview {
height: 1em;
width: 1em; }
.modchooser .modal-body .carousel-item .loading-icon .icon {
margin: 5em auto; }
margin: 1em auto; }
.modchoosercontainer.noscroll {
overflow-y: hidden; }
@ -11009,7 +11019,7 @@ body#page-lib-editor-tinymce-plugins-moodlemedia-preview {
overflow-x: hidden; }
.modchoosercontainer .optionscontainer .option,
.modchoosercontainer .searchresultitemscontainer .option {
flex-basis: 16.66%; }
flex-basis: calc(50% - 0.5rem); }
.modchoosercontainer .optionscontainer .option .optionactions .optionaction,
.modchoosercontainer .searchresultitemscontainer .option .optionactions .optionaction {
cursor: pointer;
@ -11023,13 +11033,6 @@ body#page-lib-editor-tinymce-plugins-moodlemedia-preview {
.modchoosercontainer .optionscontainer .option .optioninfo a:hover,
.modchoosercontainer .searchresultitemscontainer .option .optioninfo a:hover {
text-decoration: none; }
.modchoosercontainer .optionscontainer .option .optioninfo a .optionicon .icon,
.modchoosercontainer .searchresultitemscontainer .option .optioninfo a .optionicon .icon {
margin: 0;
padding: 0;
width: 32px;
height: 32px;
font-size: 32px; }
.modchooser .modal-body .optionsummary {
background-color: #fff;
@ -11047,11 +11050,6 @@ body#page-lib-editor-tinymce-plugins-moodlemedia-preview {
border-top: 1px solid #dee2e6;
background: #fff; }
@media (max-width: 1199.98px) {
.modchoosercontainer .optionscontainer .option,
.modchoosercontainer .searchresultitemscontainer .option {
flex-basis: 20%; } }
@media (max-width: 575.98px) {
.path-course-view .modal-dialog.modal-lg,
.path-course-view .modal-content,
@ -11063,12 +11061,23 @@ body#page-lib-editor-tinymce-plugins-moodlemedia-preview {
.modchoosercontainer,
.optionscontainer,
.searchresultitemscontainer {
height: 100%; }
min-height: auto;
height: 100%;
overflow-y: auto; }
.path-course-view .modal-dialog.modal-lg {
margin: 0; }
.modchooser .modal-body .searchresultitemscontainer-wrapper {
min-height: auto; } }
@media (min-width: 576px) {
.modchoosercontainer .optionscontainer .option,
.modchoosercontainer .searchresultitemscontainer .option {
flex-basis: 25%; } }
flex-basis: calc(33.33% - 0.5rem); } }
@media (min-width: 992px) {
.modchoosercontainer .optionscontainer .option,
.modchoosercontainer .searchresultitemscontainer .option {
flex-basis: calc(16.66% - 0.5rem); } }
/* Form element: listing */
.formlistingradio {
@ -11902,6 +11911,22 @@ body.h5p-embed .h5pmessages {
/* stylelint-disable-line declaration-no-important */ }
.icon-size-5 .icon {
height: 32px !important;
/* stylelint-disable-line declaration-no-important */
width: 32px !important;
/* stylelint-disable-line declaration-no-important */
font-size: 32px !important;
/* stylelint-disable-line declaration-no-important */ }
.icon-size-6 .icon {
height: 40px !important;
/* stylelint-disable-line declaration-no-important */
width: 40px !important;
/* stylelint-disable-line declaration-no-important */
font-size: 40px !important;
/* stylelint-disable-line declaration-no-important */ }
.icon-size-7 .icon {
height: 48px !important;
/* stylelint-disable-line declaration-no-important */
width: 48px !important;
@ -15206,6 +15231,16 @@ a.ygtvspacer:hover {
width: 44px !important;
/* stylelint-disable-line declaration-no-important */ }
.message-app .btn.btn-link.btn-icon.icon-size-5 {
height: 52px !important;
/* stylelint-disable-line declaration-no-important */
width: 52px !important;
/* stylelint-disable-line declaration-no-important */ }
.message-app .btn.btn-link.btn-icon.icon-size-6 {
height: 60px !important;
/* stylelint-disable-line declaration-no-important */
width: 60px !important;
/* stylelint-disable-line declaration-no-important */ }
.message-app .btn.btn-link.btn-icon.icon-size-7 {
height: 68px !important;
/* stylelint-disable-line declaration-no-important */
width: 68px !important;
@ -17869,6 +17904,24 @@ p.arrow_button {
line-height: 24px !important;
/* stylelint-disable-line declaration-no-important */ }
.btn.btn-icon.icon-size-5 {
height: 52px !important;
/* stylelint-disable-line declaration-no-important */
width: 52px !important;
/* stylelint-disable-line declaration-no-important */
font-size: 32px !important;
/* stylelint-disable-line declaration-no-important */
line-height: 32px !important;
/* stylelint-disable-line declaration-no-important */ }
.btn.btn-icon.icon-size-6 {
height: 60px !important;
/* stylelint-disable-line declaration-no-important */
width: 60px !important;
/* stylelint-disable-line declaration-no-important */
font-size: 40px !important;
/* stylelint-disable-line declaration-no-important */
line-height: 40px !important;
/* stylelint-disable-line declaration-no-important */ }
.btn.btn-icon.icon-size-7 {
height: 68px !important;
/* stylelint-disable-line declaration-no-important */
width: 68px !important;

View File

@ -11186,8 +11186,18 @@ body#page-lib-editor-tinymce-plugins-moodlemedia-preview {
*/
.modchooser .modal-body {
padding: 0;
overflow-y: auto;
min-height: 640px;
overflow-y: auto; }
display: flex;
flex-direction: column; }
.modchooser .modal-body .searchresultitemscontainer-wrapper {
min-height: 495px; }
.modchooser .modal-body .carousel-item.active {
display: flex; }
.modchooser .modal-body .chooser-container {
display: flex;
flex-direction: column;
flex: 1 1 auto; }
.modchooser .modal-body .loading-icon {
opacity: 1; }
.modchooser .modal-body .loading-icon .icon {
@ -11196,7 +11206,7 @@ body#page-lib-editor-tinymce-plugins-moodlemedia-preview {
height: 1em;
width: 1em; }
.modchooser .modal-body .carousel-item .loading-icon .icon {
margin: 5em auto; }
margin: 1em auto; }
.modchoosercontainer.noscroll {
overflow-y: hidden; }
@ -11216,7 +11226,7 @@ body#page-lib-editor-tinymce-plugins-moodlemedia-preview {
overflow-x: hidden; }
.modchoosercontainer .optionscontainer .option,
.modchoosercontainer .searchresultitemscontainer .option {
flex-basis: 16.66%; }
flex-basis: calc(50% - 0.5rem); }
.modchoosercontainer .optionscontainer .option .optionactions .optionaction,
.modchoosercontainer .searchresultitemscontainer .option .optionactions .optionaction {
cursor: pointer;
@ -11230,13 +11240,6 @@ body#page-lib-editor-tinymce-plugins-moodlemedia-preview {
.modchoosercontainer .optionscontainer .option .optioninfo a:hover,
.modchoosercontainer .searchresultitemscontainer .option .optioninfo a:hover {
text-decoration: none; }
.modchoosercontainer .optionscontainer .option .optioninfo a .optionicon .icon,
.modchoosercontainer .searchresultitemscontainer .option .optioninfo a .optionicon .icon {
margin: 0;
padding: 0;
width: 32px;
height: 32px;
font-size: 32px; }
.modchooser .modal-body .optionsummary {
background-color: #fff;
@ -11254,11 +11257,6 @@ body#page-lib-editor-tinymce-plugins-moodlemedia-preview {
border-top: 1px solid #dee2e6;
background: #fff; }
@media (max-width: 1199.98px) {
.modchoosercontainer .optionscontainer .option,
.modchoosercontainer .searchresultitemscontainer .option {
flex-basis: 20%; } }
@media (max-width: 575.98px) {
.path-course-view .modal-dialog.modal-lg,
.path-course-view .modal-content,
@ -11270,12 +11268,23 @@ body#page-lib-editor-tinymce-plugins-moodlemedia-preview {
.modchoosercontainer,
.optionscontainer,
.searchresultitemscontainer {
height: 100%; }
min-height: auto;
height: 100%;
overflow-y: auto; }
.path-course-view .modal-dialog.modal-lg {
margin: 0; }
.modchooser .modal-body .searchresultitemscontainer-wrapper {
min-height: auto; } }
@media (min-width: 576px) {
.modchoosercontainer .optionscontainer .option,
.modchoosercontainer .searchresultitemscontainer .option {
flex-basis: 25%; } }
flex-basis: calc(33.33% - 0.5rem); } }
@media (min-width: 992px) {
.modchoosercontainer .optionscontainer .option,
.modchoosercontainer .searchresultitemscontainer .option {
flex-basis: calc(16.66% - 0.5rem); } }
/* Form element: listing */
.formlistingradio {
@ -12116,6 +12125,22 @@ body.h5p-embed .h5pmessages {
/* stylelint-disable-line declaration-no-important */ }
.icon-size-5 .icon {
height: 32px !important;
/* stylelint-disable-line declaration-no-important */
width: 32px !important;
/* stylelint-disable-line declaration-no-important */
font-size: 32px !important;
/* stylelint-disable-line declaration-no-important */ }
.icon-size-6 .icon {
height: 40px !important;
/* stylelint-disable-line declaration-no-important */
width: 40px !important;
/* stylelint-disable-line declaration-no-important */
font-size: 40px !important;
/* stylelint-disable-line declaration-no-important */ }
.icon-size-7 .icon {
height: 48px !important;
/* stylelint-disable-line declaration-no-important */
width: 48px !important;
@ -15424,6 +15449,16 @@ a.ygtvspacer:hover {
width: 44px !important;
/* stylelint-disable-line declaration-no-important */ }
.message-app .btn.btn-link.btn-icon.icon-size-5 {
height: 52px !important;
/* stylelint-disable-line declaration-no-important */
width: 52px !important;
/* stylelint-disable-line declaration-no-important */ }
.message-app .btn.btn-link.btn-icon.icon-size-6 {
height: 60px !important;
/* stylelint-disable-line declaration-no-important */
width: 60px !important;
/* stylelint-disable-line declaration-no-important */ }
.message-app .btn.btn-link.btn-icon.icon-size-7 {
height: 68px !important;
/* stylelint-disable-line declaration-no-important */
width: 68px !important;
@ -18103,6 +18138,24 @@ p.arrow_button {
line-height: 24px !important;
/* stylelint-disable-line declaration-no-important */ }
.btn.btn-icon.icon-size-5 {
height: 52px !important;
/* stylelint-disable-line declaration-no-important */
width: 52px !important;
/* stylelint-disable-line declaration-no-important */
font-size: 32px !important;
/* stylelint-disable-line declaration-no-important */
line-height: 32px !important;
/* stylelint-disable-line declaration-no-important */ }
.btn.btn-icon.icon-size-6 {
height: 60px !important;
/* stylelint-disable-line declaration-no-important */
width: 60px !important;
/* stylelint-disable-line declaration-no-important */
font-size: 40px !important;
/* stylelint-disable-line declaration-no-important */
line-height: 40px !important;
/* stylelint-disable-line declaration-no-important */ }
.btn.btn-icon.icon-size-7 {
height: 68px !important;
/* stylelint-disable-line declaration-no-important */
width: 68px !important;