Miqra-Engineering/moodle_local_treestudyplan
2
0
Fork 0
Code Issues 13 Pull Requests Packages Projects Releases 4 Wiki Activity

Implemented progress option on studyplan card

Browse Source
This commit is contained in:
PMKuipers 2023-10-23 23:19:14 +02:00
parent c6882b916a
commit 1975952c8f
14 changed files with 454 additions and 128 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
amd/build/treestudyplan-components.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
amd/build/treestudyplan-components.min.js.map
View File

File diff suppressed because one or more lines are too long

63
amd/src/treestudyplan-components.js
View File

@ -27,7 +27,8 @@ export default {
open: "open",
noenddate: "noenddate",
idnumber: "studyplan_idnumber",
description: "studyplan_description"
description: "studyplan_description",
completed: "completed",
}
});
// Create new eventbus for interaction between item components
@ -40,7 +41,7 @@ export default {
},
open: {
type: Boolean
}
},
},
data() {
return {
@ -72,6 +73,27 @@ export default {
else {
return this.text.noenddate;
}
},
width_completed() {
if(this.value.progress) {
return this.value.progress * 100;
} else {
return 0;
}
},
width_incomplete() {
if(this.value.progress) {
return (1-this.value.progress) * 100;
} else {
return 100;
}
},
percentage_complete() {
if(this.value.progress) {
return Math.round(this.value.progress * 100) + "%";
} else {
return "0%";
}
}
},
methods: {
@ -84,14 +106,37 @@ export default {
:class="'s-studyplan-card timing-' + timing"
>
<template #header></template>
<b-card-title>
<a v-if='open' href='#' @click.prevent='onOpenClick($event)'>{{value.name}}</a>
<template v-else>{{value.name}}</template>
<slot name='title'></slot>
</b-card-title>
<div class='s-studyplan-card-icon'><img :src='value.icon' style="width: 64px; height: 64px;"></div>
<div class='s-studyplan-card-idnumber' v-if='value.idnumber'><i>{{ text.idnumber}}:</i> {{ value.idnumber }}</div>
<div class='s-studyplan-card-content'>
<div class='s-studyplan-card-icon'><img :src='value.icon'></div>
<div class='s-studyplan-card-info'>
<div class='s-studyplan-card-titlebar'>
<b-card-title>
<a v-if='open' href='#' @click.prevent='onOpenClick($event)'>{{value.name}}</a>
<template v-else>{{value.name}}</template>
</b-card-title>
<div class='s-studyplan-card-titleslot'><slot name='title'></slot></div>
</div>
<div class='s-studyplan-card-idnumber' v-if='value.idnumber'>
{{ text.idnumber }}: {{ value.idnumber }}
</div>
<div class='s-studyplan-card-progress' v-if='value.progress !== undefined && value.progress !== null'>
<div class="s-studyplan-card-progressbar"
><span v-if="width_completed > 0"
:style="{width: width_completed+'%'}"
class='s-studyplan-card-progress-segment s-studyplan-card-progress-completed'
></span
><span :style="{width: width_incomplete+'%'}"
class='s-studyplan-card-progress-segment s-studyplan-card-progress-incomplete'
></span
></div>
<div class="s-studyplan-card-progresstext">
{{ percentage_complete}} {{ text.completed.toLowerCase() }}
</div>
</div>
</div>
</div>
<slot></slot>
<template #footer>
<span :class="'t-timing-'+timing" v-html="startdate + ' - '+ enddate"></span>

2
classes/studyitem.php
View File

@ -526,7 +526,7 @@ class studyitem {
* @param int $userid User id
* @return int completion:: constant
*/
private function completion($userid) : int {
public function completion($userid) : int {
global $DB;
if ($this->valid()) {

20
classes/studyplan.php
View File

@ -221,6 +221,7 @@ class studyplan {
"aggregation_config" => new \external_value(PARAM_TEXT, 'config string for aggregator'),
"aggregation_info" => aggregator::basic_structure(),
"pages" => new \external_multiple_structure(studyplanpage::simple_structure(), 'pages'),
"progress" => new \external_value(PARAM_FLOAT,"fraction of completed modules",VALUE_OPTIONAL),
], 'Basic studyplan info', $value);
}
@ -247,6 +248,8 @@ class studyplan {
'aggregation_config' => $this->aggregator->config_string(),
'aggregation_info' => $this->aggregator->basic_model(),
'pages' => $pages,
// Next line is for development debugging only.
"progress" => (\rand(0,100) / 100),
];
}
@ -623,6 +626,7 @@ class studyplan {
"description" => new \external_value(PARAM_RAW, 'description of studyplan'),
"descriptionformat" => new \external_value(PARAM_INT, 'description format'),
"icon" => new \external_value(PARAM_RAW,'icon for this plan'),
"progress" => new \external_value(PARAM_FLOAT,"fraction of completed modules"),
"idnumber" => new \external_value(PARAM_TEXT, 'idnumber of curriculum'),
"pages" => new \external_multiple_structure(studyplanpage::user_structure()),
"aggregation_info" => aggregator::basic_structure(),
@ -630,6 +634,21 @@ class studyplan {
}
/**
* Scan user progress (completed modules) over all pages for a specific user
* @param int $userid ID of user to check for
* @return float Fraction of completion
*/
private function scanuserprogress($userid) {
$progress = 0;
$pages = $this->pages();
foreach ($pages as $p) {
$progress += $p->scanuserprogress($userid);
}
// Now average it out over the amount of pages
$progress = $progress / count($pages);
}
/**
* Webservice model for user info
* @param int $userid ID of user to check specific info for
@ -645,6 +664,7 @@ class studyplan {
'descriptionformat' => $this->r->descriptionformat,
'icon' => $this->icon(),
'idnumber' => $this->r->idnumber,
'progress' => $this->scanuserprogress($userid),
'pages' => [],
'aggregation_info' => $this->aggregator->basic_model(),
];

23
classes/studyplanpage.php
View File

@ -335,6 +335,29 @@ class studyplanpage {
return $model;
}
/**
* Scan user progress (completed modules) over this page for a specific user
* @param int $userid ID of user to check for
* @return float Fraction of completion
*/
public function scanuserprogress($userid) {
$courses = 0;
$completed = 0;
foreach (studyline::find_page_children($this) as $line) {
$items = studyitem::find_studyline_children($line);
foreach ($items as $c) {
if (in_array($c->type(), studyline::COURSE_TYPES)) {
$courses += 1;
if($c->completion($userid) >= completion::COMPLETED){
$completed += 1;
}
}
}
}
return ($completed/$courses);
}
/**
* Find list of pages belonging to a specified study plan
* @param studyplan $plan Studyplan to search pages for

154
css/devstyles.css
View File

@ -1178,45 +1178,6 @@
.features-treestudyplan .r-completion-bar-ungraded {
background-color: var(--warning);
}
.path-local-treestudyplan .card.s-studyplan-card,
.features-treestudyplan .card.s-studyplan-card {
min-width: 300px;
max-width: 500px;
margin-bottom: 1em;
}
.path-local-treestudyplan .card.s-studyplan-card.timing-past .card-header,
.features-treestudyplan .card.s-studyplan-card.timing-past .card-header {
background-color: var(--past);
}
.path-local-treestudyplan .card.s-studyplan-card.timing-present .card-header,
.features-treestudyplan .card.s-studyplan-card.timing-present .card-header {
background-color: var(--present);
}
.path-local-treestudyplan .card.s-studyplan-card.timing-future .card-header,
.features-treestudyplan .card.s-studyplan-card.timing-future .card-header {
background-color: var(--future);
}
.path-local-treestudyplan .s-studyplan-card-title-buttons,
.features-treestudyplan .s-studyplan-card-title-buttons {
font-size: 16px;
float: right;
}
.path-local-treestudyplan .s-studyplan-card-title-buttons > *,
.features-treestudyplan .s-studyplan-card-title-buttons > * {
margin-left: 0.2em;
margin-right: 0.3em;
}
.path-local-treestudyplan .s-studyplan-card-buttons,
.features-treestudyplan .s-studyplan-card-buttons {
float: right;
display: flex;
align-items: center;
justify-content: right;
}
.path-local-treestudyplan .s-studyplan-card-buttons > *,
.features-treestudyplan .s-studyplan-card-buttons > * {
margin-left: 1em;
}
.path-local-treestudyplan .s-studyplan-associate-window .custom-select,
.features-treestudyplan .s-studyplan-associate-window .custom-select {
width: 100%;
@ -1334,6 +1295,121 @@
border-color: #aaa;
}
.path-local-treestudyplan .card.s-studyplan-card,
.features-treestudyplan .card.s-studyplan-card {
min-width: 300px;
max-width: 500px;
margin-bottom: 1em;
}
.path-local-treestudyplan .card.s-studyplan-card.timing-past .card-header,
.features-treestudyplan .card.s-studyplan-card.timing-past .card-header {
background-color: var(--past);
}
.path-local-treestudyplan .card.s-studyplan-card.timing-present .card-header,
.features-treestudyplan .card.s-studyplan-card.timing-present .card-header {
background-color: var(--present);
}
.path-local-treestudyplan .card.s-studyplan-card.timing-future .card-header,
.features-treestudyplan .card.s-studyplan-card.timing-future .card-header {
background-color: var(--future);
}
.path-local-treestudyplan .s-studyplan-card-title-buttons,
.features-treestudyplan .s-studyplan-card-title-buttons {
font-size: 16px;
float: right;
}
.path-local-treestudyplan .s-studyplan-card-title-buttons > *,
.features-treestudyplan .s-studyplan-card-title-buttons > * {
margin-left: 0.2em;
margin-right: 0.3em;
}
.path-local-treestudyplan .s-studyplan-card-buttons,
.features-treestudyplan .s-studyplan-card-buttons {
float: right;
display: flex;
align-items: center;
justify-content: right;
}
.path-local-treestudyplan .s-studyplan-card-buttons > *,
.features-treestudyplan .s-studyplan-card-buttons > * {
margin-left: 1em;
}
.path-local-treestudyplan .s-studyplan-card-content,
.features-treestudyplan .s-studyplan-card-content {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
gap: 20px;
height: 100%;
}
.path-local-treestudyplan .s-studyplan-card-icon img,
.features-treestudyplan .s-studyplan-card-icon img {
width: 64px;
height: 64px;
}
.path-local-treestudyplan .s-studyplan-card-titlebar,
.features-treestudyplan .s-studyplan-card-titlebar {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-between;
gap: 5px;
}
.path-local-treestudyplan .s-studyplan-card-titlebuttons,
.features-treestudyplan .s-studyplan-card-titlebuttons {
margin-left: auto;
}
.path-local-treestudyplan .s-studyplan-card-info,
.features-treestudyplan .s-studyplan-card-info {
width: 100%;
display: flex;
flex-direction: column;
flex-wrap: nowrap;
}
.path-local-treestudyplan .s-studyplan-card-info > :last-child,
.features-treestudyplan .s-studyplan-card-info > :last-child {
margin-top: auto;
}
.path-local-treestudyplan .s-studyplan-card-progressbar,
.features-treestudyplan .s-studyplan-card-progressbar {
width: calc(100% - 2px);
height: 16px;
}
.path-local-treestudyplan .s-studyplan-card-progressbar .s-studyplan-card-progress-segment,
.features-treestudyplan .s-studyplan-card-progressbar .s-studyplan-card-progress-segment {
display: inline-block;
height: 10px;
border-top: solid;
border-bottom: solid;
border-color: var(--info);
border-width: 1px;
}
.path-local-treestudyplan .s-studyplan-card-progressbar .s-studyplan-card-progress-segment:first-child,
.features-treestudyplan .s-studyplan-card-progressbar .s-studyplan-card-progress-segment:first-child {
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
border-left: 1px solid var(--info);
}
.path-local-treestudyplan .s-studyplan-card-progressbar .s-studyplan-card-progress-segment:last-child,
.features-treestudyplan .s-studyplan-card-progressbar .s-studyplan-card-progress-segment:last-child {
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
border-right: 1px solid var(--info);
}
.path-local-treestudyplan .s-studyplan-card-progressbar .s-studyplan-card-progress-completed,
.features-treestudyplan .s-studyplan-card-progressbar .s-studyplan-card-progress-completed {
background-color: var(--info);
}
.path-local-treestudyplan .s-studyplan-card-progressbar .s-studyplan-card-progress-incomplete,
.features-treestudyplan .s-studyplan-card-progressbar .s-studyplan-card-progress-incomplete {
background-color: var(--light);
}
.path-local-treestudyplan .s-studyplan-card-progresstext,
.features-treestudyplan .s-studyplan-card-progresstext {
font-size: 80%;
color: var(--gray);
}
.path-local-treestudyplan .b-modal-justify-footer-between .modal-footer,
.features-treestudyplan .b-modal-justify-footer-between .modal-footer {
justify-content: space-between;

6
lang/en/local_treestudyplan.php
View File

@ -87,6 +87,9 @@ $string["setting_navigation_heading"] = 'Navigation';
$string["settingdesc_navigation_heading"] = 'Navigation menu configuration';
$string["setting_primary_nav_autofill"] = 'Automatically fill <i>custom menu items</i>';
$string["settingdesc_primary_nav_autofill"] = 'To show the studyplan links in the primary navigation menu (especially in moodle 4.x), lines have to be added to the setting <b>Appearance</b>&nbsp;-&nbsp;<b>Theme&nbsp;settings</b>&nbsp;-&nbsp;<b>Custom&nbsp;menu&nbsp;items</b>.<br>Disable this feature here if you do not want this, e.g. if your theme (up to moodle 3.11) uses flat navigation.';
$string["setting_defaulticon"] = 'Default studyplan image';
$string["settingdesc_defaulticon"] = 'Configure default image to show for a study plans if no specific image is set';
$string["settingspage_csync"] = 'Synchronize linked cohorts and users to courses';
$string["setting_csync_heading"] = 'Automatically create a cohort sync in all courses linked to a study plan for all cohorts linked to a study plan';
@ -103,15 +106,18 @@ $string["setting_csync_remember_manual_csync_field"] = 'Remember existing cohort
$string["settingdesc_csync_remember_manual_csync_field"] = 'Mark cohort syncs that were manually created earlier, so they won\'t be removed during autosync if cohorts are removed from the studyplan';
$string["setting_csync_users_field"] = 'Enroll linked users';
$string["settingdesc_csync_users_field"] = 'Also enrol all users that are explicitly linked to a study plan in that study plan\'s courses.';
$string["autocohortsync_name"] = 'Study plan automatic cohort sync cascading';
$string["refreshteacherlist_name"] = "Refresh teacher's study plan list";
$string["studyplan_add"] = 'Add study plan';
$string["studyplan_edit"] = 'Edit study plan';
$string["studyplan_remove"] = 'Remove study plan';
$string["studyplan_confirm_remove"] = 'Are you sure you want to remove study plan {$a}?';
$string["studyplan_name"] = 'Full name';
$string["studyplan_name_ph"] = '';
$string["studyplan_icon"] = "Image for this studyplan";
$string["studyplan_context"] = 'Category';
$string["studyplan_shortname"] = 'Short name';
$string["studyplan_shortname_ph"] = '';

3
lang/nl/local_treestudyplan.php
View File

@ -82,6 +82,8 @@ $string["setting_navigation_heading"] = 'Navigatie';
$string["settingdesc_navigation_heading"] = 'Instellingen voor navigatie';
$string["setting_primary_nav_autofill"] = '<i>Aangepast menu items</i> automatisch aanvullen';
$string["settingdesc_primary_nav_autofill"] = 'Om in het primaire navigatiemenu de studieplan links te tonen (vooral in Moodle 4.x), moeten regels worden toegevoegd in <b>Uiterlijk</b>&nbsp;-&nbsp;<b>Thema&nbsp;instellingen</b>&nbsp;<b>Aangepast&nbsp;menu&nbsp;items</b><br>Zet deze functie hier uit als dat niet gewenst is, b.v. als je Moodle (3.11 of lager) thema flat navigation gebruikt.';
$string["setting_defaulticon"] = 'Standaard afbeelding foor studieplan';
$string["settingdesc_defaulticon"] = 'Stel standaard afbeelding in om weer te geven als een studieplan geen eigen afbeelding heeft ingesteld';
$string["setting_display_heading"] = 'Weergave';
$string["settingdesc_display_heading"] = 'Configuratie voor de weergave van de studieplannen';
@ -112,6 +114,7 @@ $string["studyplan_remove"] = 'Studieplan verwijderen';
$string["studyplan_confirm_remove"] = 'Weet je zeker dat je studieplan {$a} wilt verwijderen?';
$string["studyplan_name"] = 'Volledige Naam';
$string["studyplan_name_ph"] = '';
$string["studyplan_icon"] = "Afbeelding for this studyplan";
$string["studyplan_context"] = 'Categorie';
$string["studyplan_shortname"] = 'Korte naam';
$string["studyplan_shortname_ph"] = '';

37
scss/studyplan.scss
View File

@ -1011,43 +1011,6 @@
background-color: var(--warning);
}
.card.s-studyplan-card {
min-width: 300px;
max-width: 500px;
margin-bottom: 1em;
}
.card.s-studyplan-card.timing-past .card-header {
background-color: var(--past);
}
.card.s-studyplan-card.timing-present .card-header {
background-color: var(--present);
}
.card.s-studyplan-card.timing-future .card-header {
background-color: var(--future);
}
.s-studyplan-card-title-buttons {
font-size: 16px /*12pt*/;
float: right;
}
.s-studyplan-card-title-buttons > * {
margin-left: 0.2em;
margin-right: 0.3em;
}
.s-studyplan-card-buttons {
float: right;
display: flex;
align-items: center;
justify-content: right;
}
.s-studyplan-card-buttons > * {
margin-left: 1em;
}
.s-studyplan-associate-window .custom-select {
width: 100%;
max-width: 100%;

113
scss/studyplancard.scss Normal file
View File

@ -0,0 +1,113 @@
.path-local-treestudyplan, .features-treestudyplan {
.card.s-studyplan-card {
min-width: 300px;
max-width: 500px;
margin-bottom: 1em;
}
.card.s-studyplan-card.timing-past .card-header {
background-color: var(--past);
}
.card.s-studyplan-card.timing-present .card-header {
background-color: var(--present);
}
.card.s-studyplan-card.timing-future .card-header {
background-color: var(--future);
}
.s-studyplan-card-title-buttons {
font-size: 16px /*12pt*/;
float: right;
}
.s-studyplan-card-title-buttons > * {
margin-left: 0.2em;
margin-right: 0.3em;
}
.s-studyplan-card-buttons {
float: right;
display: flex;
align-items: center;
justify-content: right;
}
.s-studyplan-card-buttons > * {
margin-left: 1em;
}
.s-studyplan-card-content {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
gap: 20px;
height: 100%;
}
.s-studyplan-card-icon {
img {
width: 64px;
height: 64px;
}
}
.s-studyplan-card-titlebar {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-between;
gap: 5px;
}
.s-studyplan-card-titlebuttons {
margin-left: auto;
}
.s-studyplan-card-info {
width: 100%;
display: flex;
flex-direction: column;
flex-wrap: nowrap;
> :last-child {
margin-top: auto;
}
}
.s-studyplan-card-progressbar {
width: calc(100% - 2px);
height: 16px;
.s-studyplan-card-progress-segment {
display: inline-block;
height: 10px;
border-top: solid;
border-bottom: solid;
border-color: var(--info);
border-width: 1px;
&:first-child {
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
border-left: 1px solid var(--info);
}
&:last-child {
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
border-right: 1px solid var(--info);
}
}
.s-studyplan-card-progress-completed {
background-color: var(--info);
}
.s-studyplan-card-progress-incomplete {
background-color: var(--light);
}
}
.s-studyplan-card-progresstext {
font-size: 80%;
color: var(--gray);
}
}

1
scss/styles.scss
View File

@ -2,4 +2,5 @@
@import "generic.scss";
@import "invitemanager.scss";
@import "studyplan.scss";
@import "studyplancard.scss";
@import "bootstraptweaking.scss";

2
settings.php
View File

@ -57,7 +57,7 @@ if ($hassiteconfig) {
// Default image for study plans
$page->add(new admin_setting_configstoredfile('local_treestudyplan/defaulticon',
get_string('setting_defaulticon', 'local_treestudyplan'),
get_string('setting_defaulticon_desc', 'local_treestudyplan'),
get_string('settingdesc_defaulticon', 'local_treestudyplan'),
'defaulticon', 0,
[
'maxfiles' => 1,

154
styles.css
View File

@ -1178,45 +1178,6 @@
.features-treestudyplan .r-completion-bar-ungraded {
background-color: var(--warning);
}
.path-local-treestudyplan .card.s-studyplan-card,
.features-treestudyplan .card.s-studyplan-card {
min-width: 300px;
max-width: 500px;
margin-bottom: 1em;
}
.path-local-treestudyplan .card.s-studyplan-card.timing-past .card-header,
.features-treestudyplan .card.s-studyplan-card.timing-past .card-header {
background-color: var(--past);
}
.path-local-treestudyplan .card.s-studyplan-card.timing-present .card-header,
.features-treestudyplan .card.s-studyplan-card.timing-present .card-header {
background-color: var(--present);
}
.path-local-treestudyplan .card.s-studyplan-card.timing-future .card-header,
.features-treestudyplan .card.s-studyplan-card.timing-future .card-header {
background-color: var(--future);
}
.path-local-treestudyplan .s-studyplan-card-title-buttons,
.features-treestudyplan .s-studyplan-card-title-buttons {
font-size: 16px;
float: right;
}
.path-local-treestudyplan .s-studyplan-card-title-buttons > *,
.features-treestudyplan .s-studyplan-card-title-buttons > * {
margin-left: 0.2em;
margin-right: 0.3em;
}
.path-local-treestudyplan .s-studyplan-card-buttons,
.features-treestudyplan .s-studyplan-card-buttons {
float: right;
display: flex;
align-items: center;
justify-content: right;
}
.path-local-treestudyplan .s-studyplan-card-buttons > *,
.features-treestudyplan .s-studyplan-card-buttons > * {
margin-left: 1em;
}
.path-local-treestudyplan .s-studyplan-associate-window .custom-select,
.features-treestudyplan .s-studyplan-associate-window .custom-select {
width: 100%;
@ -1334,6 +1295,121 @@
border-color: #aaa;
}
.path-local-treestudyplan .card.s-studyplan-card,
.features-treestudyplan .card.s-studyplan-card {
min-width: 300px;
max-width: 500px;
margin-bottom: 1em;
}
.path-local-treestudyplan .card.s-studyplan-card.timing-past .card-header,
.features-treestudyplan .card.s-studyplan-card.timing-past .card-header {
background-color: var(--past);
}
.path-local-treestudyplan .card.s-studyplan-card.timing-present .card-header,
.features-treestudyplan .card.s-studyplan-card.timing-present .card-header {
background-color: var(--present);
}
.path-local-treestudyplan .card.s-studyplan-card.timing-future .card-header,
.features-treestudyplan .card.s-studyplan-card.timing-future .card-header {
background-color: var(--future);
}
.path-local-treestudyplan .s-studyplan-card-title-buttons,
.features-treestudyplan .s-studyplan-card-title-buttons {
font-size: 16px;
float: right;
}
.path-local-treestudyplan .s-studyplan-card-title-buttons > *,
.features-treestudyplan .s-studyplan-card-title-buttons > * {
margin-left: 0.2em;
margin-right: 0.3em;
}
.path-local-treestudyplan .s-studyplan-card-buttons,
.features-treestudyplan .s-studyplan-card-buttons {
float: right;
display: flex;
align-items: center;
justify-content: right;
}
.path-local-treestudyplan .s-studyplan-card-buttons > *,
.features-treestudyplan .s-studyplan-card-buttons > * {
margin-left: 1em;
}
.path-local-treestudyplan .s-studyplan-card-content,
.features-treestudyplan .s-studyplan-card-content {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
gap: 20px;
height: 100%;
}
.path-local-treestudyplan .s-studyplan-card-icon img,
.features-treestudyplan .s-studyplan-card-icon img {
width: 64px;
height: 64px;
}
.path-local-treestudyplan .s-studyplan-card-titlebar,
.features-treestudyplan .s-studyplan-card-titlebar {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-between;
gap: 5px;
}
.path-local-treestudyplan .s-studyplan-card-titlebuttons,
.features-treestudyplan .s-studyplan-card-titlebuttons {
margin-left: auto;
}
.path-local-treestudyplan .s-studyplan-card-info,
.features-treestudyplan .s-studyplan-card-info {
width: 100%;
display: flex;
flex-direction: column;
flex-wrap: nowrap;
}
.path-local-treestudyplan .s-studyplan-card-info > :last-child,
.features-treestudyplan .s-studyplan-card-info > :last-child {
margin-top: auto;
}
.path-local-treestudyplan .s-studyplan-card-progressbar,
.features-treestudyplan .s-studyplan-card-progressbar {
width: calc(100% - 2px);
height: 16px;
}
.path-local-treestudyplan .s-studyplan-card-progressbar .s-studyplan-card-progress-segment,
.features-treestudyplan .s-studyplan-card-progressbar .s-studyplan-card-progress-segment {
display: inline-block;
height: 10px;
border-top: solid;
border-bottom: solid;
border-color: var(--info);
border-width: 1px;
}
.path-local-treestudyplan .s-studyplan-card-progressbar .s-studyplan-card-progress-segment:first-child,
.features-treestudyplan .s-studyplan-card-progressbar .s-studyplan-card-progress-segment:first-child {
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
border-left: 1px solid var(--info);
}
.path-local-treestudyplan .s-studyplan-card-progressbar .s-studyplan-card-progress-segment:last-child,
.features-treestudyplan .s-studyplan-card-progressbar .s-studyplan-card-progress-segment:last-child {
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
border-right: 1px solid var(--info);
}
.path-local-treestudyplan .s-studyplan-card-progressbar .s-studyplan-card-progress-completed,
.features-treestudyplan .s-studyplan-card-progressbar .s-studyplan-card-progress-completed {
background-color: var(--info);
}
.path-local-treestudyplan .s-studyplan-card-progressbar .s-studyplan-card-progress-incomplete,
.features-treestudyplan .s-studyplan-card-progressbar .s-studyplan-card-progress-incomplete {
background-color: var(--light);
}
.path-local-treestudyplan .s-studyplan-card-progresstext,
.features-treestudyplan .s-studyplan-card-progresstext {
font-size: 80%;
color: var(--gray);
}
.path-local-treestudyplan .b-modal-justify-footer-between .modal-footer,
.features-treestudyplan .b-modal-justify-footer-between .modal-footer {
justify-content: space-between;