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