|
4 | 4 |
|
5 | 5 | ## Demos
|
6 | 6 |
|
7 |
| -*[Demo 1](http://responsiveimagescg.github.io/ALA-Whitworth-Demo/demo1/index.html)* |
8 |
| - |
| 7 | +**[Demo 1](http://responsiveimagescg.github.io/ALA-Whitworth-Demo/demo1/index.html)**<br> |
9 | 8 | A single breakpoint where the layout changes from linear to a primary content area and a sidebar.
|
10 | 9 |
|
11 |
| -*[Demo 2](http://responsiveimagescg.github.io/ALA-Whitworth-Demo/demo2/index.html)* |
12 |
| - |
| 10 | +**[Demo 2](http://responsiveimagescg.github.io/ALA-Whitworth-Demo/demo2/index.html)**<br> |
13 | 11 | Module styles, using a single breakpoint not scoped to any specific contexts. The “featured” module is broken at meduium viewport widths.
|
14 | 12 |
|
15 |
| -*[Demo 3](http://responsiveimagescg.github.io/ALA-Whitworth-Demo/demo3/index.html)* |
16 |
| - |
| 13 | +**[Demo 3](http://responsiveimagescg.github.io/ALA-Whitworth-Demo/demo3/index.html)**<br> |
17 | 14 | Modules now have a second breakpoint and set of styles scoped to the “featured” container context.
|
18 | 15 |
|
19 |
| -*[Demo 4](http://responsiveimagescg.github.io/ALA-Whitworth-Demo/demo4/index.html)* |
20 |
| - |
| 16 | +**[Demo 4](http://responsiveimagescg.github.io/ALA-Whitworth-Demo/demo4/index.html)**<br> |
21 | 17 | “Add to cart” button and “Only 3 left” text are aligned right regardless of available space.
|
22 | 18 |
|
23 |
| -*[Demo 5](http://responsiveimagescg.github.io/ALA-Whitworth-Demo/demo5/index.html)* |
24 |
| - |
| 19 | +**[Demo 5](http://responsiveimagescg.github.io/ALA-Whitworth-Demo/demo5/index.html)**<br> |
25 | 20 | “Add to cart” button and “Only 3 left” text are aligned right based on modules’ available space, using several media queries and duplicated styles.
|
26 | 21 |
|
27 |
| -*[Demo 6](http://responsiveimagescg.github.io/ALA-Whitworth-Demo/demo6/index.html)* |
28 |
| - |
| 22 | +**[Demo 6](http://responsiveimagescg.github.io/ALA-Whitworth-Demo/demo6/index.html)**<br> |
29 | 23 | Module layouts using a single set of “element query” styles.
|
30 | 24 |
|
31 |
| -*[Demo 7](http://responsiveimagescg.github.io/ALA-Whitworth-Demo/demo7/index.html)* |
| 25 | +**[Demo 7](http://responsiveimagescg.github.io/ALA-Whitworth-Demo/demo7/index.html)** |
32 | 26 |
|
33 | 27 | “Add to cart” button and “Only 3 left” text are aligned right based on available space using a single set of “element query” styles.
|
34 | 28 |
|
|
0 commit comments