To add a collaborator to this project you will need to use the Relish gem to add the collaborator via a terminal command. Soon you'll be able to also add collaborators here!
More about adding a collaboratorResponsive app for multiple screen sizes in Chrome
As a reader on a Chrome browser
I want a responsive page to match my screen size
so that I can have a good reading experience
- Scenarios
-
- - An article loads on multiple desktop browsers at multiple resolutions
- - An article page, viewed on a desktop browser, responds to window resizing
- - An article page, viewed on a desktop browser, when changed from small to medium view, responds appropriately
- - An article page, viewed on a desktop browser, when changed from medium to small view, responds appropriately
- - An article page, viewed on a desktop browser, when changed from medium to large view, responds appropriately
- - An article page, viewed on a desktop browser, when changed from large to medium view, responds appropriately
- - An article page, viewed on a desktop browser, when changed from large to extra large view, responds appropriately
- - An article page, viewed on a desktop browser, when changed from extra large to large view, responds appropriately
- - An article loads on multiple desktop browsers at multiple resolutions
-
- Given
- I am using a typeOfBrowser browser
- When
- I open a browser window of size width by height
- And
- I navigate to an article page
- Then
- the article elements are displayed
- And
- the article elements are rendered within the page boundaries
- And
- The Pearson logo is displayed correctly
Examples: typeOfBrowser width height chrome 500 800 chrome 640 800 chrome 1024 800 chrome 1600 800 - - An article page, viewed on a desktop browser, responds to window resizing
-
- Given
- I am using a typeOfBrowser browser
- When
- I open a browser window of size width by height
- And
- I navigate to an article page
- And
- I change the browser size to width2 by height2
- Then
- the article elements are displayed
- And
- the article elements are rendered within the page boundaries
- And
- The Pearson logo is displayed correctly
Examples: typeOfBrowser width height width2 height2 chrome 599 800 600 800 chrome 600 599 599 800 chrome 899 900 900 800 chrome 900 899 899 800 chrome 1399 1400 1400 800 chrome 1400 1399 1399 800 - - An article page, viewed on a desktop browser, when changed from small to medium view, responds appropriately
-
- Given
- I am using a typeOfBrowser browser
- When
- I make the browser a small size
- And
- I navigate to an article page
- Then
- The footer links are in 2 columns
- And
- the article elements are displayed
- And
- the article elements are rendered within the page boundaries
- And
- The Pearson logo is displayed correctly
- And
- the footer is spaced 10 pixels from the story list
- And
- I make the browser a medium size
- Then
- The footer links are in 2 columns
- And
- the article elements are displayed
- And
- the article elements are rendered within the page boundaries
- And
- The Pearson logo is displayed correctly
Examples: typeOfBrowser chrome - - An article page, viewed on a desktop browser, when changed from medium to small view, responds appropriately
-
- Given
- I am using a typeOfBrowser browser
- When
- I make the browser a medium size
- And
- I navigate to an article page
- Then
- The footer links are in 2 columns
- And
- the article elements are displayed
- And
- the article elements are rendered within the page boundaries
- And
- The Pearson logo is displayed correctly
- And
- I make the browser a small size
- Then
- The footer links are in 2 columns
- And
- the article elements are displayed
- And
- the article elements are rendered within the page boundaries
- And
- The Pearson logo is displayed correctly
- And
- the footer is spaced 10 pixels from the story list
Examples: typeOfBrowser chrome - - An article page, viewed on a desktop browser, when changed from medium to large view, responds appropriately
-
- Given
- I am using a typeOfBrowser browser
- When
- I make the browser a medium size
- And
- I navigate to an article page
- Then
- The footer links are in 2 columns
- And
- the article elements are displayed
- And
- the article elements are rendered within the page boundaries
- And
- The Pearson logo is displayed correctly
- And
- I make the browser a large size
- Then
- The footer links are in a single row
- And
- the article elements are displayed
- And
- the article elements are rendered within the page boundaries
- And
- The Pearson logo is displayed correctly
Examples: typeOfBrowser chrome - - An article page, viewed on a desktop browser, when changed from large to medium view, responds appropriately
-
- Given
- I am using a typeOfBrowser browser
- When
- I make the browser a large size
- And
- I navigate to an article page
- Then
- The footer links are in a single row
- And
- the article elements are rendered within the page boundaries
- And
- The Pearson logo is displayed correctly
- And
- I make the browser a medium size
- Then
- The footer links are in 2 columns
- And
- the article elements are displayed
- And
- the article elements are rendered within the page boundaries
- And
- The Pearson logo is displayed correctly
Examples: typeOfBrowser chrome - - An article page, viewed on a desktop browser, when changed from large to extra large view, responds appropriately
-
- Given
- I am using a typeOfBrowser browser
- When
- I make the browser a large size
- And
- I navigate to an article page
- Then
- The footer links are in a single row
- And
- the article elements are displayed
- And
- the article elements are rendered within the page boundaries
- And
- The Pearson logo is displayed correctly
- And
- I make the browser an extra large size
- Then
- The footer links are in a single row
- And
- the article elements are displayed
- And
- the article elements are rendered within the page boundaries
- And
- The Pearson logo is displayed correctly
Examples: typeOfBrowser chrome - - An article page, viewed on a desktop browser, when changed from extra large to large view, responds appropriately
-
- Given
- I am using a typeOfBrowser browser
- When
- I make the browser an extra large size
- And
- I navigate to an article page
- Then
- The footer links are in a single row
- And
- the article elements are displayed
- And
- the article elements are rendered within the page boundaries
- And
- The Pearson logo is displayed correctly
- And
- I make the browser a large size
- Then
- The footer links are in a single row
- And
- the article elements are displayed
- And
- the article elements are rendered within the page boundaries
- And
- The Pearson logo is displayed correctly
Examples: typeOfBrowser chrome
Last published over 5 years ago by HarrySpriggs.