-
Notifications
You must be signed in to change notification settings - Fork 91
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Big change always starts with small ideas! Project 3 #58
base: master
Are you sure you want to change the base?
Changes from all commits
5469728
055ca98
64f415d
5fba1c9
6574b2f
c58ce75
a5419fb
25779fa
a41a49b
f1fb1eb
1d5c812
1ca6957
fa2f678
e3d92fd
392f056
a4a156e
f998a05
7b1eba7
45fd77a
04cb49e
8de7d24
27c0aee
05b6569
57f199c
f08d28c
3a079c4
a6f9160
f5baf19
7b30f41
bdb7a7a
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,77 @@ | ||
<!DOCTYPE html> | ||
<html> | ||
|
||
<head> | ||
<meta charset="utf-8" /> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||
<title>This is me!</title> | ||
<link rel="icon" type="image/x-icon" href="/Users/rebeccabrogli/Desktop/Project1/project-p1-first-webpage-master/images/bulb_on.svg"> | ||
<link rel="stylesheet" type="text/css" href="style.css"/> | ||
|
||
<style> | ||
@import url('https://fonts.googleapis.com/css2?family=Lexend+Deca:wght@100;700&family=Raleway:wght@500;700&display=swap'); | ||
</style> | ||
</head> | ||
|
||
<body> | ||
|
||
<header> | ||
<nav> | ||
<a href="./index.html">Home</a> | ||
<a href="./toolbox.html">Toolbox</a> | ||
<a href="./about.html">This is me!</a> | ||
</nav> | ||
|
||
<div class="hamburger"> | ||
<div> </div> | ||
<div> </div> | ||
<div> </div> | ||
</div> | ||
|
||
<img src="/Users/rebeccabrogli/Desktop/Desktop - Rebecca’s MacBook Air/Project1/project-p1-first-webpage-master/images/bulb_on.svg" alt="Big Idea Logo"> | ||
|
||
</header> | ||
|
||
<section class="welcome-comtainer2"> | ||
<div class="titel_about"> | ||
<h1> About me! </h1> | ||
<h2> Rebecca Brogli</h2> | ||
</div> | ||
</section> | ||
|
||
<section class="about"> | ||
<div class="image_about"></div> | ||
|
||
<div class="text_about"> | ||
<p> Analytical and detail-oriented biochemist with experience in asking the right question, understanding complex interrelationships, gathering data sets and turning this data into information, information into insights and then asking an even better question. <p> | ||
<br> Now seeking to advance my career and take on different responsibilities in a new challenging environment. </h4> | ||
|
||
<ul style="list-style-type:disc"> | ||
<li> hit a perfect tennis shot 🎾</li> | ||
<li> reading until I fall asleep 📖</li> | ||
<li> host unforgettable exciting evenings for friends 💥</li> | ||
<li> the tasty meal after a tough hike in the mountains 🏔</li> | ||
</ul> | ||
</div> | ||
|
||
</section> | ||
|
||
<div class="image_bottom_about"> | ||
<h4> Let your ideas and thoughts give you inspiration. All creativity comes from your imagination - you first imagine and then you create <br> Catherine Pulsifer </h4> | ||
<h4> </h4> | ||
</div> | ||
|
||
<footer> | ||
<div class="footer-content"> | ||
<h4>More about me!</h4> | ||
<ul class="socials"> | ||
<li><a href="#"><i class="fa fa-linkedin-square"></i></a></li> | ||
<li><a href="#"><i class="fa fa-linkedin"></i></a></li> | ||
<li><a href="#"><i class="fa fa-envelope"></i></a></li> | ||
</ul> | ||
</div> | ||
|
||
</footer> | ||
|
||
</body> | ||
</html> |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,124 @@ | ||
<!DOCTYPE html> | ||
<html> | ||
|
||
<head> | ||
<meta charset="utf-8" /> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||
<title>This is me!</title> | ||
<link rel="icon" type="image/x-icon" href="/Users/rebeccabrogli/Desktop/Project1/project-p1-first-webpage-master/images/bulb_on.svg"> | ||
<link rel="stylesheet" type="text/css" href="style.css"/> | ||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> | ||
|
||
<style> | ||
@import url('https://fonts.googleapis.com/css2?family=Lexend+Deca:wght@100;700&family=Raleway:wght@500;700&display=swap'); | ||
</style> | ||
</head> | ||
|
||
<body> | ||
|
||
<header> | ||
<nav> | ||
<a href="./index.html">Home</a> | ||
<a href="./toolbox.html">Toolbox</a> | ||
<a href="./about.html">This is me!</a> | ||
</nav> | ||
|
||
<div class="hamburger"> | ||
<div> </div> | ||
<div> </div> | ||
<div> </div> | ||
</div> | ||
|
||
<img src="/Users/rebeccabrogli/Desktop/Desktop - Rebecca’s MacBook Air/Project1/project-p1-first-webpage-master/images/bulb_on.svg" alt="Big Idea Logo"> | ||
|
||
</header> | ||
|
||
<section class="welcome-comtainer2"> | ||
<div class="titel_about"> | ||
<h1> About me! </h1> | ||
<h2> Rebecca Brogli</h2> | ||
</div> | ||
</section> | ||
|
||
<section class="about"> | ||
<div class="image_about"></div> | ||
|
||
<div class="text_about"> | ||
<p> Analytical and detail-oriented biochemist with experience in asking the right question, understanding complex interrelationships, gathering data sets and turning this data into information, information into insights and then asking an even better question. <p> | ||
<br> Now seeking to advance my career and take on different responsibilities in a new challenging environment. </h4> | ||
|
||
<ul style="list-style-type:disc"> | ||
<li> hit a perfect tennis shot 🎾</li> | ||
<li> reading until I fall asleep 📖</li> | ||
<li> host unforgettable exciting evenings for friends 💥</li> | ||
<li> the tasty meal after a tough hike in the mountains 🏔</li> | ||
</ul> | ||
</div> | ||
|
||
</section> | ||
|
||
<section class="Feedback"> | ||
<h4> How did you like the journey through the website?</h4> | ||
<h4> Please leave a Feedback 👍🏽</h4> | ||
|
||
<form action="https://httpbin.org/anything" method="post"> | ||
|
||
<fieldset> | ||
<label> | ||
<span> 😃 / 🤨 / 😟 </span> | ||
<select name="Feedback"> | ||
<option value="idontknow">Please choose</option> | ||
<option value="great">😃</option> | ||
<option value="potential">🤨</option> | ||
<option value="bad">😟</option> | ||
</select> | ||
</label> | ||
|
||
<label> | ||
<span> Name </span> | ||
<input type="text" name="name" required placeholder="Alex Watson"> | ||
</label> | ||
|
||
<label> | ||
<span> E-mail </span> | ||
<input type="email" name="email" placeholder="alex.watson@example.com" required> | ||
</label> | ||
|
||
<label> | ||
<span> Feedback </span> | ||
|
||
<textarea name="feedback" id="feedbacks" cols="40" rows="10" required placeholder="max 200 characters"></textarea> | ||
</label> | ||
|
||
<button type="submit" class="SubmitButton">Submit your Feedback</button> | ||
</fieldset> | ||
|
||
</form> | ||
|
||
</section> | ||
|
||
|
||
|
||
|
||
<div class="image_bottom_about"> | ||
<h4> Let your ideas and thoughts give you inspiration. All creativity comes from your imagination - you first imagine and then you create <br> Catherine Pulsifer </h4> | ||
<h4> </h4> | ||
</div> | ||
|
||
<footer> | ||
<div class="footer-content"> | ||
<h4>More about me!</h4> | ||
<ul class="socials"> | ||
<li><a href="#"><i class="fa fa-linkedin-square"></i></a></li> | ||
<li><a href="#"><i class="fa fa-linkedin"></i></a></li> | ||
<li><a href="#"><i class="fa fa-envelope"></i></a></li> | ||
</ul> | ||
</div> | ||
|
||
</footer> | ||
|
||
</body> | ||
</html> | ||
|
||
|
||
|
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -4,18 +4,101 @@ | |
<head> | ||
<meta charset="utf-8" /> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||
<title>Project Name</title> | ||
<!-- dont forget to add a css file and link it here! --> | ||
<!-- If you're using google fonts, that should be added here --> | ||
<title>BIG CHANGE ALWAYS STARTS WITH SMALL IDEAS!</title> | ||
<link rel="stylesheet" type="text/css" href="style.css"/> | ||
<link rel="icon" type="image/x-icon" href="/Users/rebeccabrogli/Desktop/Project1/project-p1-first-webpage-master/images/bulb_on.svg"> | ||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> | ||
|
||
Comment on lines
+7
to
+11
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Would be so nice with a favicon here as well 😊 |
||
<style> | ||
@import url('https://fonts.googleapis.com/css2?family=Lexend+Deca:wght@100;700&family=Raleway:wght@500;700&display=swap'); | ||
</style> | ||
|
||
</head> | ||
|
||
<body> | ||
<!-- | ||
Write your code here inside the body to make it appear in the browser. | ||
Below is an example on how to use an image tag. Copy it and add it in the body, but outside the comment tag if you want to see how it looks like on the website. Then you can change the size and other styling for it in the css file. | ||
|
||
<img src="example-recipe-background.png" alt="Banana Bread"> | ||
<header> | ||
<nav> | ||
<a href="./index.html">Home</a> | ||
<a href="./toolbox.html">Toolbox</a> | ||
<a href="./about.html">This is me!</a> | ||
</nav> | ||
|
||
<div class="hamburger"> | ||
<div> </div> | ||
<div> </div> | ||
<div> </div> | ||
</div> | ||
|
||
<img src="/Users/rebeccabrogli/Desktop/Desktop - Rebecca’s MacBook Air/Project1/project-p1-first-webpage-master/images/bulb_on.svg" alt="Big Idea Logo"> | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. You need to add any images to your uploads, this will only show on your computer since it's a local path. |
||
</header> | ||
|
||
<section class="welcome-comtainer"> | ||
<div class="titel"> | ||
Comment on lines
+36
to
+37
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Spelling of class names will help you when you reuse them ;) |
||
<h1>Big change always starts with small ideas!</h1> | ||
<h2> A guide to create bold ideas</h2> | ||
</div> | ||
</section> | ||
|
||
<section class="idea-boxes"> | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Very nice flexboxing! |
||
<div class="box"> | ||
<h3>Free Your Mind!</h2> | ||
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p> | ||
</div> | ||
|
||
<div class="box"> | ||
<h3>Inspire Yourself!</h2> | ||
<p> Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p> | ||
|
||
<a href="toolbox.html"> | ||
<button class="btn" type="button">Click Here </button> | ||
</a> | ||
</div> | ||
|
||
<div class="box"> | ||
<h3>Be Creative!</h2> | ||
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p> | ||
</div> | ||
|
||
<div class="box"> | ||
<h3>Ask Questions!</h2> | ||
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p> | ||
|
||
<a href="toolbox.html"> | ||
<button class= "btn" type="button">Click Here </button> | ||
</a> | ||
</div> | ||
|
||
<div class="box"> | ||
<h3>Generate Ideas!</h2> | ||
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p> | ||
|
||
<a href="toolbox.html"> | ||
<button class= "btn" type="button">Click Here </button> | ||
</a> | ||
</div> | ||
|
||
<div class="box"> | ||
<h3>Test Your Idea!</h2> | ||
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p> | ||
</div> | ||
</section> | ||
|
||
<div class="image_bottom_index"> | ||
<h4> Everything begins with an idea! </h4> | ||
</div> | ||
|
||
<footer> | ||
<div class="footer-content"> | ||
<h4>More about me!</h4> | ||
<ul class="socials"> | ||
<li><a href="#"><i class="fa fa-linkedin-square"></i></a></li> | ||
<li><a href="#"><i class="fa fa-linkedin"></i></a></li> | ||
<li><a href="#"><i class="fa fa-envelope"></i></a></li> | ||
</ul> | ||
</div> | ||
|
||
</footer> | ||
Comment on lines
+91
to
+101
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Very nice footer! |
||
|
||
--> | ||
<h1>Hello there! 👋🏼</h1> | ||
</body> | ||
</html> | ||
</html> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Aha - I guess this is the new part!