Skip to content
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.

Sign up for GitHub

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

Scissors - Aida R #50

Open
wants to merge 3 commits into
base: master
Choose a base branch
from
Open

Scissors - Aida R #50

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
3a00547
4pages, css and images
adia-9 Jun 8, 2021
aa12e26
Working version
adia-9 Jun 9, 2021
bf5e74b
refactoring main css
adia-9 Jun 9, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
45 changes: 45 additions & 0 deletions about.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<!-- title -->
<title>Aida Rysbek - About Me</title>
<!-- styles -->
<link rel="stylesheet" href="stylesheets/about.css">
<!-- fonts -->
<link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet">
<!-- meta -->
<meta charset="utf-8">
<meta name="description" content="Personal Portfolio assignment">
</head>
<body>
<div class="container">
<header>
<nav id="top-nav">
<ul>
<li><a href="index.html">home</a></li>
<li><a href="portfolio.html">portfolio</a></li>
<li><a href="hobby-blog.html">my blog</a></li>
<li><a href="about.html">about me</a></li>
</ul>
</nav>
</header>
<main>
<section class="about">
<aside>
<img class="image" src="images/profile.jpg" alt="about me">
</aside>

<section class="intro">
<h2>About Me</h2>
<p>I decided to pursue my Bachelor’s in Instructional Education, and prior to Ada, I worked at a B2B SaaS company as a Product Operations Manager to expand into EMEA, and APAC countries.</p>
<p>While working as a liaison between the developers, business partners, and end users, I realized that I enjoyed technical topics more, so I decided to revive my childhood dream and pick up coding once again. Now here I am, a proud student of Ada Developers Academy.</p>
<p>In addition to what I’m learning at Ada, my prior job experience with security and product API’s, which heavily utilized research, experimentation and data analytics have positively impacted my learnings, and I hope to expand on my knowledge during internship, as I get the opportunity to explore both the back and front end to more deeply discover where my skills and interests align.</p>
</section>
</section>

</main>
<footer>
</footer>
</div>
</body>
</html>
52 changes: 52 additions & 0 deletions hobby-blog.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,52 @@
<!DOCTYPE html>
<html>
<head>
<!-- title -->
<title>Aida Rysbek - Blog</title>
<!-- styles -->
<link rel="stylesheet" href="stylesheets/hobby-blog.css">
<!-- fonts -->
<link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet">
<!-- meta -->
<meta charset="utf-8">
<meta name="description" content="Personal Portfolio assignment">
</head>
<body>
<div class="container">
<header>
<nav id="top-nav">
<ul>
<li><a href="index.html">home</a></li>
<li><a href="portfolio.html">portfolio</a></li>
<li><a href="hobby-blog.html">my blog</a></li>
<li><a href="about.html">about me</a></li>
</ul>
</nav>
</header>
<main>
<h1 class="title"> My blog</h1>
<section class="blog-container">
<article class="blog">
<h2 class="blog-title">Kyrgyzstan</h2>
<p> Kyrgyzstan – is a country located in Central Asia. Landlocked and mountainous country. We make most of our electricity from a hydroelectric plant instead of burning gas. We are the only ones to have had a woman president in the region.</p>
<div class="button-container"><a class="read-more-button" href="https://silkroadexplore.com/about-kyrgyzstan/" target="_blank">External link</a></div>
</article>

<article class="blog">
<h2 class="blog-title">Biography</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.</p>
<div class="button-container"><a class="read-more-button" href="https://www.lipsum.com/" target="_blank">External link</a></div>
</article>

<article class="blog">
<h2 class="blog-title">Technology</h2>
<p>Lorem Ipsum It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. .</p>
<div class="button-container"><a class="read-more-button" href="https://www.lipsum.com/">External link</a></div>
</article>
</section>
</main>
<footer>
</footer>
</div>
</body>
</html>
Binary file added images/612.jpeg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/Kg_bg.jpeg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/koom.jpeg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/profile.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
59 changes: 59 additions & 0 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,59 @@
<!DOCTYPE html>
<html>
<head>
<!-- title -->
<title>Aida Rysbek</title>
<!-- styles -->
<link rel="stylesheet" href="stylesheets/styles.css">
<!-- fonts -->
<link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet">
<!-- meta -->
<meta charset="utf-8">
<meta name="description" content="Personal Portfolio assignment">
</head>
<body>
<div class="container">
<header>
<nav id="top-nav">
<ul>
<li><a href="index.html">home</a></li>
<li><a href="portfolio.html">portfolio</a></li>
<li><a href="hobby-blog.html">my blog</a></li>
<li><a href="about.html">about me</a></li>
</ul>
</nav>
</header>
<main>
<h1 class="parallax"> Aida Rysbek</h1>

<section class="banner-division break">
<a href="about.html">
<article>
<img src="images/profile.jpg" alt="about me image" class="circle"/>
<h2>About me</h2>
<p> I talk about my nomad life. I love Kyrgyz tomatoes, psychedelic music and lilac scent.</p>
</article></a>

<a href="portfolio.html">
<article>
<img src="images/612.jpeg" alt="portfolio image" class="circle"/>
<h2>Portfolio</h2>
<p> My projects completed to date in the Ada Developer's Academy curriculum.</p>
</article></a>

