reformat overview by adding html and css file, updated app.py file and added utils folder for color schema
9acc5c1
| * { | |
| box-sizing: border-box; | |
| } | |
| body { | |
| font-family: 'Source Sans Pro', sans-serif; | |
| font-size: 16px; | |
| } | |
| .container { | |
| width: 80%; | |
| margin: 0 auto; | |
| } | |
| .title { | |
| font-size: 40px ; | |
| font-weight: 600 ; | |
| line-height: 50px ; | |
| letter-spacing: 0em; | |
| text-align: center; | |
| color: #374159 ; | |
| } | |
| .subtitle { | |
| font-size: 2em ; | |
| font-style: italic; | |
| font-weight: 400 ; | |
| line-height: 40px ; | |
| letter-spacing: 0em; | |
| text-align: center; | |
| color: #1d652a ; | |
| } | |
| .overview-heading { | |
| font-size: 2em ; | |
| font-weight: 600 ; | |
| line-height: 40px ; | |
| letter-spacing: 0em; | |
| text-align: left; | |
| } | |
| .overview-content { | |
| font-size: 22px ; | |
| font-weight: 400 ; | |
| line-height: 33px ; | |
| letter-spacing: 0em; | |
| text-align: left; | |
| } | |
| .content-image { | |
| width: 100% ; | |
| height: auto ; | |
| } | |
| .vl { | |
| border-left: 5px solid #1d652a; | |
| padding-left: 20px; | |
| color: #1d652a ; | |
| } | |
| .grid-container { | |
| display: grid; | |
| grid-template-columns: 1fr 2fr; | |
| gap: 20px; | |
| } | |
| @media screen and (max-width: 768px) { | |
| .grid-container { | |
| display: block; | |
| } | |
| } |