Skip to content

Commit

Permalink
Merge pull request #446 from MastersAcademy/10-final_AndriiMorozov88
Browse files Browse the repository at this point in the history 
10 final andrii morozov88
  • Loading branch information
@vladyslav-yermolin-moc
vladyslav-yermolin-moc authored Jan 8, 2024
2 parents 425b005 + 4847b89 commit 1e7001e
Show file tree
Hide file tree
Showing 34 changed files with 1,845 additions and 338 deletions.
78 changes: 78 additions & 0 deletions docs/AndriiMorozov88/about.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,78 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>About Me</title>
<link rel="stylesheet" href="styles/about.css">
<link rel="stylesheet" href="styles/header.css">
<link rel="stylesheet" href="styles/common_styles.css">
<link rel="stylesheet" href="styles/footer.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;800&family=Roboto:wght@500&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;800&family=Roboto:wght@400&display=swap" rel="stylesheet">
</head>
<body>
<header class="header">
<div class="header__logo">
<svg class="logo">
<use xlink:href="sprite.svg#logo"></use>
</svg>
</div>
<div class="header__navigation">
<ul class="navigation">
<li class="navigation__line">
<a class="navigation__link" href="cards.html">Games</a>
</li>
<li class="navigation__line navigation__line--underline">
About
</li>
<li class="navigation__line">
<a class="navigation__link" href="calculator.html">Calculator</a>
</li>
<li class="navigation__line">
<a class="navigation__link" href="login.html">LogIn</a>
</li>
</ul>
</div>
</header>
<main class="main container">
<img class="container__image" src="images/computers.jpg" alt="image">
<article class="container__article">
<h1 class="main__heading">About Me</h1>
<p class="container__text">
Hi! My name is Andrii Morozov and I'm a Junior Frontend Developer. I am already familiar with main Web Technologies like HTML, CSS, JavaScript and Git version control system.
</p>
<p class="container__text">
This page was developed during the course <a href="https://www.mastersacademy.education/frontend-for-beginners-it" class="link--red" target="_blank">'Frontend for beginners' from Masters Academy in 2023.</a>
</p>
<p class="container__text">
This is a social project from MOCG company where I got an opportunity to work with Frontend mentors and to create my own small project for the portfolio.
</p>
<p class="container__text">
You can contact me via <a href="https://www.facebook.com/profile.php?id=100024573128932" class="link--red" target="_blank">facebook</a>
or check out my <a href="https://github.com AndriiMorozov88" class="link--red" target="_blank">GitHub</a>.
</p>
</article>
</main>
<footer class="footer" data-footer>
<section class="footer__svg-container">
<svg class="footer__svg">
<use xlink:href="sprite.svg#facebook"></use>
</svg>
<svg class="footer__svg">
<use xlink:href="sprite.svg#linked_in"></use>
</svg>
<svg class="footer__svg">
<use xlink:href="sprite.svg#instagram"></use>
</svg>
</section>
<section class="footer__text">
<p>Made with 💗 on course
<a class="footer__link" target="_blank" href="https://www.mastersacademy.education/frontend-for-beginners-it">'Frontend for beginners' from Masters Academy in 2023</a>
, by Andrii Morozov</p>
</section>
</footer>
</body>
</html>
83 changes: 83 additions & 0 deletions docs/AndriiMorozov88/calculator.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,83 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Calculator</title>
<link rel="stylesheet" href="styles/header.css">
<link rel="stylesheet" href="styles/footer.css">
<link rel="stylesheet" href="styles/calculator.css">
<link rel="stylesheet" href="styles/common_styles.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;800&family=Roboto:wght@500&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;800&family=Roboto:wght@400&display=swap" rel="stylesheet">
</head>
<body>
<header class="header">
<div class="header__logo">
<svg class="logo">
<use xlink:href="sprite.svg#logo"></use>
</svg>
</div>
<div class="header__navigation">
<ul class="navigation">
<li class="navigation__line">
<a class="navigation__link" href="cards.html">Games</a>
</li>
<li class="navigation__line">
<a class="navigation__link" href="about.html">About</a>
</li>
<li class="navigation__line navigation__line--underline">
Calculator
</li>
<li class="navigation__line">
<a class="navigation__link" href="login.html">LogIn</a>
</li>
</ul>
</div>
</header>
<main class="main main__calculator">
<h1 class="main__heading">
Basic math operation
</h1>
<section class="calculator">
<label for="first-number">
<input type="text" class="calculator__operand" id="first-number" placeholder="first number" data-first-number>
</label>
<select name="operation" class="calculator__operation" data-operation>
<option value="1" selected>+</option>
<option value="2">-</option>
<option value="3">*</option>
<option value="4">/</option>
<option value="5">POW</option>
</select>
<label for="second-number">
<input type="text" class="calculator__operand" id="second-number" placeholder="second number" data-second-number>
</label>
<button type="button" class="calculator__button" data-button>=</button>
<div data-result class="calculator__result"></div>
</section>
<section class="comment-container" data-comment></section>
</main>
<footer class="footer" data-footer>
<section class="footer__svg-container">
<svg class="footer__svg">
<use xlink:href="sprite.svg#facebook"></use>
</svg>
<svg class="footer__svg">
<use xlink:href="sprite.svg#linked_in"></use>
</svg>
<svg class="footer__svg">
<use xlink:href="sprite.svg#instagram"></use>
</svg>
</section>
<section class="footer__text">
<p>Made with 💗 on course
<a class="footer__link" target="_blank" href="https://www.mastersacademy.education/frontend-for-beginners-it">'Frontend for beginners' from Masters Academy in 2023</a>
, by Andrii Morozov</p>
</section>
</footer>
<script src="./scripts/logic.js"></script>
</body>
</html>
150 changes: 150 additions & 0 deletions docs/AndriiMorozov88/cards.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,150 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Cards</title>
<link rel="stylesheet" href="styles/cards.css">
<link rel="stylesheet" href="styles/header.css">
<link rel="stylesheet" href="styles/common_styles.css">
<link rel="stylesheet" href="styles/footer.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;800&family=Roboto:wght@500&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;800&family=Roboto:wght@400&display=swap" rel="stylesheet">
</head>
<body>
<header class="header">
<div class="header__logo">
<svg class="logo">
<use xlink:href="sprite.svg#logo"></use>
</svg>
</div>
<div class="header__navigation">
<ul class="navigation">
<li class="navigation__line navigation__line--underline">
Games
</li>
<li class="navigation__line">
<a class="navigation__link" href="about.html">About</a>
</li>
<li class="navigation__line">
<a class="navigation__link" href="calculator.html">Calculator</a>
</li>
<li class="navigation__line">
<a class="navigation__link" href="login.html">LogIn</a>
</li>
</ul>
</div>
</header>
<form action="#" method="post" class="filter">
<button type="button" class="filter__burger-button" data-burger-button>
<svg class="button__logo">
<use xlink:href="sprite.svg#filter"></use>
</svg>
</button>
<section class="filter__block" data-filter-block>
<select name="select-genre" class="filter__select" data-select-genre>
<option value="0" selected>All Genres</option>
<option value="Shooter">Shooter</option>
<option value="ARPG">ARPG</option>
<option value="Battle Royale">Battle Royale</option>
<option value="Strategy">Strategy</option>
<option value="MMORPG">MMORPG</option>
<option value="Fighting">Fighting</option>
<option value="Card Game">Card Game</option>
</select>
<select name="select-platform" class="filter__select" data-select-platform>
<option value="all" selected>All Platforms</option>
<option value="PC (Windows)">PC (Windows)</option>
<option value="Web Browser">Web Browser</option>
</select>
<section class="filter__element">
<label class="filter-element">
<input type="radio" name="radio" data-old-first>
Old First
</label>
<label for="old-first" class="filter-element">
<input type="radio" name="radio" data-new-first>
New First
</label>
</section>
<section class="filter__element">
<label for="new" class="filter-element">
<input type="checkbox" data-new-games>
New
</label>
<label for="old">
<input type="checkbox" data-old-games>
Old
</label>
</section>
</section>
<section class="filter__search">
<div class="search__svg">
<svg class="svg--search">
<use xlink:href="sprite.svg#search"></use>
</svg>
</div>
<div class="search__input-field">
<input type="text" class="search__input" placeholder="Search" data-search-input>
<button type="button" class="search__button" data-search-button>Apply</button>
</div>
</section>
</form>
<template data-card-template>
<section class="card">
<div class="card__image-container">
<img class="card__image" data-game-image src="https://www.mmobomb.com/g/1136/thumbnail.jpg" alt="overwatch">
</div>
<div class="card__name">
<h2 class="card__heading" data-game-title></h2>
<p class="card__data" data-game-id></p>
<p class="card__data card__data--short" data-game-description></p>
</div>
<div class="card__description">
<p class="card__data card__data--short" data-game-description></p>
<p class="card__data" data-game-genre></p>
<p class="card__data" data-game-url></p>
<p class="card__data" data-game-platform></p>
<p class="card__data" data-game-publisher></p>
<p class="card__data" data-game-developer></p>
<p class="card__data" data-game-release></p>
<p class="card__data" data-game-profile-url></p>
</div>
</section>
</template>
<h1 class="main__heading cards__heading">Games</h1>
<main class="main">
<section class="main__cards">
<p class="cards-loading-info--disabled" data-info></p>
<div class="card-container" data-card-container>
</div>
</section>
</main>
<button type="button" class="button-up--hidden" data-up-button>
<svg class="button-up__svg">
<use xlink:href="sprite.svg#up_button"></use>
</svg>
</button>
<footer class="footer" data-footer>
<section class="footer__svg-container">
<svg class="footer__svg">
<use xlink:href="sprite.svg#facebook"></use>
</svg>
<svg class="footer__svg">
<use xlink:href="sprite.svg#linked_in"></use>
</svg>
<svg class="footer__svg">
<use xlink:href="sprite.svg#instagram"></use>
</svg>
</section>
<section class="footer__text">
<p>Made with 💗 on course
<a class="footer__link" target="_blank" href="https://www.mastersacademy.education/frontend-for-beginners-it">'Frontend for beginners' from Masters Academy in 2023</a>
, by Andrii Morozov</p>
</section>
</footer>
<script type="module" src="scripts/games.js"></script>
</body>
</html>
Binary file added docs/AndriiMorozov88/images/computers.jpg
View file
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 docs/AndriiMorozov88/images/game_img.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
79 changes: 79 additions & 0 deletions docs/AndriiMorozov88/login.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,79 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Login</title>
<link rel="stylesheet" href="styles/login.css">
<link rel="stylesheet" href="styles/header.css">
<link rel="stylesheet" href="styles/common_styles.css">
<link rel="stylesheet" href="styles/footer.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;800&family=Roboto:wght@500&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;800&family=Roboto:wght@400&display=swap" rel="stylesheet">
</head>
<body>
<header class="header">
<div class="header__logo">
<svg class="logo">
<use xlink:href="sprite.svg#logo"></use>
</svg>
</div>
<div class="header__navigation">
<ul class="navigation">
<li class="navigation__line">
<a class="navigation__link" href="cards.html">Games</a>
</li>
<li class="navigation__line">
<a class="navigation__link" href="about.html">About</a>
</li>
<li class="navigation__line">
<a class="navigation__link" href="calculator.html">Calculator</a>
</li>
<li class="navigation__line navigation__line--underline">
LogIn
</li>
</ul>
</div>
</header>
<main class="main main__log-in">
<h1 class="main__heading">Login page</h1>
<form action="success.html" target="_self" method="post">
<fieldset class="log-in">
<label for="email" class="log-in__label">
<b>Email</b>
</label>
<input type="text" id="email" class="log-in__input" data-error placeholder="Enter your email adres">
<label for="password" class="log-in__label">
<b>Password</b>
</label>
<input type="password" id="password" class="log-in__input" data-error placeholder="Enter your password">
<label for="checkbox" class="log-in__label" id="label_checkbox">
<input type="checkbox" class="log-in__checkbox" data-error id="checkbox">I am not a robot
</label>
<button type="button" class="log-in__button" id="submit_button">Login</button>
</fieldset>
</form>
</main>
<footer class="footer">
<section class="footer__svg-container">
<svg class="footer__svg">
<use xlink:href="sprite.svg#facebook"></use>
</svg>
<svg class="footer__svg">
<use xlink:href="sprite.svg#linked_in"></use>
</svg>
<svg class="footer__svg">
<use xlink:href="sprite.svg#instagram"></use>
</svg>
</section>
<section class="footer__text">
<p>Made with 💗 on course
<a class="footer__link" target="_blank" href="https://www.mastersacademy.education/frontend-for-beginners-it">'Frontend for beginners' from Masters Academy in 2023</a>
, by Andrii Morozov</p>
</section>
</footer>
<script src="scripts/script.js"></script>
</body>
</html>
Loading

0 comments on commit 1e7001e

Please sign in to comment.