mirror of
https://github.com/moodle/moodle.git
synced 2025-03-14 20:50:21 +01:00
MDL-78200 course: Add group mode information to course page
This commit is contained in:
Amaia Anabitarte
parent
8dbb6183ff
commit
85e554b2d1
@ -278,6 +278,7 @@ class core_course_external extends external_api {
|
||||
$module['downloadcontent'] = $cm->downloadcontent;
|
||||
$module['noviewlink'] = plugin_supports('mod', $cm->modname, FEATURE_NO_VIEW_LINK, false);
|
||||
$module['dates'] = $activitydates;
|
||||
$module['groupmode'] = $cm->groupmode;
|
||||
|
||||
// Check module completion.
|
||||
$completion = $completioninfo->is_enabled($cm);
|
||||
@ -488,6 +489,7 @@ class core_course_external extends external_api {
|
||||
VALUE_DEFAULT,
|
||||
[]
|
||||
),
|
||||
'groupmode' => new external_value(PARAM_INT, 'Group mode value', VALUE_OPTIONAL),
|
||||
'contents' => new external_multiple_structure(
|
||||
new external_single_structure(
|
||||
array(
|
||||
|
||||
@ -119,6 +119,7 @@ class cm implements named_templatable, renderable {
|
||||
$haspartials['alternative'] = $this->add_alternative_content_data($data, $output);
|
||||
$haspartials['completion'] = $this->add_completion_data($data, $output);
|
||||
$haspartials['editor'] = $this->add_editor_data($data, $output);
|
||||
$haspartials['groupmode'] = $this->add_groupmode_data($data, $output);
|
||||
$this->add_format_data($data, $haspartials, $output);
|
||||
|
||||
// Calculated fields.
|
||||
@ -267,6 +268,7 @@ class cm implements named_templatable, renderable {
|
||||
$this->mod->has_custom_cmlist_item() &&
|
||||
!$haspartials['availability'] &&
|
||||
!$haspartials['completion'] &&
|
||||
!$haspartials['groupmode'] &&
|
||||
!isset($data->modhiddenfromstudents) &&
|
||||
!isset($data->modstealth) &&
|
||||
!$this->format->show_editor()
|
||||
@ -304,6 +306,42 @@ class cm implements named_templatable, renderable {
|
||||
return true;
|
||||
}
|
||||
|
||||
/**
|
||||
* Add group mode information to the data structure.
|
||||
*
|
||||
* @param stdClass $data the current cm data reference
|
||||
* @param renderer_base $output typically, the renderer that's calling this function
|
||||
* @return bool the module has group mode information
|
||||
*/
|
||||
protected function add_groupmode_data(stdClass &$data, renderer_base $output): bool {
|
||||
if (!plugin_supports('mod', $this->mod->modname, FEATURE_GROUPS, false)) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!has_capability('moodle/course:manageactivities', $this->mod->context)) {
|
||||
return false;
|
||||
}
|
||||
|
||||
switch ($this->mod->effectivegroupmode) {
|
||||
case SEPARATEGROUPS:
|
||||
$groupicon = 'i/groups';
|
||||
$groupalt = get_string('groupsseparate', 'group');
|
||||
break;
|
||||
case VISIBLEGROUPS:
|
||||
$groupicon = 'i/groupv';
|
||||
$groupalt = get_string('groupsvisible', 'group');
|
||||
break;
|
||||
default:
|
||||
return false;
|
||||
}
|
||||
|
||||
$data->groupmodeinfo = (object) [
|
||||
'groupicon' => $groupicon,
|
||||
'groupalt' => $groupalt,
|
||||
];
|
||||
return true;
|
||||
}
|
||||
|
||||
/**
|
||||
* Returns the CSS classes for the activity name/content
|
||||
*
|
||||
|
||||
@ -102,6 +102,15 @@
|
||||
{{> core_courseformat/local/content/cm/badges }}
|
||||
{{/ core_courseformat/local/content/cm/badges }}
|
||||
|
||||
{{! Group mode }}
|
||||
{{#groupmodeinfo}}
|
||||
<div class="activity-groupmode-info align-self-start mr-sm-2">
|
||||
{{$ core_courseformat/local/content/cm/groupmode_info}}
|
||||
{{> core_courseformat/local/content/cm/groupmode_info}}
|
||||
{{/ core_courseformat/local/content/cm/groupmode_info}}
|
||||
</div>
|
||||
{{/groupmodeinfo}}
|
||||
|
||||
{{! Completion }}
|
||||
{{#activityinfo}}
|
||||
{{#hascompletion}}
|
||||
|
||||
@ -0,0 +1,39 @@
|
||||
{{!
|
||||
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/>.
|
||||
}}
|
||||
{{!
|
||||
@template core_courseformat/local/content/cm/groupmode_info
|
||||
|
||||
Container to display group mode information on the course page.
|
||||
|
||||
Example context (json):
|
||||
{
|
||||
"activityname": "Course announcements",
|
||||
"groupicon": "i/groupv",
|
||||
"groupalt": "Visible groups"
|
||||
}
|
||||
}}
|
||||
<div data-region="groupmode-information"
|
||||
data-activityname="{{activityname}}"
|
||||
class="groupmode-information d-flex align-items-center"
|
||||
>
|
||||
{{#groupicon}}
|
||||
{{#pix}}{{groupicon}}, core, {{groupalt}}{{/pix}}
|
||||
{{/groupicon}}
|
||||
{{#groupalt}}
|
||||
<div class="groupmode-icon-info">{{groupalt}}</div>
|
||||
{{/groupalt}}
|
||||
</div>
|
||||
162
course/tests/behat/activity_groupmode.feature
Normal file
162
course/tests/behat/activity_groupmode.feature
Normal file
@ -0,0 +1,162 @@
|
||||
@core @core_course @javascript
|
||||
Feature: Activities group mode icons behavior in course page
|
||||
|
||||
Scenario Outline: Teachers should see group mode icons in both view and edit mode
|
||||
Given the following "users" exist:
|
||||
| username | firstname | lastname | email |
|
||||
| teacher1 | Teacher | 1 | teacher1@example.com |
|
||||
And the following "courses" exist:
|
||||
| fullname | shortname | format |
|
||||
| Course 1 | C1 | <courseformat> |
|
||||
And the following "course enrolments" exist:
|
||||
| user | course | role |
|
||||
| teacher1 | C1 | editingteacher |
|
||||
And the following "activities" exist:
|
||||
| activity | name | intro | course | idnumber | groupmode |
|
||||
| forum | No groups forum | Forum with groupmode = 0 | C1 | forum1 | 0 |
|
||||
| data | Visible groups database | Database with groupmode = 2 | C1 | data1 | 2 |
|
||||
| assign | Separate groups assignment | Assignment with groupmode = 1 | C1 | assign1 | 1 |
|
||||
And I log in as "teacher1"
|
||||
When I am on "Course 1" course homepage with editing mode <editmode>
|
||||
Then "Separate groups" "icon" should not exist in the "No groups forum" "activity"
|
||||
And "Visible groups" "icon" should not exist in the "No groups forum" "activity"
|
||||
And "Separate groups" "icon" should not exist in the "Visible groups database" "activity"
|
||||
And "Visible groups" "icon" should exist in the "Visible groups database" "activity"
|
||||
And "Separate groups" "icon" should exist in the "Separate groups assignment" "activity"
|
||||
And "Visible groups" "icon" should not exist in the "Separate groups assignment" "activity"
|
||||
|
||||
Examples:
|
||||
| editmode | courseformat |
|
||||
| off | topics |
|
||||
| on | topics |
|
||||
| off | weeks |
|
||||
| on | weeks |
|
||||
|
||||
Scenario Outline: Students should not see group mode icons in both view and edit mode
|
||||
Given the following "users" exist:
|
||||
| username | firstname | lastname | email |
|
||||
| student1 | Student | 1 | student1@example.com |
|
||||
And the following "courses" exist:
|
||||
| fullname | shortname | format |
|
||||
| Course 1 | C1 | <courseformat> |
|
||||
And the following "course enrolments" exist:
|
||||
| user | course | role |
|
||||
| student1 | C1 | student |
|
||||
And the following "activities" exist:
|
||||
| activity | name | intro | course | idnumber | groupmode |
|
||||
| forum | No groups forum | Forum with groupmode = 0 | C1 | forum1 | 0 |
|
||||
| data | Visible groups database | Database with groupmode = 2 | C1 | data1 | 2 |
|
||||
| assign | Separate groups assignment | Assignment with groupmode = 1 | C1 | assign1 | 1 |
|
||||
When I am on the "C1" "Course" page logged in as "student1"
|
||||
Then "Separate groups" "icon" should not exist in the "No groups forum" "activity"
|
||||
And "Visible groups" "icon" should not exist in the "No groups forum" "activity"
|
||||
And "Separate groups" "icon" should not exist in the "Visible groups database" "activity"
|
||||
And "Visible groups" "icon" should not exist in the "Visible groups database" "activity"
|
||||
And "Separate groups" "icon" should not exist in the "Separate groups assignment" "activity"
|
||||
And "Visible groups" "icon" should not exist in the "Separate groups assignment" "activity"
|
||||
# Giving moodle/course:manageactivities capability would let them see the icons.
|
||||
And the following "role capability" exists:
|
||||
| role | student |
|
||||
| moodle/course:manageactivities | allow |
|
||||
And I am on the "C1" "Course" page
|
||||
And "Visible groups" "icon" should exist in the "Visible groups database" "activity"
|
||||
And "Separate groups" "icon" should exist in the "Separate groups assignment" "activity"
|
||||
|
||||
Examples:
|
||||
| courseformat |
|
||||
| topics |
|
||||
| weeks |
|
||||
|
||||
Scenario Outline: Resources don't support group mode never show groupmode icon in the course page
|
||||
Given the following "users" exist:
|
||||
| username | firstname | lastname | email |
|
||||
| teacher1 | Teacher | 1 | teacher1@example.com |
|
||||
And the following "courses" exist:
|
||||
| fullname | shortname | format |
|
||||
| Course 1 | C1 | <courseformat> |
|
||||
And the following "course enrolments" exist:
|
||||
| user | course | role |
|
||||
| teacher1 | C1 | editingteacher |
|
||||
And the following "activities" exist:
|
||||
| activity | name | intro | course | idnumber | groupmode |
|
||||
| page | No groups page | Page with groupmode = 0 | C1 | page0 | 0 |
|
||||
| page | Visible groups page | Page with groupmode = 2 | C1 | page2 | 2 |
|
||||
| page | Separate groups page | Page with groupmode = 1 | C1 | page1 | 1 |
|
||||
And I log in as "teacher1"
|
||||
When I am on "Course 1" course homepage with editing mode on
|
||||
Then "Separate groups" "icon" should not exist in the "No groups page" "activity"
|
||||
And "Visible groups" "icon" should not exist in the "No groups page" "activity"
|
||||
And "Separate groups" "icon" should not exist in the "Visible groups page" "activity"
|
||||
And "Visible groups" "icon" should not exist in the "Visible groups page" "activity"
|
||||
And "Separate groups" "icon" should not exist in the "Separate groups page" "activity"
|
||||
And "Visible groups" "icon" should not exist in the "Separate groups page" "activity"
|
||||
|
||||
Examples:
|
||||
| courseformat |
|
||||
| topics |
|
||||
| weeks |
|
||||
|
||||
Scenario Outline: Group mode icon behavior in the course page when forcing group mode in course settings
|
||||
Given the following "users" exist:
|
||||
| username | firstname | lastname | email |
|
||||
| teacher1 | Teacher | 1 | teacher1@example.com |
|
||||
And the following "courses" exist:
|
||||
| fullname | shortname | format | groupmodeforce | groupmode |
|
||||
| Course 1 | C1 | <courseformat> | 1 | <groupmode> |
|
||||
And the following "course enrolments" exist:
|
||||
| user | course | role |
|
||||
| teacher1 | C1 | editingteacher |
|
||||
And the following "activities" exist:
|
||||
| activity | name | intro | course | idnumber | groupmode |
|
||||
| forum | No groups forum | Forum with groupmode = 0 | C1 | forum1 | 0 |
|
||||
| data | Visible groups database | Database with groupmode = 2 | C1 | data1 | 2 |
|
||||
| assign | Separate groups assignment | Assignment with groupmode = 1 | C1 | assign1 | 1 |
|
||||
| page | No groups page | Doesn't support groupmode | C1 | page | 1 |
|
||||
And I log in as "teacher1"
|
||||
When I am on "Course 1" course homepage with editing mode on
|
||||
Then "Separate groups" "icon" <separate> in the "No groups forum" "activity"
|
||||
And "Visible groups" "icon" <visible> in the "No groups forum" "activity"
|
||||
And "Separate groups" "icon" <separate> in the "Visible groups database" "activity"
|
||||
And "Visible groups" "icon" <visible> in the "Visible groups database" "activity"
|
||||
And "Separate groups" "icon" <separate> in the "Separate groups assignment" "activity"
|
||||
And "Visible groups" "icon" <visible> in the "Separate groups assignment" "activity"
|
||||
And "Separate groups" "icon" should not exist in the "No groups page" "activity"
|
||||
And "Visible groups" "icon" should not exist in the "No groups page" "activity"
|
||||
|
||||
Examples:
|
||||
| courseformat | groupmode | separate | visible |
|
||||
| topics | 0 | should not exist | should not exist |
|
||||
| topics | 1 | should exist | should not exist |
|
||||
| topics | 2 | should not exist | should exist |
|
||||
| weeks | 0 | should not exist | should not exist |
|
||||
| weeks | 1 | should exist | should not exist |
|
||||
| weeks | 2 | should not exist | should exist |
|
||||
|
||||
Scenario Outline: Group mode icon in the course page in small devices
|
||||
Given the following "users" exist:
|
||||
| username | firstname | lastname | email |
|
||||
| teacher1 | Teacher | 1 | teacher1@example.com |
|
||||
And the following "courses" exist:
|
||||
| fullname | shortname | format |
|
||||
| Course 1 | C1 | <courseformat> |
|
||||
And the following "course enrolments" exist:
|
||||
| user | course | role |
|
||||
| teacher1 | C1 | editingteacher |
|
||||
And the following "activities" exist:
|
||||
| activity | name | intro | course | idnumber | groupmode |
|
||||
| forum | Forum | Forum with groupmode = 0 | C1 | forum1 | 0 |
|
||||
| data | Database | Database with groupmode = 2 | C1 | data1 | 2 |
|
||||
| assign | Assignment | Assignment with groupmode = 1 | C1 | assign1 | 1 |
|
||||
| page | Page | Doesn't support groupmode | C1 | page | 1 |
|
||||
And I log in as "teacher1"
|
||||
When I am on "Course 1" course homepage with editing mode on
|
||||
And I should not see "Separate groups"
|
||||
And I should not see "Visible groups"
|
||||
And I change viewport size to "480x800"
|
||||
And I should see "Separate groups"
|
||||
And I should see "Visible groups"
|
||||
|
||||
Examples:
|
||||
| courseformat |
|
||||
| topics |
|
||||
| weeks |
|
||||
@ -255,8 +255,6 @@ class icon_system_fontawesome extends icon_system_font {
|
||||
'core:i/groupevent' => 'fa-group',
|
||||
'core:i/groupn' => 'fa-user',
|
||||
'core:i/group' => 'fa-users',
|
||||
'core:i/groups' => 'fa-user-circle',
|
||||
'core:i/groupv' => 'fa-user-circle-o',
|
||||
'core:i/home' => 'fa-home',
|
||||
'core:i/hide' => 'fa-eye',
|
||||
'core:i/hierarchylock' => 'fa-lock',
|
||||
|
||||
BIN
pix/i/groups.png
BIN
pix/i/groups.png
Binary file not shown.
|
Before Width: | Height: | Size: 468 B After Width: | Height: | Size: 435 B |
@ -1,3 +1,11 @@
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" [
|
||||
<!ENTITY ns_flows "http://ns.adobe.com/Flows/1.0/">
|
||||
]><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid meet" overflow="visible"><path d="M4.4 13H0V9.9l2.2-1.3c.4-.2.4-.6.1-1 0 0-1.3-1.5-1.3-3.2C1 2 2.5 0 4.4 0s3.4 2 3.4 4.4c0 1.7-1.2 3.2-1.2 3.2-.3.4-.2.8.2 1l1.1.6c.3.6.6 1.1.8 1.4L4.4 13zm11.6-.8l-1.9-1c-.4-.2-.5-.7-.2-1 0 0 1.2-1.5 1.2-3.2 0-2.4-1.5-4.4-3.4-4.4S8.3 4.6 8.3 7c0 1.7 1.3 3.2 1.3 3.2.3.4.3.8-.1 1.1l-4.1 2.3V16H16v-3.8z" fill="#888"/></svg>
|
||||
<svg width="20" height="16" viewBox="0 0 20 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M3.99937 3.99875C5.1036 3.99875 5.99875 3.1036 5.99875 1.99937C5.99875 0.89515 5.1036 0 3.99937 0C2.89515 0 2 0.89515 2 1.99937C2 3.1036 2.89515 3.99875 3.99937 3.99875Z" fill="#212529"/>
|
||||
<path d="M11.9997 9.99937C11.9997 11.1036 11.1046 11.9987 10.0003 11.9987C8.89613 11.9987 8.00098 11.1036 8.00098 9.99937C8.00098 8.89515 8.89613 8 10.0003 8C11.1046 8 11.9997 8.89515 11.9997 9.99937Z" fill="#212529"/>
|
||||
<path d="M6 15.4456C6 13.7887 7.34315 12.4456 9 12.4456H11C12.6569 12.4456 14 13.7887 14 15.4456V15.5C14 15.7761 13.7761 16 13.5 16H6.5C6.22386 16 6 15.7761 6 15.5V15.4456Z" fill="#212529"/>
|
||||
<path d="M0 7.44556C0 5.7887 1.34315 4.44556 3 4.44556H5C6.65685 4.44556 8 5.7887 8 7.44556V7.5C8 7.77614 7.77614 8 7.5 8L0.5 8C0.223858 8 0 7.77614 0 7.5V7.44556Z" fill="#212529"/>
|
||||
<path d="M15.9994 3.99875C17.1036 3.99875 17.9987 3.1036 17.9987 1.99937C17.9987 0.89515 17.1036 0 15.9994 0C14.8951 0 14 0.89515 14 1.99937C14 3.1036 14.8951 3.99875 15.9994 3.99875Z" fill="#212529"/>
|
||||
<path d="M12 7.44556C12 5.7887 13.3431 4.44556 15 4.44556H16.9993C18.6561 4.44556 19.9993 5.7887 19.9993 7.44556V7.5C19.9993 7.77614 19.7754 8 19.4993 8H12.5C12.2239 8 12 7.77614 12 7.5V7.44556Z" fill="#212529"/>
|
||||
<path d="M2.29289 10.7071C1.90237 10.3166 1.90237 9.68342 2.29289 9.29289C2.68342 8.90237 3.31658 8.90237 3.70711 9.29289L5.70711 11.2929C6.09763 11.6834 6.09763 12.3166 5.70711 12.7071C5.31658 13.0976 4.68342 13.0976 4.29289 12.7071L2.29289 10.7071Z" fill="#212529"/>
|
||||
<path d="M17.7071 9.29289C18.0976 9.68342 18.0976 10.3166 17.7071 10.7071L15.7071 12.7071C15.3166 13.0976 14.6834 13.0976 14.2929 12.7071C13.9024 12.3166 13.9024 11.6834 14.2929 11.2929L16.2929 9.29289C16.6834 8.90237 17.3166 8.90237 17.7071 9.29289Z" fill="#212529"/>
|
||||
<path d="M8.5 2C7.94772 2 7.5 2.44772 7.5 3C7.5 3.55228 7.94772 4 8.5 4L11.5 4C12.0523 4 12.5 3.55228 12.5 3C12.5 2.44771 12.0523 2 11.5 2L8.5 2Z" fill="#212529"/>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 625 B After Width: | Height: | Size: 2.0 KiB |
BIN
pix/i/groupv.png
BIN
pix/i/groupv.png
Binary file not shown.
|
Before Width: | Height: | Size: 417 B After Width: | Height: | Size: 499 B |
@ -1,3 +1,3 @@
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" [
|
||||
<!ENTITY ns_flows "http://ns.adobe.com/Flows/1.0/">
|
||||
]><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid meet" overflow="visible"><path d="M3 16H0v-4l3.2-1.7c.4-.3.6-.8.2-1.3C3.4 9 2 7.2 2 5.2 2 2.3 3.8 0 6 0c.4 0 .7.1 1.1.2-1.2 1.1-2 3-2 5 0 1.7.6 2.7 1 3.5.6.9.1 1-.3 1.3L3 11.4V16zm13-4.1l-3.1-1.6c-.5-.3-.6-.9-.3-1.3 0 0 1.4-1.8 1.4-3.8C14 2.3 12.2 0 10 0S6 2.3 6 5.2C6 7.2 7.5 9 7.5 9c.3.4.2 1-.3 1.3L4 12v4h12v-4.1z" fill="#888"/></svg>
|
||||
<svg width="20" height="16" viewBox="0 0 20 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M4.5 0C5.375 0 6.1875 0.5 6.65625 1.25C7.09375 2.03125 7.09375 3 6.65625 3.75C6.1875 4.53125 5.375 5 4.5 5C3.59375 5 2.78125 4.53125 2.3125 3.75C1.875 3 1.875 2.03125 2.3125 1.25C2.78125 0.5 3.59375 0 4.5 0ZM16 0C16.875 0 17.6875 0.5 18.1562 1.25C18.5938 2.03125 18.5938 3 18.1562 3.75C17.6875 4.53125 16.875 5 16 5C15.0938 5 14.2812 4.53125 13.8125 3.75C13.375 3 13.375 2.03125 13.8125 1.25C14.2812 0.5 15.0938 0 16 0ZM0 9.34375C0 7.5 1.46875 6 3.3125 6H4.65625C5.15625 6 5.625 6.125 6.0625 6.3125C6 6.53125 6 6.78125 6 7C6 8.21875 6.5 9.28125 7.34375 10C7.34375 10 7.34375 10 7.3125 10H0.65625C0.28125 10 0 9.71875 0 9.34375ZM12.6562 10H12.625C13.4688 9.28125 13.9688 8.21875 13.9688 7C13.9688 6.78125 13.9688 6.53125 13.9375 6.3125C14.3438 6.125 14.8125 6 15.3125 6H16.6562C18.5 6 20 7.5 20 9.34375C20 9.71875 19.6875 10 19.3125 10H12.6562ZM7 7C7 5.9375 7.5625 4.96875 8.5 4.40625C9.40625 3.875 10.5625 3.875 11.5 4.40625C12.4062 4.96875 13 5.9375 13 7C13 8.09375 12.4062 9.0625 11.5 9.625C10.5625 10.1562 9.40625 10.1562 8.5 9.625C7.5625 9.0625 7 8.09375 7 7ZM4 15.1875C4 12.875 5.84375 11 8.15625 11H11.8125C14.125 11 16 12.875 16 15.1875C16 15.625 15.625 16 15.1562 16H4.8125C4.375 16 4 15.6562 4 15.1875Z" fill="#212529"/>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 607 B After Width: | Height: | Size: 1.3 KiB |
@ -1448,21 +1448,23 @@ $activity-add-hover: theme-color-level('primary', -10) !default;
|
||||
.activity-grid {
|
||||
display: grid;
|
||||
align-items: center;
|
||||
grid-template-columns: min-content 1fr min-content min-content;
|
||||
grid-template-columns: min-content 1fr min-content min-content min-content;
|
||||
grid-template-rows: 1fr repeat(5, min-content);
|
||||
grid-template-areas:
|
||||
"icon name completion actions"
|
||||
"icon visibility completion actions"
|
||||
"icon dates completion actions"
|
||||
"altcontent altcontent altcontent altcontent"
|
||||
"afterlink afterlink afterlink afterlink"
|
||||
"availability availability availability availability";
|
||||
"icon name groupmode completion actions"
|
||||
"icon visibility groupmode completion actions"
|
||||
"icon dates groupmode completion actions"
|
||||
"altcontent altcontent altcontent altcontent altcontent"
|
||||
"afterlink afterlink afterlink afterlink afterlink"
|
||||
"availability availability availability availability availability";
|
||||
@include media-breakpoint-down(xs) {
|
||||
grid-template-columns: min-content 1fr min-content;
|
||||
grid-template-columns: min-content 1fr min-content min-content min-content;
|
||||
grid-template-rows: 1fr repeat(4, min-content);
|
||||
grid-template-areas:
|
||||
"icon name actions"
|
||||
"icon visibility actions"
|
||||
"dates dates dates"
|
||||
"groupmode groupmode groupmode"
|
||||
"completion completion completion"
|
||||
"altcontent altcontent altcontent"
|
||||
"afterlink afterlink afterlink"
|
||||
@ -1471,17 +1473,18 @@ $activity-add-hover: theme-color-level('primary', -10) !default;
|
||||
}
|
||||
// Activity card specific grid layout for activities without name.
|
||||
.activity-grid.noname-grid {
|
||||
grid-template-columns: min-content 1fr min-content;
|
||||
grid-template-columns: min-content min-content 1fr min-content;
|
||||
grid-template-areas:
|
||||
"visibility completion actions"
|
||||
"altcontent altcontent altcontent"
|
||||
"afterlink afterlink afterlink"
|
||||
"availability availability availability";
|
||||
"visibility groupmode completion actions"
|
||||
"altcontent altcontent altcontent altcontent"
|
||||
"afterlink afterlink afterlink afterlink"
|
||||
"availability availability availability availability";
|
||||
@include media-breakpoint-down(xs) {
|
||||
grid-template-columns: 1fr min-content;
|
||||
grid-template-areas:
|
||||
"visibility actions"
|
||||
"altcontent altcontent"
|
||||
"groupmode groupmode"
|
||||
"afterlink afterlink"
|
||||
"completion completion"
|
||||
"availability availability";
|
||||
@ -1559,6 +1562,26 @@ $activity-add-hover: theme-color-level('primary', -10) !default;
|
||||
}
|
||||
}
|
||||
|
||||
.activity-groupmode-info {
|
||||
grid-area: groupmode;
|
||||
justify-self: end;
|
||||
.groupmode-information {
|
||||
height: ($icon-width + 15px);
|
||||
.groupmode-icon-info {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@include media-breakpoint-down(xs) {
|
||||
width: 100%;
|
||||
margin-top: map-get($spacers, 2);
|
||||
padding-top: map-get($spacers, 2);
|
||||
border-top: $border-width solid $border-color;
|
||||
.groupmode-information .groupmode-icon-info {
|
||||
display: inline;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.activity-badges {
|
||||
grid-area: visibility;
|
||||
.badge {
|
||||
|
||||
@ -29040,24 +29040,25 @@ span.editinstructions .alert-link {
|
||||
.activity-item .activity-grid {
|
||||
display: grid;
|
||||
align-items: center;
|
||||
grid-template-columns: min-content 1fr min-content min-content;
|
||||
grid-template-columns: min-content 1fr min-content min-content min-content;
|
||||
grid-template-rows: 1fr repeat(5, min-content);
|
||||
grid-template-areas: "icon name completion actions" "icon visibility completion actions" "icon dates completion actions" "altcontent altcontent altcontent altcontent" "afterlink afterlink afterlink afterlink" "availability availability availability availability";
|
||||
grid-template-areas: "icon name groupmode completion actions" "icon visibility groupmode completion actions" "icon dates groupmode completion actions" "altcontent altcontent altcontent altcontent altcontent" "afterlink afterlink afterlink afterlink afterlink" "availability availability availability availability availability";
|
||||
}
|
||||
@media (max-width: 575.98px) {
|
||||
.activity-item .activity-grid {
|
||||
grid-template-columns: min-content 1fr min-content;
|
||||
grid-template-areas: "icon name actions" "icon visibility actions" "dates dates dates" "completion completion completion" "altcontent altcontent altcontent" "afterlink afterlink afterlink" "availability availability availability";
|
||||
grid-template-columns: min-content 1fr min-content min-content min-content;
|
||||
grid-template-rows: 1fr repeat(4, min-content);
|
||||
grid-template-areas: "icon name actions" "icon visibility actions" "dates dates dates" "groupmode groupmode groupmode" "completion completion completion" "altcontent altcontent altcontent" "afterlink afterlink afterlink" "availability availability availability";
|
||||
}
|
||||
}
|
||||
.activity-item .activity-grid.noname-grid {
|
||||
grid-template-columns: min-content 1fr min-content;
|
||||
grid-template-areas: "visibility completion actions" "altcontent altcontent altcontent" "afterlink afterlink afterlink" "availability availability availability";
|
||||
grid-template-columns: min-content min-content 1fr min-content;
|
||||
grid-template-areas: "visibility groupmode completion actions" "altcontent altcontent altcontent altcontent" "afterlink afterlink afterlink afterlink" "availability availability availability availability";
|
||||
}
|
||||
@media (max-width: 575.98px) {
|
||||
.activity-item .activity-grid.noname-grid {
|
||||
grid-template-columns: 1fr min-content;
|
||||
grid-template-areas: "visibility actions" "altcontent altcontent" "afterlink afterlink" "completion completion" "availability availability";
|
||||
grid-template-areas: "visibility actions" "altcontent altcontent" "groupmode groupmode" "afterlink afterlink" "completion completion" "availability availability";
|
||||
}
|
||||
}
|
||||
.activity-item .activity-actions {
|
||||
@ -29123,6 +29124,27 @@ span.editinstructions .alert-link {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.activity-item .activity-groupmode-info {
|
||||
grid-area: groupmode;
|
||||
justify-self: end;
|
||||
}
|
||||
.activity-item .activity-groupmode-info .groupmode-information {
|
||||
height: 31px;
|
||||
}
|
||||
.activity-item .activity-groupmode-info .groupmode-information .groupmode-icon-info {
|
||||
display: none;
|
||||
}
|
||||
@media (max-width: 575.98px) {
|
||||
.activity-item .activity-groupmode-info {
|
||||
width: 100%;
|
||||
margin-top: 0.5rem;
|
||||
padding-top: 0.5rem;
|
||||
border-top: 1px solid #dee2e6;
|
||||
}
|
||||
.activity-item .activity-groupmode-info .groupmode-information .groupmode-icon-info {
|
||||
display: inline;
|
||||
}
|
||||
}
|
||||
.activity-item .activity-badges {
|
||||
grid-area: visibility;
|
||||
}
|
||||
|
||||
@ -29040,24 +29040,25 @@ span.editinstructions .alert-link {
|
||||
.activity-item .activity-grid {
|
||||
display: grid;
|
||||
align-items: center;
|
||||
grid-template-columns: min-content 1fr min-content min-content;
|
||||
grid-template-columns: min-content 1fr min-content min-content min-content;
|
||||
grid-template-rows: 1fr repeat(5, min-content);
|
||||
grid-template-areas: "icon name completion actions" "icon visibility completion actions" "icon dates completion actions" "altcontent altcontent altcontent altcontent" "afterlink afterlink afterlink afterlink" "availability availability availability availability";
|
||||
grid-template-areas: "icon name groupmode completion actions" "icon visibility groupmode completion actions" "icon dates groupmode completion actions" "altcontent altcontent altcontent altcontent altcontent" "afterlink afterlink afterlink afterlink afterlink" "availability availability availability availability availability";
|
||||
}
|
||||
@media (max-width: 575.98px) {
|
||||
.activity-item .activity-grid {
|
||||
grid-template-columns: min-content 1fr min-content;
|
||||
grid-template-areas: "icon name actions" "icon visibility actions" "dates dates dates" "completion completion completion" "altcontent altcontent altcontent" "afterlink afterlink afterlink" "availability availability availability";
|
||||
grid-template-columns: min-content 1fr min-content min-content min-content;
|
||||
grid-template-rows: 1fr repeat(4, min-content);
|
||||
grid-template-areas: "icon name actions" "icon visibility actions" "dates dates dates" "groupmode groupmode groupmode" "completion completion completion" "altcontent altcontent altcontent" "afterlink afterlink afterlink" "availability availability availability";
|
||||
}
|
||||
}
|
||||
.activity-item .activity-grid.noname-grid {
|
||||
grid-template-columns: min-content 1fr min-content;
|
||||
grid-template-areas: "visibility completion actions" "altcontent altcontent altcontent" "afterlink afterlink afterlink" "availability availability availability";
|
||||
grid-template-columns: min-content min-content 1fr min-content;
|
||||
grid-template-areas: "visibility groupmode completion actions" "altcontent altcontent altcontent altcontent" "afterlink afterlink afterlink afterlink" "availability availability availability availability";
|
||||
}
|
||||
@media (max-width: 575.98px) {
|
||||
.activity-item .activity-grid.noname-grid {
|
||||
grid-template-columns: 1fr min-content;
|
||||
grid-template-areas: "visibility actions" "altcontent altcontent" "afterlink afterlink" "completion completion" "availability availability";
|
||||
grid-template-areas: "visibility actions" "altcontent altcontent" "groupmode groupmode" "afterlink afterlink" "completion completion" "availability availability";
|
||||
}
|
||||
}
|
||||
.activity-item .activity-actions {
|
||||
@ -29123,6 +29124,27 @@ span.editinstructions .alert-link {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.activity-item .activity-groupmode-info {
|
||||
grid-area: groupmode;
|
||||
justify-self: end;
|
||||
}
|
||||
.activity-item .activity-groupmode-info .groupmode-information {
|
||||
height: 31px;
|
||||
}
|
||||
.activity-item .activity-groupmode-info .groupmode-information .groupmode-icon-info {
|
||||
display: none;
|
||||
}
|
||||
@media (max-width: 575.98px) {
|
||||
.activity-item .activity-groupmode-info {
|
||||
width: 100%;
|
||||
margin-top: 0.5rem;
|
||||
padding-top: 0.5rem;
|
||||
border-top: 1px solid #dee2e6;
|
||||
}
|
||||
.activity-item .activity-groupmode-info .groupmode-information .groupmode-icon-info {
|
||||
display: inline;
|
||||
}
|
||||
}
|
||||
.activity-item .activity-badges {
|
||||
grid-area: visibility;
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user