Jiyeon Jung

            body .grid 
                header .c12
                    div .hero
                    main .c12 content
                            div .hvr-float exp exp-ramp
                                div .exp-content
                            div .hvr-float exp exp-ig
                                div .exp-content
                        a "patch"
                            div .hvr-float exp exp-patch
                                div .exp-content
                        a "github"
                            div .hvr-float exp exp-github
                                div .exp-content
                        a "starbucks"
                            div .hvr-float exp exp-starbucks
                                div .exp-content
                        a "ideo"
                            div .hvr-float exp exp-ideo
                                div .exp-content
                    footer .c12 grid
                    div #speechify-global-notifications
                    div #speechify-summarization-fullscreen-mode
                    div #speechify-screenshot-mode


          

Zain Kho Portfolio

The class name "grid" for the body tag indicates that the website is contructed with grid components. This can be confirmed by inspecting the page and checking there is a display:grid property for .grid.

.c12 content seems to contain all the blocks of content as it surrounds the a tags that leads to the project page.

The footer tag with class name .c12 grid also indicates that the website uses the gird to stucture the website. When I checked the css property, I was able to confirm the use of gird.

The header tag includes the introduction and navigation that is written at the top of the page, which is "Hello, I'm Zain. Creating joy @Cornell, @Ramp."

It is interesting that there are some code that I do not recognize the use of, such as div #speechify-global-notifications, div #speechify-summarization-fullscreen-mode, div #speechify-screenshot-mode.