Proyectos de Subversion Moodle

Rev

Rev 1 | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
1441 ariadna 1
=== 4.5 Onwards ===
2
 
3
This file has been replaced by UPGRADING.md. See MDL-81125 for further information.
4
 
5
===
1 efrain 6
This file describes API changes in /theme/boost
7
information provided here is intended especially for theme designers.
8
 
9
=== 4.4 ===
10
* Bootstrap badge color helper clases (badge-[primary|secondary|...]) are no longer used, use bg-[primary|secondary|...] instead.
11
* Bootstrap badge-pill is no longer used, use rounded-pill instead.
12
* The bootstrap ´.media´ helper class has been replaced with utility classes (´d-flex´, ´flex-shrink-´, ´flex-grow-´, ...)
13
* The following bootstrap mixins that will be deprecated in BS5 have been replaced with their CSS code:
14
  - hover, hover-focus, plain-hover-focus and hover-focus-active
15
  - float-left, float-right and float-none
16
  - nav-divider
17
  - img-retina
18
  - text-hide
19
  - invisible
20
  - form-control-focus
21
  - text-emphasis-variant
22
  - size
23
  - make-container-max-widths
24
  - g-variant and bg-gradient-variant
25
* Bootstrap `.form-group` helper class is no longer used, use margin utilities instead (´mb-3´, ...).
26
* Bootstrap `.form-inline` helper class is no longer used, use display utilities instead (`.d-flex.flex-wrap.align-items-center`).
27
* The `.dashboard-card` class has been removed in favour of `.course-card` and `theme-card`.
28
* Bootstrap `.card-deck` helper class is no longer used, use grid utility classes (row, row-cols, ...) instead.
29
 
30
=== 4.3 ===
31
* The $activity-iconcontainer-height and $activity-iconcontainer-width variables have been changed from 50px to 52px.
32
* New SCSS mixin optional_animate to animate an element unless if the user has reduced motion in their preferences.
33
 
34
=== 4.0 ===
35
* Following the adopted standards, breadcrumbs have been removed for pages that reside on the 1st level within a course
36
  e.g. participants, grades, settings, reports.
37
* Any custom complex node structures added to the nav tree will now be displayed as a flattened structure within the corresponding
38
  secondary navigation. It is dependent on what the first url for the construct.
39
  Refer to secondary_test.php:test_add_external_nodes_to_secondary for examples.
40
* New function addblockbutton in the renderer, which generates the new 'Add a block' button.
41
  Call this and output it into your templates.
42
* In order to view additional custom nodes, leverage the 'get_overflow_menu_data' which returns url_select if there are nodes available.
43
* In order for existing themes to leverage the changes in the Boost theme, it is recommended to follow the guidelines in the 4.0 docs
44
  https://moodledev.io/docs/4.1/devupdate
45
 
46
=== 3.7 ===
47
 
48
* Templates and renderers moved to core.
49
 
50
* Behat override steps moved to core.
51
 
52
Form element template
53
---------------------
54
A 'wrapperid' has been added to 'templates/core_form/element-template.mustache' to restore unique ids
55
on Boost form element wrappers. This restores the same unique element ids seen on elements in BS2
56
themes, which were mistakenly dropped when introducing the Boost theme.
57
 
58
=== 3.5 ===
59
 
60
The Boost theme now uses Bootstrap 4 Stable (BS4S).
61
 
62
We are trying to use as much BS4S classes in MDL Templates to reduce the amount of Moodle CSS.
63
 
64
The biggest changes are:
65
 
66
JavaScript
67
----------
68
* All Bootstrap javascript has been updated.
69
 
70
Sass
71
----
72
* A number of variables are no longer available in Bootstrap 4 Stable. For now a bs4alpha compatibility file has been added, see scss/bs4alphacompat.scss which translates veriable names from the Alpha version to the stable version.
73
 
74
* m-t-* and other spacing utilities should be replaced with mt-*.
75
 
76
The units that were used for margins have changed too
77
m-t-1 is now mt-3
78
m-t-2 is now mt-4
79
m-t-3 is now mt-5
80
 
81
 
82
Grid and Flexbox
83
----------------
84
The Boostrap grid uses CSS's flexbox grid to build layouts.
85
 
86
New breakpoints for grids have been added:
87
.col-*  <576px
88
.col-sm-* >= 576px
89
.col-md-* >= 768px
90
.col-lg-* >= 992px
91
.col-xl-* >= 1200px
92
 
93
All usage of '*-xs-*' have been dropped. So what used to be col-xs-6 should now be written as col-6.
94
 
95
*-md-* has become *-lg-*, and *-lg-* has become *-xl-*.
96
 
97
Typography
98
----------
99
Boostrap 4 uses a native font stack that selects the best font-family for each OS and device. For font sizing the browser default root font-size (typically 16px) is used. this variable can be changed using the variable '$font-size-base'.
100
In the default Boost preset we use: "0.9375rem" which computes to 15px on most browser.
101
 
102
Presets
103
-------
104
The structure of preset files have changed. The new structure of a preset file is:
105
 
106
// Space to set variables.
107
$font-size-base: 0.9375rem
108
 
109
// Import FontAwesome.
110
@import "fontawesome";
111
 
112
// Import All of Bootstrap.
113
@import "bootstrap";
114
 
115
// Import Core moodle CSS.
116
@import "moodle";
117
 
118
// Space to use Bootstrap mixins and extends.
119
.navbar {
120
  @include shadow();
121
}
122
 
123
Bootswatches
124
------------
125
Bootstrap 4 bootswatches can be imported using the theme/boost/cli/import-bootswatch.php script. Generated bootswatches can be added in the theme boost settings page.
126
 
127
Changed Components
128
------------------
129
Cards need this structure
130
 class='card'
131
    class='card-body'
132
This used to be 'card-block'
133
 
134
The header.mustache template has been replace by a navbar.mustache template for name consistancy with Bootstrap
135
 
136
A new header.mustache template has been created served from core/core_renderer.php. This should be move to core at some point.
137
 
138
 
139
=== 3.4 ===
140
* For improved accessibility, the footer links for boost have been changed to use $bg-inverse-link-color (defaults to white) and
141
  now have an underline text-decoration. To override the link colour simply set $bg-inverse-link-color in your preset file or
142
  theme scss.
143
* To match the new primary colour we are switching to using the UX pallette, which uses a purple colour for info. To override,
144
  set $brand-info in your preset file or theme scss.