forked from iam-veeramalla/Docker-Zero-to-Hero
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
01f363c
commit ca4d163
Showing
1 changed file
with
101 additions
and
0 deletions.
There are no files selected for viewing
101 changes: 101 additions & 0 deletions
101
examples/python-web-app/devops/demo/static/demo_site.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,101 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <head> | ||
| <title>CSS Template</title> | ||
| <meta charset="utf-8"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1"> | ||
| <style> | ||
| * { | ||
| box-sizing: border-box; | ||
| } | ||
|
|
||
| body { | ||
| font-family: Arial, Helvetica, sans-serif; | ||
| } | ||
|
|
||
| /* Style the header */ | ||
| header { | ||
| background-color: #666; | ||
| padding: 30px; | ||
| text-align: center; | ||
| font-size: 35px; | ||
| color: yellow; | ||
| } | ||
|
|
||
| /* Create two columns/boxes that floats next to each other */ | ||
| nav { | ||
| float: left; | ||
| width: 30%; | ||
| height: 300px; /* only for demonstration, should be removed */ | ||
| background: #ccc; | ||
| padding: 20px; | ||
| } | ||
|
|
||
| /* Style the list inside the menu */ | ||
| nav ul { | ||
| list-style-type: none; | ||
| padding: 0; | ||
| } | ||
|
|
||
| article { | ||
| float: left; | ||
| padding: 20px; | ||
| width: 70%; | ||
| background-color: #f1f1f1; | ||
| height: 300px; /* only for demonstration, should be removed */ | ||
| } | ||
|
|
||
| /* Clear floats after the columns */ | ||
| section::after { | ||
| content: ""; | ||
| display: table; | ||
| clear: both; | ||
| } | ||
|
|
||
| /* Style the footer */ | ||
| footer { | ||
| background-color: #777; | ||
| padding: 10px; | ||
| text-align: center; | ||
| color: yellow; | ||
| } | ||
|
|
||
| /* Responsive layout - makes the two columns/boxes stack on top of each other instead of next to each other, on small screens */ | ||
| @media (max-width: 600px) { | ||
| nav, article { | ||
| width: 100%; | ||
| height: auto; | ||
| } | ||
| } | ||
| </style> | ||
| </head> | ||
| <body> | ||
|
|
||
|
|
||
| <header> | ||
| <h2>Free DevOps Course By Abhishek</h2> | ||
| </header> | ||
|
|
||
| <section> | ||
| <nav> | ||
| <ul> | ||
| <li><a href="www.youtube.com/@AbhishekVeeramalla">YouTube</a></li> | ||
| <li><a href="www.linkedin.com/in/abhishek-veeramalla-77b33996/">LinkedIn</a></li> | ||
| <li><a href="https://telegram.me/abhishekveeramalla">Telegram</a></li> | ||
| </ul> | ||
| </nav> | ||
|
|
||
| <article> | ||
| <h1>Agenda</h1> | ||
| <p>Learn DevOps with strong foundational knowledge and practical understanding</p> | ||
| <p>Please Share the Channel with your friends and colleagues</p> | ||
| </article> | ||
| </section> | ||
|
|
||
| <footer> | ||
| <p>@AbhishekVeeramalla</p> | ||
| </footer> | ||
|
|
||
| </body> | ||
| </html> | ||
|
|