<a href="hobby-blog.html">
<article>
<img src="images/koom.jpeg" alt="blog image" class="circle"/>
<h2>Writing is Thinking</h2>
<p> Welcome to my blog whether you are friend of mine or an occasional visitor.</p>
</article></a>
</section>
</main>
<div class="parallax"></div>
<footer>
Aida, 2021
</section>
</footer>
</div>
</body>
</html>
69 changes: 69 additions & 0 deletions portfolio.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,69 @@
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<!-- title -->
<title>Aida Rysbek - Portfolio</title>
<!-- styles -->
<link rel="stylesheet" href="stylesheets/portfolio.css">
<!-- fonts -->
<link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet">
<!-- meta -->
<meta charset="utf-8">
<meta name="description" content="Personal Portfolio assignment">
</head>
<body>
<div class="container">
<header>
<nav id="top-nav">
<ul>
<li><a href="index.html">home</a></li>
<li><a href="portfolio.html">portfolio</a></li>
<li><a href="hobby-blog.html">my blog</a></li>
<li><a href="about.html">about me</a></li>
</ul>
</nav>
</header>
<main>
<h1 class="title"> My blog</h1>
<section class= "project-entries">
<section class="entry">
<h3 class="date">3.21.2021</h3>
<h2 class="entry-title">Viewing Party</h2>
<p>Project from Unit 1 Chapter 1: Programming Fundamentals</p>
<div class="button-container"><a class="read-more-button" href="https://github.com/adia-9/viewing-party" target="_blank">View on Github</a></div>
</section>

<section class="entry">
<h3 class="date">4.03.2021</h3>
<h2 class="entry-title">Swap Meet</h2>
<p>Project from Unit 1 Chapter 2: OOP in Python</p>
<div class="button-container"><a class="read-more-button" href="https://github.com/adia-9/swap-meet" target="_blank">View on Github</a></div>
</section>

<section class="entry">
<h3 class="date">4.20.2021</h3>
<h2 class="entry-title">Task List API</h2>
<p>Project from Unit 2 Chapter 1: Intro to API's in Flask</p>
<div class="button-container"><a class="read-more-button" href="https://github.com/adia-9/task-list-api" target="_blank">View on Github</a></div>
</section>

<section class="entry">
<h3 class="date">5.10.2021</h3>
<h2 class="entry-title">Retro Video Store</h2>
<p>Project from Unit 2 Chapter 2: Project in Flask, Databases in SQL</p>
<div class="button-container"><a class="read-more-button" href="https://github.com/adia-9/retro-video-store" target="_blank">View on Github</a></div>
</section>

<section class="entry">
<h3 class="date">5.17.2021</h3>
<h2 class="entry-title">Video Store CLI</h2>
<p>Fun project to enhance our skills in API and work on CLI</p>
<div class="button-container"><a class="read-more-button" href="https://github.com/adia-9/video-store-cli" target="_blank">View on Github</a></div>
</section>
</section>
</main>
<footer>
</footer>
</div>
</body>
</html>
56 changes: 56 additions & 0 deletions stylesheets/about.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,56 @@
body {
background: linear-gradient(to right,#500b11,#ce8ca0);;
}
#top-nav ul {
position: relative;
display: flex;
flex-direction: row;
justify-content: flex-end;
background-color: hsl(0, 0%, 0%, .6);
}

#top-nav li {
display: block;
padding: 1rem 4rem;
border-right: solid 1px hsl(187, 61%, 43%, .5);
}

#top-nav a {
color: hsl(32, 36%, 76%);
text-decoration: none;
font-size: 2em;
}

#top-nav li:hover {
background-color: hsl(187, 61%, 43%, .5);
}

.image {
border: rgb(225, 230, 22) 6px double;
border-radius: 70%;
height: 35vh;
width: 35vh;
margin: 10% 11%;
}

.about {
margin-top: 200px;
display: flex;
flex-wrap: wrap;
margin-bottom: 100px;
}

.intro {
width: 60%;
margin-left: 10%;
color: white;
line-height: 1.5;
}

.intro h2 {
color: rgb(225, 230, 22);
}

h2 {
font-size: 3em;
}
90 changes: 90 additions & 0 deletions stylesheets/hobby-blog.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,90 @@
body {
background: linear-gradient(to right,#500b11,#ce8ca0);;
}

#top-nav ul {
position: relative;
display: flex;
flex-direction: row;
justify-content: flex-end;
background-color: hsl(0, 0%, 0%, .6);
}

#top-nav li {
display: block;
padding: 1rem 4rem;
border-right: solid 1px hsl(187, 61%, 43%, .5);
}

#top-nav a {
color: hsl(32, 36%, 76%);
text-decoration: none;
font-size: 2em;
}

#top-nav li:hover {
background-color: hsl(187, 61%, 43%, .5);
}

.title {
font-size: 2.5em;
text-align: center;
margin-top: 2rem;
color: white;
}

/*blog part*/
.blog-container {
display: flex;
flex-wrap: wrap;
justify-content: center;
}

.blog {
border-top: dotted white 3px;
color: white;
align-self: center;
line-height: 1.5;
display: grid;
grid-template-columns: 2fr 4fr;
grid-template-rows: 3fr 2fr;
width: 900px;
padding: 100px;
}

.blog-title {
text-transform: uppercase;
color: rgb(225, 230, 22);
margin-left: 20px;
}


.blog:last-child {
border-bottom: dotted white 3px;
margin-bottom: 200px;
}

/*button properties*/

.button-container{
padding-top: 30px;
grid-column-start: 2;
grid-row-start: 2;
margin-left: 10px;
}

.read-more-button {
text-transform: uppercase;
border: 1px solid white;
padding: 8px;
border-radius: 10px;
color: white;
display: flex;
width: 150px;
}

.read-more-button:hover {
color: black;
background-color: hsl(187, 61%, 43%, .5);
cursor: default;
}
Loading