You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: .readme/README.md
+3-3Lines changed: 3 additions & 3 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -29,16 +29,16 @@ Brim solves all of the issues associated with determining the state of the UI an
29
29
30
30
## Setup
31
31
32
-
When page is loaded, Brim will create a **treadmill** element. Treadmill element is used to give user space to scroll. Presence of the treadmill element ensures that user can enter the viewport and viewport continues to persist if user reloads the page or changes device orientation. It is invisible to the user the entire time. This element has ID `brim-treadmill`.
33
-
34
32
You need to create two elements: mask and main. **Mask** is displayed to the user when page is in the full view. The role of the element is to instruct user to enter the minimal-ui. **Main** element is shown when mask is hidden.
35
33
36
-
*You have to have these elements as direct descendants of `<body>`.
34
+
*These elements must be direct and sole descendants of `<body>`.
37
35
* The IDs must be `brim-mask` and `brim-main`.
38
36
* Do not apply [styling](#styling) that would affect the position or the dimensions of these elements.
39
37
40
38
## The Underlying Implementation
41
39
40
+
When page is loaded, Brim will create a **treadmill** element. Treadmill element is used to give user space to scroll. Presence of the treadmill element ensures that user can enter the viewport and viewport continues to persist if user reloads the page or changes device orientation. It is invisible to the user the entire time. This element has ID `brim-treadmill`.
41
+
42
42
Upon loading the page or after changing the orientation, Brim is using [Scream](https://github.com/gajus/scream) (developed as part of this project) to detect if page is in the minimal-ui view (page that has been previously in minimal-ui and has been reloaded will remain in the minimal-ui if content height is greater than the viewport height).
43
43
44
44
For documentation purposes it is worth noting that you cannot use Scream to detect if device is in minimal-ui straight after the [orientationchange](https://developer.mozilla.org/en-US/docs/Web/Events/orientationchange) event because `window` dimensions do not reflect the new orientation until the rotation animation has ended. You have to attach a listener to the [orientationchangeend](https://github.com/gajus/orientationchangeend) (developed as part of this project) event.
Copy file name to clipboardExpand all lines: README.md
+3-3Lines changed: 3 additions & 3 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -42,16 +42,16 @@ Brim solves all of the issues associated with determining the state of the UI an
42
42
43
43
## Setup
44
44
45
-
When page is loaded, Brim will create a **treadmill** element. Treadmill element is used to give user space to scroll. Presence of the treadmill element ensures that user can enter the viewport and viewport continues to persist if user reloads the page or changes device orientation. It is invisible to the user the entire time. This element has ID `brim-treadmill`.
46
-
47
45
You need to create two elements: mask and main. **Mask** is displayed to the user when page is in the full view. The role of the element is to instruct user to enter the minimal-ui. **Main** element is shown when mask is hidden.
48
46
49
-
*You have to have these elements as direct descendants of `<body>`.
47
+
*These elements must be direct and sole descendants of `<body>`.
50
48
* The IDs must be `brim-mask` and `brim-main`.
51
49
* Do not apply [styling](#styling) that would affect the position or the dimensions of these elements.
52
50
53
51
## The Underlying Implementation
54
52
53
+
When page is loaded, Brim will create a **treadmill** element. Treadmill element is used to give user space to scroll. Presence of the treadmill element ensures that user can enter the viewport and viewport continues to persist if user reloads the page or changes device orientation. It is invisible to the user the entire time. This element has ID `brim-treadmill`.
54
+
55
55
Upon loading the page or after changing the orientation, Brim is using [Scream](https://github.com/gajus/scream) (developed as part of this project) to detect if page is in the minimal-ui view (page that has been previously in minimal-ui and has been reloaded will remain in the minimal-ui if content height is greater than the viewport height).
56
56
57
57
For documentation purposes it is worth noting that you cannot use Scream to detect if device is in minimal-ui straight after the [orientationchange](https://developer.mozilla.org/en-US/docs/Web/Events/orientationchange) event because `window` dimensions do not reflect the new orientation until the rotation animation has ended. You have to attach a listener to the [orientationchangeend](https://github.com/gajus/orientationchangeend) (developed as part of this project) event.
0 commit comments