Long description

Browser Window 1 titled Chapter 7 has an address bar that reads, 127 dot 0 dot 0 1 colon 5500 forward slash home dot h t m l. The window has a web page with a specific grid layout that displays data. There is title bar on top of the web page that spreads from left to right. The data below the title bar is shown in two columns. Column 1 shows a menu bar with a list of 6 options from top to bottom. The column spans to the bottom of web page. Column 2 shows contents arranged in 3 rows. Row 1 shows 6 textboxes with text aligned to the center. Row 2 shows 3 blocks. Block 1 shows a Circular chart. Block 2 shows 4 graphs arranged in a 2 cross 2 matrix format. Block 3 shows a Circular chart. Row 3 shows 2 blocks of data. Block 1 shows a Horizontal histogram. Block 2 shows a Plotted graph. Row 4 shows a rectangular tab with the copyright info that spans from left to right of the browser window.

The compilation of the sass files related to the browser is shown at the right of the Browser Window. Two files labeled home dot s c s s and components dot s c s s are shown at the top. The two files combine to become home dot s c s s, which is then converted to home dot c s s file.

The Web Page with the grid layout for browser window 1 is shown below browser window 1. The web page shows the properties of the grid layout marked on it as follows.

Column 1 width is labeled 100 p x.

Column 2 is labeled Auto.

The title bar is labeled span 2. There is a line of text across the row that reads, dot container colon 2 columns cross 2 rows.

The textboxes in row 1 is has a width of 150 p x. There is a line of text across the row that reads, main colon 6 columns cross 4 rows.

Block 1 in row 2 that shows a circular chart is labeled span 2. There is a line of text that reads, dot matrix colon 2 columns cross 2 rows.

Block 2 in row 3 that shows a plotted graph is labeled span 4.

Row 4 that shows a rectangular tab with the copyright info is labeled span 6.

Browser Windows 2 titled Chapter 7 has an address bar that reads, 127 dot 0 dot 0 1 colon 5500 forward slash portfolio dot h t m l. The window has a web page with a specific grid layout that displays data. There is a title bar on top of the web page from left to right. The data below the title bar is shown in two columns.

Column 1 shows a menu bar with a list of 6 options from top to bottom. The column spans to the bottom of the web page. Column 2 shows data arranged in 2 rows. Row 1 has 2 blocks of data. Block 1 shows a table with multiple entries containing text, number, and buttons to the right. Block 2 shows 2 rows of elements showing a Circular graph at the top and a Histogram data at the bottom. Row 2 of column 2 shows a rectangular tab with the copyright info that spans from left to right of the browser window.

The compilation of the sass files related to the browser is shown at the right of the Browser Window. Two files labeled base dot s c s s and components dot s c s s are shown at the top. The two files combine to become portfolio dot s c s s, which is then converted to portfolio dot c s s file.