Documentation
Page progress
Description
The Page progress module enables to insert a ready-made Page progress bar indicating the percentage of correct answers given on a current page. It is possible to modify the appearance of each part of the Page progress module individually — its frame, text and progress bar.
Properties
| Property name | Description |
|---|---|
| Works with | List of Limited Check modules connected with Page progress. Each line should consist of separate modules ID |
| Lang attribute | This property allows to define the language for this addon (different than the language of the lesson). |
Supported commands
| Command name | Params | Description |
|---|---|---|
| show | – | Shows the addon |
| hide | – | Hides the addon |
CSS classes
| Class name | Description |
|---|---|
| .ic_pageprogress | indicates the module's look excluding the parameter defining the look of the internal bar, which increases proportionally to the user's progress |
| .ic_progress-shell | indicates the progress of solving the tasks correctly on a current page |
| .ic_pageprogress-bar | indicates the look of the internal bar, which increases proportionally to the user's progress |
| .ic_pageprogress-text | indicates the look of the Page progress text |
Examples
1.1. Page Progress
.ic_pageprogress{
background-color: #0070b0;
border-radius: 4px;
border: 1px solid #ffffff;
box-shadow: 1px 2px 2px #406d93;
padding: 3px;
}
1.2 Page Progress — progress-text
.ic_pageprogress .ic_progress-text{
color: #ffffff;
font-size: 18px;
font-family: Verdana;
text-shadow: 1px 2px 2px #043651;
}
1.3.Page Progress — progress-bar
.ic_pageprogress .ic_progress-bar{
background-color: #3cc5cc;
border-radius: 4px;
}
