mirror of
https://github.com/moodle/moodle.git
synced 2025-01-17 13:38:32 +01:00
MDL-71810 calendar: responsiveness for calendar block
Co-authored-by: Andrew Nicols <andrew@nicols.co.uk>>
This commit is contained in:
Huong Nguyen
parent
9145d80b0b
commit
0328241373
@ -70,6 +70,8 @@ class block_calendar_month extends block_base {
|
||||
$this->content->footer .= $renderer->render_from_template($footertemplate, $footerdata);
|
||||
$this->content->text .= $renderer->complete_layout();
|
||||
|
||||
$this->page->requires->js_call_amd('core_calendar/popover');
|
||||
|
||||
return $this->content;
|
||||
}
|
||||
}
|
||||
|
||||
@ -35,6 +35,7 @@ Feature: Enable the calendar block in a course and test it's functionality
|
||||
When I log in as "teacher1"
|
||||
And I am on "Course 1" course homepage with editing mode on
|
||||
And I add the "Calendar" block
|
||||
And I hover over today in the mini-calendar block
|
||||
Then I should see "Site Event"
|
||||
|
||||
@javascript
|
||||
@ -53,6 +54,7 @@ Feature: Enable the calendar block in a course and test it's functionality
|
||||
And I am on "Course 1" course homepage
|
||||
And I follow "Hide site events"
|
||||
Then I should not see "Site Event"
|
||||
And I hover over today in the mini-calendar block
|
||||
And I should see "Course Event"
|
||||
|
||||
@javascript
|
||||
@ -64,6 +66,7 @@ Feature: Enable the calendar block in a course and test it's functionality
|
||||
| id_eventtype | Course |
|
||||
| id_name | Course Event |
|
||||
When I am on "Course 1" course homepage
|
||||
And I hover over today in the mini-calendar block
|
||||
Then I should see "Course Event"
|
||||
|
||||
@javascript
|
||||
@ -81,6 +84,7 @@ Feature: Enable the calendar block in a course and test it's functionality
|
||||
And I am on "Course 1" course homepage
|
||||
And I follow "Hide course events"
|
||||
Then I should not see "Course Event"
|
||||
And I hover over today in the mini-calendar block
|
||||
And I should see "User Event"
|
||||
|
||||
@javascript
|
||||
@ -92,6 +96,7 @@ Feature: Enable the calendar block in a course and test it's functionality
|
||||
| id_eventtype | User |
|
||||
| id_name | User Event |
|
||||
When I am on "Course 1" course homepage
|
||||
And I hover over today in the mini-calendar block
|
||||
Then I should see "User Event"
|
||||
|
||||
@javascript
|
||||
@ -109,6 +114,7 @@ Feature: Enable the calendar block in a course and test it's functionality
|
||||
When I am on "Course 1" course homepage
|
||||
And I follow "Hide user events"
|
||||
Then I should not see "User Event"
|
||||
And I hover over today in the mini-calendar block
|
||||
And I should see "Course Event"
|
||||
|
||||
@javascript
|
||||
@ -141,6 +147,7 @@ Feature: Enable the calendar block in a course and test it's functionality
|
||||
And I log out
|
||||
Then I log in as "student1"
|
||||
And I am on "Course 1" course homepage
|
||||
And I hover over today in the mini-calendar block
|
||||
And I should see "Group Event"
|
||||
And I log out
|
||||
And I log in as "student2"
|
||||
@ -183,4 +190,5 @@ Feature: Enable the calendar block in a course and test it's functionality
|
||||
And I am on "Course 1" course homepage
|
||||
And I follow "Hide group events"
|
||||
And I should not see "Group Event 1"
|
||||
And I hover over today in the mini-calendar block
|
||||
And I should see "Course Event 1"
|
||||
|
||||
@ -23,4 +23,5 @@ Feature: Enable the calendar block in a course
|
||||
Then I log in as "teacher1"
|
||||
And I am on "Course 1" course homepage with editing mode on
|
||||
And I add the "Calendar" block
|
||||
And I hover over today in the mini-calendar block
|
||||
And I should see "Site Event"
|
||||
|
||||
@ -15,4 +15,5 @@ Feature: View a site event on the dashboard
|
||||
| id_name | Site Event |
|
||||
And I log out
|
||||
When I log in as "student1"
|
||||
And I hover over today in the mini-calendar block
|
||||
Then I should see "Site Event"
|
||||
|
||||
@ -19,4 +19,5 @@ Feature: Enable the calendar block on the site front page
|
||||
And I log out
|
||||
When I log in as "student1"
|
||||
And I am on site homepage
|
||||
And I hover over today in the mini-calendar block
|
||||
Then I should see "Site Event"
|
||||
|
||||
@ -16,4 +16,5 @@ Feature: View a upcoming site event on the dashboard
|
||||
| id_name | My Site Event |
|
||||
And I log out
|
||||
When I log in as "student1"
|
||||
And I hover over today in the mini-calendar block
|
||||
Then I should see "My Site Event"
|
||||
|
||||
2
calendar/amd/build/calendar.min.js
vendored
2
calendar/amd/build/calendar.min.js
vendored
@ -1,2 +1,2 @@
|
||||
define ("core_calendar/calendar",["jquery","core/ajax","core/str","core/templates","core/notification","core/custom_interaction_events","core/modal_events","core/modal_factory","core_calendar/modal_event_form","core_calendar/summary_modal","core_calendar/repository","core_calendar/events","core_calendar/view_manager","core_calendar/crud","core_calendar/selectors","core/config"],function(a,b,c,d,f,g,h,i,j,k,l,m,n,o,p,q){var r={ROOT:"[data-region='calendar']",DAY:"[data-region='day']",NEW_EVENT_BUTTON:"[data-action='new-event-button']",DAY_CONTENT:"[data-region='day-content']",LOADING_ICON:".loading-icon",VIEW_DAY_LINK:"[data-action='view-day-link']",CALENDAR_MONTH_WRAPPER:".calendarwrapper",TODAY:".today"},s=function(b,c,e,g){var h=null,i=g.attr("data-day-timestamp");if(e){h=e.attr("data-day-timestamp")}if(!e||h!=i){d.render("core/loading",{}).then(function(a,b){g.find(r.DAY_CONTENT).addClass("hidden");d.appendNodeContents(g,a,b);if(e){e.find(r.DAY_CONTENT).addClass("hidden");d.appendNodeContents(e,a,b)}}).then(function(){return l.updateEventStartDay(c,i)}).then(function(){a("body").trigger(m.eventMoved,[c,e,g])}).always(function(){var a=g.find(r.LOADING_ICON);g.find(r.DAY_CONTENT).removeClass("hidden");d.replaceNode(a,"","");if(e){var b=e.find(r.LOADING_ICON);e.find(r.DAY_CONTENT).removeClass("hidden");d.replaceNode(b,"","")}}).fail(f.exception)}},t=function(b,c){var d=a("body");d.on(m.created,function(){n.reloadCurrentMonth(b)});d.on(m.deleted,function(){n.reloadCurrentMonth(b)});d.on(m.updated,function(){n.reloadCurrentMonth(b)});d.on(m.editActionEvent,function(a,b){window.location.assign(b)});d.on(m.moveEvent,s);d.on(m.eventMoved,function(){n.reloadCurrentMonth(b)});o.registerEditListeners(b,c)},u=function(b){b.on("click",r.VIEW_DAY_LINK,function(c){var d=document.getElementById(p.fullCalendarView),e=a(c.target),g=e.data("year"),h=e.data("month"),i=e.data("day"),j=e.data("courseid"),k=e.data("categoryid"),l="?view=day&time="+e.data("timestamp");if(d){n.refreshDayContent(b,g,h,i,j,k,b,"core_calendar/calendar_day").then(function(){c.preventDefault();return n.updateUrl(l)}).fail(f.exception)}else{window.location.assign(q.wwwroot+"/calendar/view.php"+l)}});b.on("change",p.elements.courseSelector,function(){var c=a(this),d=c.val();n.reloadCurrentMonth(b,d,null).then(function(){return b.find(p.elements.courseSelector).val(d)}).fail(f.exception)});var c=o.registerEventFormModal(b),d=a(r.CALENDAR_MONTH_WRAPPER).data("context-id");t(b,c);if(d){b.on("click",r.DAY,function(b){var d=a(b.target);if(!d.is(r.VIEW_DAY_LINK)){var e=a(this).attr("data-new-event-timestamp");c.then(function(a){var b=d.closest(p.wrapper);a.setCourseId(b.data("courseid"));var c=b.data("categoryid");if("undefined"!=typeof c){a.setCategoryId(c)}a.setContextId(b.data("contextId"));a.setStartTime(e);a.show()}).fail(f.exception);b.preventDefault()}})}};return{init:function init(b){b=a(b);n.init(b);u(b)}}});
|
||||
define ("core_calendar/calendar",["jquery","core/ajax","core/str","core/templates","core/notification","core/custom_interaction_events","core/modal_events","core/modal_factory","core_calendar/modal_event_form","core_calendar/summary_modal","core_calendar/repository","core_calendar/events","core_calendar/view_manager","core_calendar/crud","core_calendar/selectors","core/config"],function(a,b,c,d,f,g,h,i,j,k,l,m,n,o,p,q){var r={ROOT:"[data-region='calendar']",DAY:"[data-region='day']",NEW_EVENT_BUTTON:"[data-action='new-event-button']",DAY_CONTENT:"[data-region='day-content']",LOADING_ICON:".loading-icon",VIEW_DAY_LINK:"[data-action='view-day-link']",CALENDAR_MONTH_WRAPPER:".calendarwrapper",TODAY:".today",DAY_NUMBER_CIRCLE:".day-number-circle",DAY_NUMBER:".day-number"},s=function(b,c,e,g){var h=null,i=g.attr("data-day-timestamp");if(e){h=e.attr("data-day-timestamp")}if(!e||h!=i){d.render("core/loading",{}).then(function(a,b){g.find(r.DAY_CONTENT).addClass("hidden");d.appendNodeContents(g,a,b);if(e){e.find(r.DAY_CONTENT).addClass("hidden");d.appendNodeContents(e,a,b)}}).then(function(){return l.updateEventStartDay(c,i)}).then(function(){a("body").trigger(m.eventMoved,[c,e,g])}).always(function(){var a=g.find(r.LOADING_ICON);g.find(r.DAY_CONTENT).removeClass("hidden");d.replaceNode(a,"","");if(e){var b=e.find(r.LOADING_ICON);e.find(r.DAY_CONTENT).removeClass("hidden");d.replaceNode(b,"","")}}).fail(f.exception)}},t=function(b,c){var d=a("body");d.on(m.created,function(){n.reloadCurrentMonth(b)});d.on(m.deleted,function(){n.reloadCurrentMonth(b)});d.on(m.updated,function(){n.reloadCurrentMonth(b)});d.on(m.editActionEvent,function(a,b){window.location.assign(b)});d.on(m.moveEvent,s);d.on(m.eventMoved,function(){n.reloadCurrentMonth(b)});o.registerEditListeners(b,c)},u=function(b){var c=document.getElementById(p.fullCalendarView);b.on("click",r.VIEW_DAY_LINK,function(d){var e=a(d.target).closest(r.VIEW_DAY_LINK),g=e.data("year"),h=e.data("month"),i=e.data("day"),j=e.data("courseid"),k=e.data("categoryid"),l="?view=day&time="+e.data("timestamp");if(c){n.refreshDayContent(b,g,h,i,j,k,b,"core_calendar/calendar_day").then(function(){d.preventDefault();return n.updateUrl(l)}).fail(f.exception)}else{window.location.assign(q.wwwroot+"/calendar/view.php"+l)}});b.on("change",p.elements.courseSelector,function(){var c=a(this),d=c.val();n.reloadCurrentMonth(b,d,null).then(function(){return b.find(p.elements.courseSelector).val(d)}).fail(f.exception)});var d=o.registerEventFormModal(b),e=a(r.CALENDAR_MONTH_WRAPPER).data("context-id");t(b,d);if(e){b.on("click",r.DAY,function(g){var e=a(g.target),h="side-pre"===b.parents("aside").data("blockregion");if(!c&&h){var i=e.closest(r.DAY),j="?view=day&time="+i.data("day-timestamp");window.location.assign(q.wwwroot+"/calendar/view.php"+j)}else{if(!e.is(r.VIEW_DAY_LINK)&&!e.is(r.DAY_NUMBER_CIRCLE)&&!e.is(r.DAY_NUMBER)){var k=a(this).attr("data-new-event-timestamp");d.then(function(a){var b=e.closest(p.wrapper);a.setCourseId(b.data("courseid"));var c=b.data("categoryid");if("undefined"!=typeof c){a.setCategoryId(c)}a.setContextId(b.data("contextId"));a.setStartTime(k);a.show()}).fail(f.exception);g.preventDefault()}}})}};return{init:function init(b){b=a(b);n.init(b);u(b)}}});
|
||||
//# sourceMappingURL=calendar.min.js.map
|
||||
|
||||
File diff suppressed because one or more lines are too long
2
calendar/amd/build/popover.min.js
vendored
Normal file
2
calendar/amd/build/popover.min.js
vendored
Normal file
@ -0,0 +1,2 @@
|
||||
function _typeof(a){"@babel/helpers - typeof";if("function"==typeof Symbol&&"symbol"==typeof Symbol.iterator){_typeof=function(a){return typeof a}}else{_typeof=function(a){return a&&"function"==typeof Symbol&&a.constructor===Symbol&&a!==Symbol.prototype?"symbol":typeof a}}return _typeof(a)}define ("core_calendar/popover",["theme_boost/popover","jquery","core_calendar/selectors"],function(a,b,c){"use strict";b=function(a){return a&&a.__esModule?a:{default:a}}(b);c=e(c);function d(){if("function"!=typeof WeakMap)return null;var a=new WeakMap;d=function(){return a};return a}function e(a){if(a&&a.__esModule){return a}if(null===a||"object"!==_typeof(a)&&"function"!=typeof a){return{default:a}}var b=d();if(b&&b.has(a)){return b.get(a)}var c={},e=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var f in a){if(Object.prototype.hasOwnProperty.call(a,f)){var g=e?Object.getOwnPropertyDescriptor(a,f):null;if(g&&(g.get||g.set)){Object.defineProperty(c,f,g)}else{c[f]=a[f]}}}c.default=a;if(b){b.set(a,c)}return c}var f=function(a){return"none"===window.getComputedStyle(a.querySelector(c.elements.dateContent)).display},g=new Map,h=function(a){if(!g.has(a)){var d=(0,b.default)(a);d.popover({trigger:"manual",placement:"top",html:!0,content:function(){var a=d.find(c.elements.dateContent),e=(0,b.default)("<div>");if(a.length){var f=a.find(".hidden").clone(!1);e.html(f.html())}return e.html()}});g.set(a,!0)}if(f(a)){(0,b.default)(a).popover("show");a.addEventListener("mouseleave",i)}},i=function(a){if(g.has(a.target)){(0,b.default)(a.target).popover("hide")}a.target.removeEventListener("mouseleave",i)},j=function(){document.addEventListener("mouseover",function(a){var b=a.target.closest(c.elements.dateContainer);if(!b){return}a.preventDefault();h(b)})},k=!1;if(!k){j();k=!0}});
|
||||
//# sourceMappingURL=popover.min.js.map
|
||||
1
calendar/amd/build/popover.min.js.map
Normal file
1
calendar/amd/build/popover.min.js.map
Normal file
File diff suppressed because one or more lines are too long
2
calendar/amd/build/selectors.min.js
vendored
2
calendar/amd/build/selectors.min.js
vendored
@ -1,2 +1,2 @@
|
||||
define ("core_calendar/selectors",[],function(){return{eventFilterItem:"[data-action='filter-event-type']",eventType:{site:"[data-eventtype-site]",category:"[data-eventtype-category]",course:"[data-eventtype-course]",group:"[data-eventtype-group]",user:"[data-eventtype-user]",other:"[data-eventtype-other]"},popoverType:{site:"[data-popover-eventtype-site]",category:"[data-popover-eventtype-category]",course:"[data-popover-eventtype-course]",group:"[data-popover-eventtype-group]",user:"[data-popover-eventtype-user]",other:"[data-popover-eventtype-other]"},calendarPeriods:{month:"[data-period='month']"},courseSelector:"select[name=\"course\"]",viewSelector:"div[data-region=\"view-selector\"]",actions:{create:"[data-action=\"new-event-button\"]",edit:"[data-action=\"edit\"]",remove:"[data-action=\"delete\"]",viewEvent:"[data-action=\"view-event\"]"},elements:{courseSelector:"select[name=\"course\"]"},today:".today",day:"[data-region=\"day\"]",calendarMain:"[data-region=\"calendar\"]",wrapper:".calendarwrapper",eventItem:"[data-type=\"event\"]",links:{navLink:".calendarwrapper .arrow_link",eventLink:"[data-region='event-item']",miniDayLink:"[data-region='mini-day-link']"},containers:{loadingIcon:"[data-region=\"overlay-icon-container\"]"},fullCalendarView:"page-calendar-view"}});
|
||||
define ("core_calendar/selectors",[],function(){return{eventFilterItem:"[data-action='filter-event-type']",eventType:{site:"[data-eventtype-site]",category:"[data-eventtype-category]",course:"[data-eventtype-course]",group:"[data-eventtype-group]",user:"[data-eventtype-user]",other:"[data-eventtype-other]"},popoverType:{site:"[data-popover-eventtype-site]",category:"[data-popover-eventtype-category]",course:"[data-popover-eventtype-course]",group:"[data-popover-eventtype-group]",user:"[data-popover-eventtype-user]",other:"[data-popover-eventtype-other]"},calendarPeriods:{month:"[data-period='month']"},courseSelector:"select[name=\"course\"]",viewSelector:"div[data-region=\"view-selector\"]",actions:{create:"[data-action=\"new-event-button\"]",edit:"[data-action=\"edit\"]",remove:"[data-action=\"delete\"]",viewEvent:"[data-action=\"view-event\"]"},elements:{courseSelector:"select[name=\"course\"]",dateContainer:".clickable.hasevent",dateContent:"[data-region=\"day-content\"]"},today:".today",day:"[data-region=\"day\"]",calendarMain:"[data-region=\"calendar\"]",wrapper:".calendarwrapper",eventItem:"[data-type=\"event\"]",links:{navLink:".calendarwrapper .arrow_link",eventLink:"[data-region='event-item']",miniDayLink:"[data-region='mini-day-link']"},containers:{loadingIcon:"[data-region=\"overlay-icon-container\"]"},fullCalendarView:"page-calendar-view"}});
|
||||
//# sourceMappingURL=selectors.min.js.map
|
||||
|
||||
@ -1 +1 @@
|
||||
{"version":3,"sources":["../src/selectors.js"],"names":["define","eventFilterItem","eventType","site","category","course","group","user","other","popoverType","calendarPeriods","month","courseSelector","viewSelector","actions","create","edit","remove","viewEvent","elements","today","day","calendarMain","wrapper","eventItem","links","navLink","eventLink","miniDayLink","containers","loadingIcon","fullCalendarView"],"mappings":"AAsBAA,OAAM,2BAAC,EAAD,CAAK,UAAW,CAClB,MAAO,CACHC,eAAe,CAAE,mCADd,CAEHC,SAAS,CAAE,CACPC,IAAI,CAAE,uBADC,CAEPC,QAAQ,CAAE,2BAFH,CAGPC,MAAM,CAAE,yBAHD,CAIPC,KAAK,CAAE,wBAJA,CAKPC,IAAI,CAAE,uBALC,CAMPC,KAAK,CAAE,wBANA,CAFR,CAUHC,WAAW,CAAE,CACTN,IAAI,CAAE,+BADG,CAETC,QAAQ,CAAE,mCAFD,CAGTC,MAAM,CAAE,iCAHC,CAITC,KAAK,CAAE,gCAJE,CAKTC,IAAI,CAAE,+BALG,CAMTC,KAAK,CAAE,gCANE,CAVV,CAkBHE,eAAe,CAAE,CACbC,KAAK,CAAE,uBADM,CAlBd,CAqBHC,cAAc,CAAE,yBArBb,CAsBHC,YAAY,CAAE,oCAtBX,CAuBHC,OAAO,CAAE,CACLC,MAAM,CAAE,oCADH,CAELC,IAAI,CAAE,wBAFD,CAGLC,MAAM,CAAE,0BAHH,CAILC,SAAS,CAAE,8BAJN,CAvBN,CA6BHC,QAAQ,CAAE,CACNP,cAAc,CAAE,yBADV,CA7BP,CAgCHQ,KAAK,CAAE,QAhCJ,CAiCHC,GAAG,CAAE,uBAjCF,CAkCHC,YAAY,CAAE,4BAlCX,CAmCHC,OAAO,CAAE,kBAnCN,CAoCHC,SAAS,CAAE,uBApCR,CAqCHC,KAAK,CAAE,CACHC,OAAO,CAAE,8BADN,CAEHC,SAAS,CAAE,4BAFR,CAGHC,WAAW,CAAE,+BAHV,CArCJ,CA0CHC,UAAU,CAAE,CACRC,WAAW,CAAE,0CADL,CA1CT,CA6CHC,gBAAgB,CAAE,oBA7Cf,CA+CV,CAhDK,CAAN","sourcesContent":["// This file is part of Moodle - http://moodle.org/\n//\n// Moodle is free software: you can redistribute it and/or modify\n// it under the terms of the GNU General Public License as published by\n// the Free Software Foundation, either version 3 of the License, or\n// (at your option) any later version.\n//\n// Moodle is distributed in the hope that it will be useful,\n// but WITHOUT ANY WARRANTY; without even the implied warranty of\n// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n// GNU General Public License for more details.\n//\n// You should have received a copy of the GNU General Public License\n// along with Moodle. If not, see <http://www.gnu.org/licenses/>.\n\n/**\n * This module is responsible for the calendar filter.\n *\n * @module core_calendar/calendar_selectors\n * @copyright 2017 Andrew Nicols <andrew@nicols.co.uk>\n * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later\n */\ndefine([], function() {\n return {\n eventFilterItem: \"[data-action='filter-event-type']\",\n eventType: {\n site: \"[data-eventtype-site]\",\n category: \"[data-eventtype-category]\",\n course: \"[data-eventtype-course]\",\n group: \"[data-eventtype-group]\",\n user: \"[data-eventtype-user]\",\n other: \"[data-eventtype-other]\",\n },\n popoverType: {\n site: \"[data-popover-eventtype-site]\",\n category: \"[data-popover-eventtype-category]\",\n course: \"[data-popover-eventtype-course]\",\n group: \"[data-popover-eventtype-group]\",\n user: \"[data-popover-eventtype-user]\",\n other: \"[data-popover-eventtype-other]\",\n },\n calendarPeriods: {\n month: \"[data-period='month']\",\n },\n courseSelector: 'select[name=\"course\"]',\n viewSelector: 'div[data-region=\"view-selector\"]',\n actions: {\n create: '[data-action=\"new-event-button\"]',\n edit: '[data-action=\"edit\"]',\n remove: '[data-action=\"delete\"]',\n viewEvent: '[data-action=\"view-event\"]',\n },\n elements: {\n courseSelector: 'select[name=\"course\"]',\n },\n today: '.today',\n day: '[data-region=\"day\"]',\n calendarMain: '[data-region=\"calendar\"]',\n wrapper: '.calendarwrapper',\n eventItem: '[data-type=\"event\"]',\n links: {\n navLink: '.calendarwrapper .arrow_link',\n eventLink: \"[data-region='event-item']\",\n miniDayLink: \"[data-region='mini-day-link']\",\n },\n containers: {\n loadingIcon: '[data-region=\"overlay-icon-container\"]',\n },\n fullCalendarView: 'page-calendar-view',\n };\n});\n"],"file":"selectors.min.js"}
|
||||
{"version":3,"sources":["../src/selectors.js"],"names":["define","eventFilterItem","eventType","site","category","course","group","user","other","popoverType","calendarPeriods","month","courseSelector","viewSelector","actions","create","edit","remove","viewEvent","elements","dateContainer","dateContent","today","day","calendarMain","wrapper","eventItem","links","navLink","eventLink","miniDayLink","containers","loadingIcon","fullCalendarView"],"mappings":"AAsBAA,OAAM,2BAAC,EAAD,CAAK,UAAW,CAClB,MAAO,CACHC,eAAe,CAAE,mCADd,CAEHC,SAAS,CAAE,CACPC,IAAI,CAAE,uBADC,CAEPC,QAAQ,CAAE,2BAFH,CAGPC,MAAM,CAAE,yBAHD,CAIPC,KAAK,CAAE,wBAJA,CAKPC,IAAI,CAAE,uBALC,CAMPC,KAAK,CAAE,wBANA,CAFR,CAUHC,WAAW,CAAE,CACTN,IAAI,CAAE,+BADG,CAETC,QAAQ,CAAE,mCAFD,CAGTC,MAAM,CAAE,iCAHC,CAITC,KAAK,CAAE,gCAJE,CAKTC,IAAI,CAAE,+BALG,CAMTC,KAAK,CAAE,gCANE,CAVV,CAkBHE,eAAe,CAAE,CACbC,KAAK,CAAE,uBADM,CAlBd,CAqBHC,cAAc,CAAE,yBArBb,CAsBHC,YAAY,CAAE,oCAtBX,CAuBHC,OAAO,CAAE,CACLC,MAAM,CAAE,oCADH,CAELC,IAAI,CAAE,wBAFD,CAGLC,MAAM,CAAE,0BAHH,CAILC,SAAS,CAAE,8BAJN,CAvBN,CA6BHC,QAAQ,CAAE,CACNP,cAAc,CAAE,yBADV,CAENQ,aAAa,CAAE,qBAFT,CAGNC,WAAW,CAAE,+BAHP,CA7BP,CAkCHC,KAAK,CAAE,QAlCJ,CAmCHC,GAAG,CAAE,uBAnCF,CAoCHC,YAAY,CAAE,4BApCX,CAqCHC,OAAO,CAAE,kBArCN,CAsCHC,SAAS,CAAE,uBAtCR,CAuCHC,KAAK,CAAE,CACHC,OAAO,CAAE,8BADN,CAEHC,SAAS,CAAE,4BAFR,CAGHC,WAAW,CAAE,+BAHV,CAvCJ,CA4CHC,UAAU,CAAE,CACRC,WAAW,CAAE,0CADL,CA5CT,CA+CHC,gBAAgB,CAAE,oBA/Cf,CAiDV,CAlDK,CAAN","sourcesContent":["// This file is part of Moodle - http://moodle.org/\n//\n// Moodle is free software: you can redistribute it and/or modify\n// it under the terms of the GNU General Public License as published by\n// the Free Software Foundation, either version 3 of the License, or\n// (at your option) any later version.\n//\n// Moodle is distributed in the hope that it will be useful,\n// but WITHOUT ANY WARRANTY; without even the implied warranty of\n// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n// GNU General Public License for more details.\n//\n// You should have received a copy of the GNU General Public License\n// along with Moodle. If not, see <http://www.gnu.org/licenses/>.\n\n/**\n * This module is responsible for the calendar filter.\n *\n * @module core_calendar/calendar_selectors\n * @copyright 2017 Andrew Nicols <andrew@nicols.co.uk>\n * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later\n */\ndefine([], function() {\n return {\n eventFilterItem: \"[data-action='filter-event-type']\",\n eventType: {\n site: \"[data-eventtype-site]\",\n category: \"[data-eventtype-category]\",\n course: \"[data-eventtype-course]\",\n group: \"[data-eventtype-group]\",\n user: \"[data-eventtype-user]\",\n other: \"[data-eventtype-other]\",\n },\n popoverType: {\n site: \"[data-popover-eventtype-site]\",\n category: \"[data-popover-eventtype-category]\",\n course: \"[data-popover-eventtype-course]\",\n group: \"[data-popover-eventtype-group]\",\n user: \"[data-popover-eventtype-user]\",\n other: \"[data-popover-eventtype-other]\",\n },\n calendarPeriods: {\n month: \"[data-period='month']\",\n },\n courseSelector: 'select[name=\"course\"]',\n viewSelector: 'div[data-region=\"view-selector\"]',\n actions: {\n create: '[data-action=\"new-event-button\"]',\n edit: '[data-action=\"edit\"]',\n remove: '[data-action=\"delete\"]',\n viewEvent: '[data-action=\"view-event\"]',\n },\n elements: {\n courseSelector: 'select[name=\"course\"]',\n dateContainer: '.clickable.hasevent',\n dateContent: '[data-region=\"day-content\"]',\n },\n today: '.today',\n day: '[data-region=\"day\"]',\n calendarMain: '[data-region=\"calendar\"]',\n wrapper: '.calendarwrapper',\n eventItem: '[data-type=\"event\"]',\n links: {\n navLink: '.calendarwrapper .arrow_link',\n eventLink: \"[data-region='event-item']\",\n miniDayLink: \"[data-region='mini-day-link']\",\n },\n containers: {\n loadingIcon: '[data-region=\"overlay-icon-container\"]',\n },\n fullCalendarView: 'page-calendar-view',\n };\n});\n"],"file":"selectors.min.js"}
|
||||
@ -70,6 +70,8 @@ define([
|
||||
VIEW_DAY_LINK: "[data-action='view-day-link']",
|
||||
CALENDAR_MONTH_WRAPPER: ".calendarwrapper",
|
||||
TODAY: '.today',
|
||||
DAY_NUMBER_CIRCLE: '.day-number-circle',
|
||||
DAY_NUMBER: '.day-number'
|
||||
};
|
||||
|
||||
/**
|
||||
@ -173,10 +175,10 @@ define([
|
||||
* @param {object} root The calendar root element
|
||||
*/
|
||||
var registerEventListeners = function(root) {
|
||||
const viewingFullCalendar = document.getElementById(CalendarSelectors.fullCalendarView);
|
||||
// Listen the click on the day link to render the day view.
|
||||
root.on('click', SELECTORS.VIEW_DAY_LINK, function(e) {
|
||||
const viewingFullCalendar = document.getElementById(CalendarSelectors.fullCalendarView);
|
||||
var dayLink = $(e.target);
|
||||
var dayLink = $(e.target).closest(SELECTORS.VIEW_DAY_LINK);
|
||||
var year = dayLink.data('year'),
|
||||
month = dayLink.data('month'),
|
||||
day = dayLink.data('day'),
|
||||
@ -211,29 +213,35 @@ define([
|
||||
|
||||
if (contextId) {
|
||||
// Bind click events to calendar days.
|
||||
root.on('click', SELECTORS.DAY, function (e) {
|
||||
root.on('click', SELECTORS.DAY, function(e) {
|
||||
|
||||
var target = $(e.target);
|
||||
const displayingSmallBlockCalendar = root.parents('aside').data('blockregion') === 'side-pre';
|
||||
|
||||
if (!target.is(SELECTORS.VIEW_DAY_LINK)) {
|
||||
var startTime = $(this).attr('data-new-event-timestamp');
|
||||
eventFormPromise.then(function (modal) {
|
||||
var wrapper = target.closest(CalendarSelectors.wrapper);
|
||||
modal.setCourseId(wrapper.data('courseid'));
|
||||
if (!viewingFullCalendar && displayingSmallBlockCalendar) {
|
||||
const dateContainer = target.closest(SELECTORS.DAY);
|
||||
const url = '?view=day&time=' + dateContainer.data('day-timestamp');
|
||||
window.location.assign(Config.wwwroot + '/calendar/view.php' + url);
|
||||
} else {
|
||||
if (!target.is(SELECTORS.VIEW_DAY_LINK) &&
|
||||
!target.is(SELECTORS.DAY_NUMBER_CIRCLE) && !target.is(SELECTORS.DAY_NUMBER)) {
|
||||
var startTime = $(this).attr('data-new-event-timestamp');
|
||||
eventFormPromise.then(function(modal) {
|
||||
var wrapper = target.closest(CalendarSelectors.wrapper);
|
||||
modal.setCourseId(wrapper.data('courseid'));
|
||||
|
||||
var categoryId = wrapper.data('categoryid');
|
||||
if (typeof categoryId !== 'undefined') {
|
||||
modal.setCategoryId(categoryId);
|
||||
}
|
||||
var categoryId = wrapper.data('categoryid');
|
||||
if (typeof categoryId !== 'undefined') {
|
||||
modal.setCategoryId(categoryId);
|
||||
}
|
||||
|
||||
modal.setContextId(wrapper.data('contextId'));
|
||||
modal.setStartTime(startTime);
|
||||
modal.show();
|
||||
return;
|
||||
})
|
||||
.fail(Notification.exception);
|
||||
|
||||
e.preventDefault();
|
||||
modal.setContextId(wrapper.data('contextId'));
|
||||
modal.setStartTime(startTime);
|
||||
modal.show();
|
||||
return;
|
||||
}).fail(Notification.exception);
|
||||
e.preventDefault();
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
96
calendar/amd/src/popover.js
Normal file
96
calendar/amd/src/popover.js
Normal file
@ -0,0 +1,96 @@
|
||||
// This file is part of Moodle - http://moodle.org/
|
||||
//
|
||||
// Moodle is free software: you can redistribute it and/or modify
|
||||
// it under the terms of the GNU General Public License as published by
|
||||
// the Free Software Foundation, either version 3 of the License, or
|
||||
// (at your option) any later version.
|
||||
//
|
||||
// Moodle is distributed in the hope that it will be useful,
|
||||
// but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
// GNU General Public License for more details.
|
||||
//
|
||||
// You should have received a copy of the GNU General Public License
|
||||
// along with Moodle. If not, see <http://www.gnu.org/licenses/>.
|
||||
|
||||
/**
|
||||
* Javascript popover for the `core_calendar` subsystem.
|
||||
*
|
||||
* @module core_calendar/popover
|
||||
* @copyright 2021 Huong Nguyen <huongnv13@gmail.com>
|
||||
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
|
||||
* @since 4.0
|
||||
*/
|
||||
|
||||
import 'theme_boost/popover';
|
||||
import jQuery from 'jquery';
|
||||
import * as CalendarSelectors from 'core_calendar/selectors';
|
||||
|
||||
/**
|
||||
* Check if we are allowing to enable the popover or not.
|
||||
* @param {Element} dateContainer
|
||||
* @returns {boolean}
|
||||
*/
|
||||
const isPopoverAvailable = (dateContainer) => {
|
||||
return window.getComputedStyle(dateContainer.querySelector(CalendarSelectors.elements.dateContent)).display === 'none';
|
||||
};
|
||||
|
||||
const isPopoverConfigured = new Map();
|
||||
|
||||
const showPopover = target => {
|
||||
if (!isPopoverConfigured.has(target)) {
|
||||
const dateEle = jQuery(target);
|
||||
dateEle.popover({
|
||||
trigger: 'manual',
|
||||
placement: 'top',
|
||||
html: true,
|
||||
content: () => {
|
||||
const source = dateEle.find(CalendarSelectors.elements.dateContent);
|
||||
const content = jQuery('<div>');
|
||||
if (source.length) {
|
||||
const temptContent = source.find('.hidden').clone(false);
|
||||
content.html(temptContent.html());
|
||||
}
|
||||
return content.html();
|
||||
}
|
||||
});
|
||||
|
||||
isPopoverConfigured.set(target, true);
|
||||
}
|
||||
|
||||
if (isPopoverAvailable(target)) {
|
||||
jQuery(target).popover('show');
|
||||
|
||||
target.addEventListener('mouseleave', hidePopover);
|
||||
}
|
||||
};
|
||||
|
||||
const hidePopover = e => {
|
||||
if (isPopoverConfigured.has(e.target)) {
|
||||
jQuery(e.target).popover('hide');
|
||||
}
|
||||
|
||||
e.target.removeEventListener('mouseleave', hidePopover);
|
||||
};
|
||||
|
||||
/**
|
||||
* Register events for date container.
|
||||
*/
|
||||
const registerEventListeners = () => {
|
||||
document.addEventListener('mouseover', e => {
|
||||
const dateContainer = e.target.closest(CalendarSelectors.elements.dateContainer);
|
||||
if (!dateContainer) {
|
||||
return;
|
||||
}
|
||||
|
||||
e.preventDefault();
|
||||
showPopover(dateContainer);
|
||||
});
|
||||
|
||||
};
|
||||
|
||||
let listenersRegistered = false;
|
||||
if (!listenersRegistered) {
|
||||
registerEventListeners();
|
||||
listenersRegistered = true;
|
||||
}
|
||||
@ -52,6 +52,8 @@ define([], function() {
|
||||
},
|
||||
elements: {
|
||||
courseSelector: 'select[name="course"]',
|
||||
dateContainer: '.clickable.hasevent',
|
||||
dateContent: '[data-region="day-content"]',
|
||||
},
|
||||
today: '.today',
|
||||
day: '[data-region="day"]',
|
||||
|
||||
@ -66,21 +66,23 @@
|
||||
}}{{#durationevents.0}} duration{{/durationevents.0}}{{!
|
||||
}}{{#durationevents}} duration_{{.}}{{/durationevents}}{{!
|
||||
}}{{#defaulteventcontext}} clickable{{/defaulteventcontext}}{{!
|
||||
}}{{#hasevents}} hasevent{{/hasevents}}{{!
|
||||
}}"
|
||||
data-day-timestamp="{{timestamp}}"
|
||||
data-drop-zone="month-view-day"
|
||||
data-region="day"
|
||||
data-new-event-timestamp="{{neweventtimestamp}}">
|
||||
data-new-event-timestamp="{{neweventtimestamp}}"{{#istoday}} title="{{#str}} today, core_calendar {{/str}}"{{/istoday}}
|
||||
{{#hasevents}} data-title="{{viewdaylinktitle}}"{{/hasevents}}>
|
||||
<div class="d-none d-md-block hidden-phone text-xs-center">
|
||||
<span class="sr-only">{{daytitle}}</span>
|
||||
{{#hasevents}}
|
||||
<a data-action="view-day-link" href="#" class="aalink day" aria-label="{{viewdaylinktitle}}"
|
||||
data-year="{{date.year}}" data-month="{{date.mon}}" data-day="{{mday}}"
|
||||
data-courseid="{{courseid}}" data-categoryid="{{categoryid}}"
|
||||
data-timestamp="{{timestamp}}">{{mday}}</a>
|
||||
data-timestamp="{{timestamp}}"><span class="day-number-circle"><span class="day-number">{{mday}}</span></span></a>
|
||||
{{/hasevents}}
|
||||
{{^hasevents}}
|
||||
<span aria-hidden="true">{{mday}}</span>
|
||||
<span aria-hidden="true"><span class="day-number-circle"><span class="day-number">{{mday}}</span></span></span>
|
||||
{{/hasevents}}
|
||||
{{#hasevents}}
|
||||
<div data-region="day-content">
|
||||
@ -121,6 +123,14 @@
|
||||
{{/underway}}
|
||||
{{/events}}
|
||||
</ul>
|
||||
<div class="hidden">
|
||||
{{#events}}
|
||||
<div data-popover-eventtype-{{normalisedeventtype}}="1">
|
||||
{{> core_calendar/event_icon}}
|
||||
{{{name}}}
|
||||
</div>
|
||||
{{/events}}
|
||||
</div>
|
||||
</div>
|
||||
{{/hasevents}}
|
||||
</div>
|
||||
@ -130,10 +140,10 @@
|
||||
<a data-action="view-day-link" href="#" class="day aalink" aria-label="{{viewdaylinktitle}}"
|
||||
data-year="{{date.year}}" data-month="{{date.mon}}" data-day="{{mday}}"
|
||||
data-courseid="{{courseid}}" data-categoryid="{{categoryid}}"
|
||||
data-timestamp="{{timestamp}}">{{mday}}</a>
|
||||
data-timestamp="{{timestamp}}"><span class="day-number-circle"><span class="day-number">{{mday}}</span></span></a>
|
||||
{{/hasevents}}
|
||||
{{^hasevents}}
|
||||
<span aria-hidden="true">{{mday}}</span>
|
||||
<span aria-hidden="true"><span class="day-number-circle"><span class="day-number">{{mday}}</span></span></span>
|
||||
{{/hasevents}}
|
||||
</div>
|
||||
</td>
|
||||
|
||||
@ -38,6 +38,18 @@ use Behat\Gherkin\Node\TableNode as TableNode;
|
||||
*/
|
||||
class behat_calendar extends behat_base {
|
||||
|
||||
/**
|
||||
* Return the list of partial named selectors.
|
||||
*
|
||||
* @return array
|
||||
*/
|
||||
public static function get_partial_named_selectors(): array {
|
||||
return [
|
||||
new behat_component_named_selector('mini calendar block', [".//*[@data-block='calendar_month']"]),
|
||||
new behat_component_named_selector('calendar day', [".//*[@data-day=%locator%]"]),
|
||||
];
|
||||
}
|
||||
|
||||
/**
|
||||
* Create event when starting on the front page.
|
||||
*
|
||||
@ -119,10 +131,32 @@ class behat_calendar extends behat_base {
|
||||
$dayofmonth = "a[{$daycontains}]";
|
||||
|
||||
$xpath = '//' . $currentmonth . '/descendant::' . $daycell . '/' . $dayofmonth;
|
||||
$this->execute("behat_general::wait_until_the_page_is_ready");
|
||||
$this->execute("behat_general::i_hover", [$xpath, "xpath_element"]);
|
||||
}
|
||||
|
||||
/**
|
||||
* Hover over a specific day in the mini-calendar.
|
||||
*
|
||||
* @Given /^I hover over day "(?P<dayofmonth>\d+)" of this month in the mini-calendar block$/
|
||||
* @param int $day The day of the current month
|
||||
*/
|
||||
public function i_hover_over_day_of_this_month_in_mini_calendar_block(int $day): void {
|
||||
$this->execute("behat_general::i_hover_in_the",
|
||||
[$day, 'core_calendar > calendar day', '', 'core_calendar > mini calendar block']);
|
||||
}
|
||||
|
||||
/**
|
||||
* Hover over today in the mini-calendar.
|
||||
*
|
||||
* @Given /^I hover over today in the mini-calendar block$/
|
||||
*/
|
||||
public function i_hover_over_today_in_mini_calendar_block(): void {
|
||||
// For window's compatibility, using %d and not %e.
|
||||
$todaysday = trim(strftime('%d'));
|
||||
$todaysday = ltrim($todaysday, '0');
|
||||
$this->i_hover_over_day_of_this_month_in_mini_calendar_block($todaysday);
|
||||
}
|
||||
|
||||
/**
|
||||
* Hover over today in the calendar.
|
||||
*
|
||||
|
||||
@ -31,6 +31,7 @@ Feature: Open calendar popup
|
||||
Then I should see "Event 1:1"
|
||||
And I should see "Event 1:2"
|
||||
And I am on homepage
|
||||
When I hover over day "1" of this month in the mini-calendar block
|
||||
And I should see "Event 1:1"
|
||||
And I should see "Event 1:2"
|
||||
|
||||
@ -59,4 +60,5 @@ Feature: Open calendar popup
|
||||
| Event title | Today's event |
|
||||
Then I should see "Today's event"
|
||||
And I am on homepage
|
||||
And I hover over today in the mini-calendar block
|
||||
And I should see "Today's event"
|
||||
|
||||
@ -352,6 +352,22 @@ class behat_general extends behat_base {
|
||||
$node->mouseOver();
|
||||
}
|
||||
|
||||
/**
|
||||
* Generic mouse over action. Mouse over a element of the specified type.
|
||||
*
|
||||
* @When /^I hover over the "(?P<element_string>(?:[^"]|\\")*)" "(?P<selector_string>[^"]*) in the "(?P<container_element_string>(?:[^"]|\\")*)" "(?P<container_selector_string>[^"]*)"$/
|
||||
* @param string $element Element we look for
|
||||
* @param string $selectortype The type of what we look for
|
||||
* @param string $containerelement Element we look for
|
||||
* @param string $containerselectortype The type of what we look for
|
||||
*/
|
||||
public function i_hover_in_the(string $element, $selectortype, string $containerelement, $containerselectortype): void {
|
||||
// Gets the node based on the requested selector type and locator.
|
||||
$node = $this->get_node_in_container($selectortype, $element, $containerselectortype, $containerselectortype);
|
||||
$this->execute_js_on_node($node, '{{ELEMENT}}.scrollIntoView();');
|
||||
$node->mouseOver();
|
||||
}
|
||||
|
||||
/**
|
||||
* Generic click action. Click on the element of the specified type.
|
||||
*
|
||||
|
||||
@ -19,6 +19,9 @@ $calendarEventOtherBorder: 2px solid #687889 !default; // Gray.
|
||||
// This will be the colour of mini-calendar links, hide/show filter icons, edit/delete icon buttons.
|
||||
$calendarEventColor: #0d5ca1 !default;
|
||||
|
||||
$calendarCurrentDateColor: $white;
|
||||
$calendarCurrentDateBackground: $primary;
|
||||
|
||||
// Calendar event background colours defined.
|
||||
.calendar_event_category {
|
||||
background-color: $calendarEventCategoryColor;
|
||||
@ -132,7 +135,8 @@ $calendarEventColor: #0d5ca1 !default;
|
||||
|
||||
.bottom {
|
||||
text-align: left;
|
||||
padding: 20px 0 0 20px;
|
||||
width: 98%;
|
||||
margin: 10px auto;
|
||||
|
||||
@include footer-links;
|
||||
}
|
||||
@ -212,12 +216,39 @@ $calendarEventColor: #0d5ca1 !default;
|
||||
}
|
||||
}
|
||||
|
||||
th {
|
||||
text-align: left;
|
||||
padding-left: 16px;
|
||||
}
|
||||
|
||||
td {
|
||||
height: 5em;
|
||||
|
||||
.day-number-circle {
|
||||
display: inline-block;
|
||||
line-height: 0;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
|
||||
.day-number {
|
||||
display: inline-block;
|
||||
padding: 50% 4px;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
&.today {
|
||||
.day-number-circle {
|
||||
border-radius: 50%;
|
||||
color: $calendarCurrentDateColor;
|
||||
background-color: $calendarCurrentDateBackground;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.clickable:hover {
|
||||
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12);
|
||||
background-color: #ededed;
|
||||
}
|
||||
}
|
||||
|
||||
@ -266,7 +297,7 @@ $calendarEventColor: #0d5ca1 !default;
|
||||
.calendartable {
|
||||
td,
|
||||
li {
|
||||
padding: 0 4px 4px 4px;
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
li {
|
||||
@ -314,12 +345,8 @@ $calendarEventColor: #0d5ca1 !default;
|
||||
// Block minicalendar.
|
||||
.block {
|
||||
.bottom {
|
||||
// This adds a border on the top side of the footer container.
|
||||
// So we won't have to add a <hr> element in the footer_options template.
|
||||
border-top: $border-width solid $card-border-color;
|
||||
margin-top: map-get($spacers, 3);
|
||||
padding-top: map-get($spacers, 2);
|
||||
|
||||
width: 98%;
|
||||
margin: 10px auto;
|
||||
@include footer-links;
|
||||
}
|
||||
|
||||
@ -482,6 +509,37 @@ $calendarEventColor: #0d5ca1 !default;
|
||||
}
|
||||
}
|
||||
|
||||
// Side block in Course view page is different with other side blocks.
|
||||
// We should hide the navigation text and re-arrange the Calendar links.
|
||||
.path-course-view {
|
||||
.block {
|
||||
&.block_calendar_month {
|
||||
.maincalendar {
|
||||
div.header {
|
||||
visibility: hidden;
|
||||
height: 0;
|
||||
}
|
||||
.calendarwrapper {
|
||||
.arrow_text {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.footer {
|
||||
.bottom {
|
||||
.footer-link {
|
||||
display: block;
|
||||
}
|
||||
.footer-link:after {
|
||||
content: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Display month name above the calendar */
|
||||
table.calendartable caption {
|
||||
caption-side: top;
|
||||
@ -495,6 +553,128 @@ table.calendartable caption {
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
section:not(#region-main) {
|
||||
.block {
|
||||
&.block_calendar_month {
|
||||
.maincalendar {
|
||||
div.header {
|
||||
visibility: hidden;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
.calendarwrapper {
|
||||
.current {
|
||||
width: 40%;
|
||||
font-size: inherit;
|
||||
line-height: inherit;
|
||||
}
|
||||
|
||||
.previous,
|
||||
.next {
|
||||
width: 30%;
|
||||
font-size: 0.8em;
|
||||
}
|
||||
}
|
||||
|
||||
.calendartable {
|
||||
&.calendarmonth {
|
||||
th,
|
||||
td {
|
||||
border: none;
|
||||
text-align: center !important; // stylelint-disable-line declaration-no-important
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
td {
|
||||
height: auto;
|
||||
font-size: 0.8em;
|
||||
|
||||
&.hasevent {
|
||||
[data-region="day-content"] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.day-number {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
|
||||
&:before {
|
||||
content: '.';
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
bottom: 0.4em;
|
||||
left: 0;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
font-size: 3em;
|
||||
color: inherit;
|
||||
}
|
||||
}
|
||||
}
|
||||
&:after {
|
||||
content: '';
|
||||
display: block;
|
||||
margin-top: calc(100% - 26px);
|
||||
}
|
||||
|
||||
&.clickable:hover {
|
||||
background-color: inherit;
|
||||
}
|
||||
|
||||
&.clickable:not(.today):hover {
|
||||
.day-number-circle {
|
||||
border-radius: 50%;
|
||||
background-color: #ededed;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.bottom {
|
||||
// This adds a border on the top side of the footer container.
|
||||
// So we won't have to add a <hr> element in the footer_options template.
|
||||
border-top: $border-width solid $card-border-color;
|
||||
padding-top: map-get($spacers, 2);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
.maincalendar {
|
||||
.calendartable {
|
||||
&.calendarmonth {
|
||||
th,
|
||||
td {
|
||||
border: none;
|
||||
text-align: center !important; // stylelint-disable-line declaration-no-important
|
||||
padding: 0;
|
||||
}
|
||||
td {
|
||||
height: auto;
|
||||
font-size: inherit;
|
||||
padding: 0;
|
||||
|
||||
&.hasevent {
|
||||
[data-region="day-content"] {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
&:after {
|
||||
content: '';
|
||||
display: block;
|
||||
margin-top: calc(100% - 26px);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.calendarwrapper {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
@ -13175,7 +13175,8 @@ body.dragging .dragging {
|
||||
padding: 0; }
|
||||
.maincalendar .bottom {
|
||||
text-align: left;
|
||||
padding: 20px 0 0 20px; }
|
||||
width: 98%;
|
||||
margin: 10px auto; }
|
||||
.maincalendar .bottom span.footer-link:after {
|
||||
content: "\2022";
|
||||
color: #0f6fc5; }
|
||||
@ -13230,10 +13231,27 @@ body.dragging .dragging {
|
||||
.maincalendar .calendarmonth ul li .calendar-circle.calendar_event_other {
|
||||
background-color: #ced4da;
|
||||
border: 2px solid #687889; }
|
||||
.maincalendar .calendarmonth th {
|
||||
text-align: left;
|
||||
padding-left: 16px; }
|
||||
.maincalendar .calendarmonth td {
|
||||
height: 5em; }
|
||||
.maincalendar .calendarmonth td .day-number-circle {
|
||||
display: inline-block;
|
||||
line-height: 0;
|
||||
width: 30px;
|
||||
height: 30px; }
|
||||
.maincalendar .calendarmonth td .day-number-circle .day-number {
|
||||
display: inline-block;
|
||||
padding: 50% 4px;
|
||||
width: 100%;
|
||||
text-align: center; }
|
||||
.maincalendar .calendarmonth td.today .day-number-circle {
|
||||
border-radius: 50%;
|
||||
color: #fff;
|
||||
background-color: #0f6fc5; }
|
||||
.maincalendar .calendarmonth .clickable:hover {
|
||||
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }
|
||||
background-color: #ededed; }
|
||||
.maincalendar .controls {
|
||||
width: 98%;
|
||||
margin: 10px auto; }
|
||||
@ -13258,7 +13276,7 @@ body.dragging .dragging {
|
||||
border-color: #ced4da; }
|
||||
.maincalendar .calendartable td,
|
||||
.maincalendar .calendartable li {
|
||||
padding: 0 4px 4px 4px; }
|
||||
padding: 4px; }
|
||||
.maincalendar .calendartable li {
|
||||
text-align: left; }
|
||||
.maincalendar .header {
|
||||
@ -13279,9 +13297,8 @@ body.dragging .dragging {
|
||||
padding-left: 20px; }
|
||||
|
||||
.block .bottom {
|
||||
border-top: 1px solid rgba(0, 0, 0, 0.125);
|
||||
margin-top: 1rem;
|
||||
padding-top: 0.5rem; }
|
||||
width: 98%;
|
||||
margin: 10px auto; }
|
||||
.block .bottom span.footer-link:after {
|
||||
content: "\2022";
|
||||
color: #0f6fc5; }
|
||||
@ -13373,6 +13390,19 @@ body.dragging .dragging {
|
||||
.block .content h3.eventskey {
|
||||
margin-top: 0.5em; }
|
||||
|
||||
.path-course-view .block.block_calendar_month .maincalendar div.header {
|
||||
visibility: hidden;
|
||||
height: 0; }
|
||||
|
||||
.path-course-view .block.block_calendar_month .maincalendar .calendarwrapper .arrow_text {
|
||||
display: none; }
|
||||
|
||||
.path-course-view .block.block_calendar_month .footer .bottom .footer-link {
|
||||
display: block; }
|
||||
|
||||
.path-course-view .block.block_calendar_month .footer .bottom .footer-link:after {
|
||||
content: none; }
|
||||
|
||||
/* Display month name above the calendar */
|
||||
table.calendartable caption {
|
||||
caption-side: top; }
|
||||
@ -13381,6 +13411,71 @@ table.calendartable caption {
|
||||
#page-calender-view .container-fluid, #page-calender-view .container-sm, #page-calender-view .container-md, #page-calender-view .container-lg, #page-calender-view .container-xl {
|
||||
min-width: 1024px; } }
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
section:not(#region-main) .block.block_calendar_month .maincalendar div.header {
|
||||
visibility: hidden;
|
||||
height: 0; }
|
||||
section:not(#region-main) .block.block_calendar_month .maincalendar .calendarwrapper .current {
|
||||
width: 40%;
|
||||
font-size: inherit;
|
||||
line-height: inherit; }
|
||||
section:not(#region-main) .block.block_calendar_month .maincalendar .calendarwrapper .previous,
|
||||
section:not(#region-main) .block.block_calendar_month .maincalendar .calendarwrapper .next {
|
||||
width: 30%;
|
||||
font-size: 0.8em; }
|
||||
section:not(#region-main) .block.block_calendar_month .maincalendar .calendartable.calendarmonth th,
|
||||
section:not(#region-main) .block.block_calendar_month .maincalendar .calendartable.calendarmonth td {
|
||||
border: none;
|
||||
text-align: center !important;
|
||||
padding: 0; }
|
||||
section:not(#region-main) .block.block_calendar_month .maincalendar .calendartable.calendarmonth td {
|
||||
height: auto;
|
||||
font-size: 0.8em; }
|
||||
section:not(#region-main) .block.block_calendar_month .maincalendar .calendartable.calendarmonth td.hasevent [data-region="day-content"] {
|
||||
display: none; }
|
||||
section:not(#region-main) .block.block_calendar_month .maincalendar .calendartable.calendarmonth td.hasevent .day-number {
|
||||
display: inline-block;
|
||||
position: relative; }
|
||||
section:not(#region-main) .block.block_calendar_month .maincalendar .calendartable.calendarmonth td.hasevent .day-number:before {
|
||||
content: '.';
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
bottom: 0.4em;
|
||||
left: 0;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
font-size: 3em;
|
||||
color: inherit; }
|
||||
section:not(#region-main) .block.block_calendar_month .maincalendar .calendartable.calendarmonth td:after {
|
||||
content: '';
|
||||
display: block;
|
||||
margin-top: calc(100% - 26px); }
|
||||
section:not(#region-main) .block.block_calendar_month .maincalendar .calendartable.calendarmonth td.clickable:hover {
|
||||
background-color: inherit; }
|
||||
section:not(#region-main) .block.block_calendar_month .maincalendar .calendartable.calendarmonth td.clickable:not(.today):hover .day-number-circle {
|
||||
border-radius: 50%;
|
||||
background-color: #ededed; }
|
||||
section:not(#region-main) .block.block_calendar_month .bottom {
|
||||
border-top: 1px solid rgba(0, 0, 0, 0.125);
|
||||
padding-top: 0.5rem; } }
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
.maincalendar .calendartable.calendarmonth th,
|
||||
.maincalendar .calendartable.calendarmonth td {
|
||||
border: none;
|
||||
text-align: center !important;
|
||||
padding: 0; }
|
||||
.maincalendar .calendartable.calendarmonth td {
|
||||
height: auto;
|
||||
font-size: inherit;
|
||||
padding: 0; }
|
||||
.maincalendar .calendartable.calendarmonth td.hasevent [data-region="day-content"] {
|
||||
display: none; }
|
||||
.maincalendar .calendartable.calendarmonth td:after {
|
||||
content: '';
|
||||
display: block;
|
||||
margin-top: calc(100% - 26px); } }
|
||||
|
||||
.calendarwrapper {
|
||||
position: relative; }
|
||||
|
||||
|
||||
@ -13175,7 +13175,8 @@ body.dragging .dragging {
|
||||
padding: 0; }
|
||||
.maincalendar .bottom {
|
||||
text-align: left;
|
||||
padding: 20px 0 0 20px; }
|
||||
width: 98%;
|
||||
margin: 10px auto; }
|
||||
.maincalendar .bottom span.footer-link:after {
|
||||
content: "\2022";
|
||||
color: #0f6fc5; }
|
||||
@ -13230,10 +13231,27 @@ body.dragging .dragging {
|
||||
.maincalendar .calendarmonth ul li .calendar-circle.calendar_event_other {
|
||||
background-color: #ced4da;
|
||||
border: 2px solid #687889; }
|
||||
.maincalendar .calendarmonth th {
|
||||
text-align: left;
|
||||
padding-left: 16px; }
|
||||
.maincalendar .calendarmonth td {
|
||||
height: 5em; }
|
||||
.maincalendar .calendarmonth td .day-number-circle {
|
||||
display: inline-block;
|
||||
line-height: 0;
|
||||
width: 30px;
|
||||
height: 30px; }
|
||||
.maincalendar .calendarmonth td .day-number-circle .day-number {
|
||||
display: inline-block;
|
||||
padding: 50% 4px;
|
||||
width: 100%;
|
||||
text-align: center; }
|
||||
.maincalendar .calendarmonth td.today .day-number-circle {
|
||||
border-radius: 50%;
|
||||
color: #fff;
|
||||
background-color: #0f6fc5; }
|
||||
.maincalendar .calendarmonth .clickable:hover {
|
||||
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }
|
||||
background-color: #ededed; }
|
||||
.maincalendar .controls {
|
||||
width: 98%;
|
||||
margin: 10px auto; }
|
||||
@ -13258,7 +13276,7 @@ body.dragging .dragging {
|
||||
border-color: #ced4da; }
|
||||
.maincalendar .calendartable td,
|
||||
.maincalendar .calendartable li {
|
||||
padding: 0 4px 4px 4px; }
|
||||
padding: 4px; }
|
||||
.maincalendar .calendartable li {
|
||||
text-align: left; }
|
||||
.maincalendar .header {
|
||||
@ -13279,9 +13297,8 @@ body.dragging .dragging {
|
||||
padding-left: 20px; }
|
||||
|
||||
.block .bottom {
|
||||
border-top: 1px solid rgba(0, 0, 0, 0.125);
|
||||
margin-top: 1rem;
|
||||
padding-top: 0.5rem; }
|
||||
width: 98%;
|
||||
margin: 10px auto; }
|
||||
.block .bottom span.footer-link:after {
|
||||
content: "\2022";
|
||||
color: #0f6fc5; }
|
||||
@ -13373,6 +13390,19 @@ body.dragging .dragging {
|
||||
.block .content h3.eventskey {
|
||||
margin-top: 0.5em; }
|
||||
|
||||
.path-course-view .block.block_calendar_month .maincalendar div.header {
|
||||
visibility: hidden;
|
||||
height: 0; }
|
||||
|
||||
.path-course-view .block.block_calendar_month .maincalendar .calendarwrapper .arrow_text {
|
||||
display: none; }
|
||||
|
||||
.path-course-view .block.block_calendar_month .footer .bottom .footer-link {
|
||||
display: block; }
|
||||
|
||||
.path-course-view .block.block_calendar_month .footer .bottom .footer-link:after {
|
||||
content: none; }
|
||||
|
||||
/* Display month name above the calendar */
|
||||
table.calendartable caption {
|
||||
caption-side: top; }
|
||||
@ -13381,6 +13411,71 @@ table.calendartable caption {
|
||||
#page-calender-view .container-fluid, #page-calender-view .container-sm, #page-calender-view .container-md, #page-calender-view .container-lg, #page-calender-view .container-xl {
|
||||
min-width: 1024px; } }
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
section:not(#region-main) .block.block_calendar_month .maincalendar div.header {
|
||||
visibility: hidden;
|
||||
height: 0; }
|
||||
section:not(#region-main) .block.block_calendar_month .maincalendar .calendarwrapper .current {
|
||||
width: 40%;
|
||||
font-size: inherit;
|
||||
line-height: inherit; }
|
||||
section:not(#region-main) .block.block_calendar_month .maincalendar .calendarwrapper .previous,
|
||||
section:not(#region-main) .block.block_calendar_month .maincalendar .calendarwrapper .next {
|
||||
width: 30%;
|
||||
font-size: 0.8em; }
|
||||
section:not(#region-main) .block.block_calendar_month .maincalendar .calendartable.calendarmonth th,
|
||||
section:not(#region-main) .block.block_calendar_month .maincalendar .calendartable.calendarmonth td {
|
||||
border: none;
|
||||
text-align: center !important;
|
||||
padding: 0; }
|
||||
section:not(#region-main) .block.block_calendar_month .maincalendar .calendartable.calendarmonth td {
|
||||
height: auto;
|
||||
font-size: 0.8em; }
|
||||
section:not(#region-main) .block.block_calendar_month .maincalendar .calendartable.calendarmonth td.hasevent [data-region="day-content"] {
|
||||
display: none; }
|
||||
section:not(#region-main) .block.block_calendar_month .maincalendar .calendartable.calendarmonth td.hasevent .day-number {
|
||||
display: inline-block;
|
||||
position: relative; }
|
||||
section:not(#region-main) .block.block_calendar_month .maincalendar .calendartable.calendarmonth td.hasevent .day-number:before {
|
||||
content: '.';
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
bottom: 0.4em;
|
||||
left: 0;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
font-size: 3em;
|
||||
color: inherit; }
|
||||
section:not(#region-main) .block.block_calendar_month .maincalendar .calendartable.calendarmonth td:after {
|
||||
content: '';
|
||||
display: block;
|
||||
margin-top: calc(100% - 26px); }
|
||||
section:not(#region-main) .block.block_calendar_month .maincalendar .calendartable.calendarmonth td.clickable:hover {
|
||||
background-color: inherit; }
|
||||
section:not(#region-main) .block.block_calendar_month .maincalendar .calendartable.calendarmonth td.clickable:not(.today):hover .day-number-circle {
|
||||
border-radius: 50%;
|
||||
background-color: #ededed; }
|
||||
section:not(#region-main) .block.block_calendar_month .bottom {
|
||||
border-top: 1px solid rgba(0, 0, 0, 0.125);
|
||||
padding-top: 0.5rem; } }
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
.maincalendar .calendartable.calendarmonth th,
|
||||
.maincalendar .calendartable.calendarmonth td {
|
||||
border: none;
|
||||
text-align: center !important;
|
||||
padding: 0; }
|
||||
.maincalendar .calendartable.calendarmonth td {
|
||||
height: auto;
|
||||
font-size: inherit;
|
||||
padding: 0; }
|
||||
.maincalendar .calendartable.calendarmonth td.hasevent [data-region="day-content"] {
|
||||
display: none; }
|
||||
.maincalendar .calendartable.calendarmonth td:after {
|
||||
content: '';
|
||||
display: block;
|
||||
margin-top: calc(100% - 26px); } }
|
||||
|
||||
.calendarwrapper {
|
||||
position: relative; }
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user