From 82033a749562b945a8b4534b852d78cf5c876558 Mon Sep 17 00:00:00 2001 From: bot50 Date: Thu, 18 Jun 2020 12:11:52 +0000 Subject: [PATCH] Priyatham-sai-chand-web50/projects/2020/x/0@20200618T121152.043938768Z --- README.md | 31 ++++++++++++++++++++ experiences.html | 76 ++++++++++++++++++++++++++++++++++++++++++++++++ hobbies.css | 50 +++++++++++++++++++++++++++++++ hobbies.html | 61 ++++++++++++++++++++++++++++++++++++++ interests.css | 33 +++++++++++++++++++++ interests.html | 53 +++++++++++++++++++++++++++++++++ main.css | 41 ++++++++++++++++++++++++++ main.html | 31 ++++++++++++++++++++ main.scss | 60 ++++++++++++++++++++++++++++++++++++++ philosophy.html | 67 ++++++++++++++++++++++++++++++++++++++++++ 10 files changed, 503 insertions(+) create mode 100755 README.md create mode 100755 experiences.html create mode 100755 hobbies.css create mode 100755 hobbies.html create mode 100755 interests.css create mode 100755 interests.html create mode 100755 main.css create mode 100755 main.html create mode 100755 main.scss create mode 100755 philosophy.html diff --git a/README.md b/README.md new file mode 100755 index 0000000..3a9811d --- /dev/null +++ b/README.md @@ -0,0 +1,31 @@ +# Project 0 + +Web Programming with Python and JavaScript + +It is a project consisting of 5 pages with main being the homepage along with interests,hobbies,experiences,philosphy. + +The Requirements of the projects are met accordingly: + +Number of pages - 5 + +Every website has bootstrap buttons to navigate to all other pages excluding the mainpage which has hyperlinks. + +There is an unordered list in interests, a table in hobbies and an image called "about me" in the main. + +There are 3 seperate stylesheets for main,hobbies and interests. + +The styelsheets have various properties like text-align,font-family,font-size,background-color,margin-top to name a few. + +There are many classes that are used with "." .texts. +There are few ids that are used with "#" #me_image. +Some of the CSS selectors used are " " , " > ",":","::","," to name a few. + +Hobbies stylesheet uses a @media query to look for max-width if it is shrinked a messsage is displayed saying the same. + +Bootstrap 4 is used in experiences and philosophy pages where two columns variations are used in each of them i.e "col-3" and "col-6 col-md-4" as the grid model. +Bootstrap Component is used in interests,experiences,hobbies,philosophy as buttons that link all other pages. + +main has a scss file that is compiled to give main.css +it contains variables like $first_color and so on. +#me_image is nested inside .texts +all the other pages links in main has inhertiance from %links. diff --git a/experiences.html b/experiences.html new file mode 100755 index 0000000..75b5a1e --- /dev/null +++ b/experiences.html @@ -0,0 +1,76 @@ + + + My Experiences + + + + + + +

My Experiences

+ +
+
+ My experiences with various countries and continents have not been the most. So, exposure to various landscapes is little. +
+
+ The Internet has been the my go-to to understand everything that i miss and learn new things that are strange and unheard of. +
+
+ I compensate to the inexperience of travelling by watching documentries to learn more about various countries and the diverse species of flora and fauna. +
+
+ I appreciate fine art and the craftsmenship of ordinary things which can be enhanced by + quality of material and skill. + +
+ +
+ +
+ + HomePage + + Interests + + Hobbies + + Philosophy + + + + + + + + +
+ + + + + \ No newline at end of file diff --git a/hobbies.css b/hobbies.css new file mode 100755 index 0000000..e4b9e80 --- /dev/null +++ b/hobbies.css @@ -0,0 +1,50 @@ +body > p{ + + font-family: sans-serif; + font-size: 50px; + margin-top: 100px; + font-weight: bold; + text-align: center; + +} + +@media (max-width: 500px){ + + h6::before{ + color: chocolate; + content: "page shrinked !!" + + } +} +table { + border: 3px solid black; + font-size: 30px; + font-family: monospace; +} + +table.center { + margin-left: auto; + margin-right: auto; + border: 1px solid black; +} + +th, td { + border: 1px solid black; +} + +th { + background-color: grey; +} +td:hover{ + + background-color: yellow; + +} + +#buttons{ + + margin-top: 100px; + text-align: center; + + +} \ No newline at end of file diff --git a/hobbies.html b/hobbies.html new file mode 100755 index 0000000..9a9c4fb --- /dev/null +++ b/hobbies.html @@ -0,0 +1,61 @@ + + + + My hobbies + + + + + +
+ + +

Hobbies

+ + + + + + + + + + + + + + + + + + + + + + + +
HobbyKnow more
Non-fictional readingClick here
origamiClick here
watching documentariesClick here
WellnessClick here
+ +
+ + HomePage + + Interests + + Philosophy + + Experiences + + + + + +
+ + + + + + + + \ No newline at end of file diff --git a/interests.css b/interests.css new file mode 100755 index 0000000..803aa80 --- /dev/null +++ b/interests.css @@ -0,0 +1,33 @@ +body{ + + background-color: lightgoldenrodyellow; + + + + + } +body p{ + text-align: center; + margin-top: 100px; + color: black; + font-weight: bold; + font-family: arial; + font-size: 50px; +} +body > ul{ + text-align: center; + margin-top: 90px; + color: navy; + font-weight: bold; + font-family: arial; + font-size: 30px; + +} + +#buttons{ + + margin-top: 50px; + text-align: center; + + +} \ No newline at end of file diff --git a/interests.html b/interests.html new file mode 100755 index 0000000..1125f7e --- /dev/null +++ b/interests.html @@ -0,0 +1,53 @@ + + + + Interests page + + + + + + + + +

+ My Interests include: + +

+ + + + +
+ + HomePage + + Hobbies + + Philosophy + + Experiences + + + + + +
+ + + + + + + + + + + + diff --git a/main.css b/main.css new file mode 100755 index 0000000..bec2a60 --- /dev/null +++ b/main.css @@ -0,0 +1,41 @@ +.texts { + font-family: sans-serif; + font-size: 30px; + text-align: center; + color: grey; +} +.texts #me_image { + text-align: center; + width: 700px; + height: 250px; +} + +.philosophy, .experiences, .hobbies, .interests { + font-family: sans-serif; + font-size: 18px; + font-weight: bold; + border: 1px solid black; + padding: 20px; + margin: 20px; + text-align: center; +} + +.interests { + margin: 20px; + background-color: #F2F3AE; +} + +.hobbies { + margin: 20px; + background-color: #EDD382; +} + +.experiences { + margin: 20px; + background-color: #FC9E4F; +} + +.philosophy { + margin: 20px; + background-color: #F4442E; +} \ No newline at end of file diff --git a/main.html b/main.html new file mode 100755 index 0000000..3d54e5c --- /dev/null +++ b/main.html @@ -0,0 +1,31 @@ + + + + The main page. + + + + + + +
+

A page about me

+ + + +
+ +
Interests
+ +
Hobbies
+ +
Experiences
+ +
Philosophy
+ + + + + + + \ No newline at end of file diff --git a/main.scss b/main.scss new file mode 100755 index 0000000..c275767 --- /dev/null +++ b/main.scss @@ -0,0 +1,60 @@ +$first_color: #F2F3AE; +$second_color: #EDD382; +$third_color: #FC9E4F; +$fourth_color: #F4442E; +.texts{ + + font-family: sans-serif; + font-size: 30px; + text-align: center; + color: grey; + + #me_image{ + + text-align: center; + width: 700px; + height: 250px; + } +} +%links{ + + font-family: sans-serif; + font-size:18px; + font-weight: bold; + border: 1px solid black; + padding:20px; + margin: 20px; + text-align: center; +} + +.interests{ + + @extend %links; + margin : 20px; + background-color: $first_color; +} + +.hobbies{ + + @extend %links; + margin: 20px; + background-color: $second_color; + + +} + +.experiences{ + + @extend %links; + margin:20px; + background-color: $third_color; + + +} +.philosophy{ + + @extend %links; + margin:20px; + background-color: $fourth_color; + +} \ No newline at end of file diff --git a/philosophy.html b/philosophy.html new file mode 100755 index 0000000..f1b7230 --- /dev/null +++ b/philosophy.html @@ -0,0 +1,67 @@ + + + My Philosophy + + + + + + +

My Philosophy

+ +
+
+ + I believe in the orderly nature of things and the dominance of human beings as the intelligent species who needs to keep pushing boundaries to go furuther and reach new places. +
+
+ The Will to go forward and achieve things gets me going everyday to work and reach new goals.This way of being motivated to want more and more of knowledge and venture into new territories that are waiting to be conquered wakes me up in the morning. + +
+
+ Hardwork is always worth it. I tend to move deeper and work harder as obstacles come to move to show my willingness to be a master at my trade and keep pushing boundaries to make them seem simpler once I look back at them and realise I couldn't have done it all if I quit. + +
+
+
+ + HomePage + + Interests + + Hobbies + + Experiences + + + + + +
+ + + + \ No newline at end of file