Skip to content

Commit

Permalink
Update Into-the-woods.html
Browse files Browse the repository at this point in the history
  • Loading branch information
@tranthanhvi
tranthanhvi authored Dec 17, 2021
1 parent 1ebb33f commit 8b32bcf
Showing 1 changed file with 156 additions and 58 deletions.
214 changes: 156 additions & 58 deletions Into-the-woods.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,32 +12,58 @@

<body>
<!-- Main Menu -->
<div class="main">
<!--Title-->
<div class="mutual-title">
<h1 class="shepar">Shep@r</h1>
<h3>Photographer</h3>
</div>
<div class="nav">
<!-- Nav PC -->
<nav class="nav-pc">
<ul class="nav-container">
<li class="nav-item"><a class="link-nav" href="Into-the-woods.html">Home</a></li>
<li class="nav-item"><a class="link-nav" href="About.html">About</a></li>
</ul>
</nav>
<!-- Nav mobile-->
<div class="nav-button">
<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="bars"
class="svg-inline--fa fa-bars fa-w-14" role="img" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 448 512">
<path fill="currentColor"
d="M16 132h416c8.837 0 16-7.163 16-16V76c0-8.837-7.163-16-16-16H16C7.163 60 0 67.163 0 76v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16z">
</path>
</svg>
</div>
</div>
</div>
<table>
<tr>
<td>
<div class="mutual-title">
<h1 class="shepar">Shep@r</h1>
<h3>Photographer</h3>
</div>
</td>
<td>
<div class="nav">
<!-- Nav PC -->
<nav class="nav-pc">
<ul class="nav-container">
<li class="nav-item"><a class="link-nav" href="index.html">Home</a></li>
<li class="nav-item"><a class="link-nav" href="About.html">About</a></li>
</ul>
</nav>
<!-- Nav bars button-->
<label for="nav-mobile-input" class="nav-button">
<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="bars"
class="svg-inline--fa fa-bars fa-w-14" role="img" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 448 512">
<path fill="currentColor"
d="M16 132h416c8.837 0 16-7.163 16-16V76c0-8.837-7.163-16-16-16H16C7.163 60 0 67.163 0 76v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16z">
</path>
</svg>
</label>
<input type="checkbox" name="" id="nav-mobile-input" class="nav-input">
<!--The overlay-->
<label for="nav-mobile-input" class="nav-overlay"></label>
<!--Nav Mobile-->
<nav class="nav-mobile">
<ul class="nav-mobile-container">
<li class="nav-mobile-item"><a class="nav-mobile-link" href="index.html">Home</a></li>
<li class="nav-mobile-item"><a class="nav-mobile-link" href="About.html">About</a></li>
</ul>
<label for="nav-mobile-input" class="nav-mobile-close">
<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="times"
class="svg-inline--fa fa-times fa-w-11" role="img" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 352 512">
<path fill="currentColor"
d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z">
</path>
</svg>
</label>
</nav>


</div>
</td>
</tr>
</table>

<!--Title project section-->
<div class="project-flex-container">
Expand All @@ -47,69 +73,141 @@ <h3>Photographer</h3>
</div>
<div class="project-title-item">
<h2 class="mutual-title">Into the Woods</h2>
<div style="text-align: center;">July 2017 - present</div>
<div style="text-align: center; font-family: 'Lucida Sans';">July 2017 - present</div>
</div>
</div>
<!--Pictures section-->
<div class="project-flex-container">

<div class="project-picture-1">
<img src="https://github.com/tranthanhvi/tranthanhvi.github.io/blob/main/I-2.jpg?raw=true" width="850px"
<img class="project-pic-flex"
src="https://github.com/tranthanhvi/tranthanhvi.github.io/blob/main/I-2.jpg?raw=true"
alt="Into the Woods-2">
</div>

<div class="project-picture-2">
<img src="https://github.com/tranthanhvi/tranthanhvi.github.io/blob/main/I-3.jpg?raw=true" width="550px"
<img class="project-pic-flex"
src="https://github.com/tranthanhvi/tranthanhvi.github.io/blob/main/I-3.jpg?raw=true"
alt="Into the Woods-3">
</div>
</div>


<div class="project-picture-single">
<img src="https://github.com/tranthanhvi/tranthanhvi.github.io/blob/main/I-4.jpg?raw=true" width="850px"
<img class="project-pic-flex"
src="https://github.com/tranthanhvi/tranthanhvi.github.io/blob/main/I-4.jpg?raw=true"
alt="Into the Woods-4">
</div>

<div class="project-flex-container">
<div class="project-picture-2">
<img src="https://github.com/tranthanhvi/tranthanhvi.github.io/blob/main/I-5.jpg?raw=true" width="550px"
<img class="project-pic-flex"
src="https://github.com/tranthanhvi/tranthanhvi.github.io/blob/main/I-5.jpg?raw=true"
alt="Into the Woods-5">
</div>


<div class="project-picture-1">
<img src="https://github.com/tranthanhvi/tranthanhvi.github.io/blob/main/I-6.jpg?raw=true" width="750px"
<img class="project-pic-flex"
src="https://github.com/tranthanhvi/tranthanhvi.github.io/blob/main/I-6.jpg?raw=true"
alt="Into the Woods-6">
</div>

</div>
<!--Nav project button-->
<div class="nav-projectbt-container">
<div class="nav-projectbt-item left">
<a style="font-family: sans-serif;" href="About.html"><svg style="width: 28px; height: 28px; padding-right:25px"
aria-hidden="true" focusable="false" data-prefix="fas" data-icon="chevron-left"
class="svg-inline--fa fa-chevron-left fa-w-10" role="img" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 320 512">
<path fill="currentColor"
d="M34.52 239.03L228.87 44.69c9.37-9.37 24.57-9.37 33.94 0l22.67 22.67c9.36 9.36 9.37 24.52.04 33.9L131.49 256l154.02 154.75c9.34 9.38 9.32 24.54-.04 33.9l-22.67 22.67c-9.37 9.37-24.57 9.37-33.94 0L34.52 272.97c-9.37-9.37-9.37-24.57 0-33.94z">
</path>
</svg>About</a>
</div>

<!--Nav project button (using full-width table)-->
<table>
<tr>
<td>
<div class="nav-projectbt-item left">
<a style="font-family: sans-serif;" href="About.html"><svg
style="width: 28px; height: 28px; padding-right:25px" aria-hidden="true" focusable="false"
data-prefix="fas" data-icon="chevron-left" class="svg-inline--fa fa-chevron-left fa-w-10"
role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">
<path fill="currentColor"
d="M34.52 239.03L228.87 44.69c9.37-9.37 24.57-9.37 33.94 0l22.67 22.67c9.36 9.36 9.37 24.52.04 33.9L131.49 256l154.02 154.75c9.34 9.38 9.32 24.54-.04 33.9l-22.67 22.67c-9.37 9.37-24.57 9.37-33.94 0L34.52 272.97c-9.37-9.37-9.37-24.57 0-33.94z">
</path>
</svg>About</a>
</div>
</td>
<td>
<div class="nav-projectbt-item right">
<a style="font-family: sans-serif;" href="Human.html">Human<svg
style="width: 28px; height: 28px; padding-left:25px" aria-hidden="true" focusable="false"
data-prefix="fas" data-icon="chevron-right" class="svg-inline--fa fa-chevron-right fa-w-10"
role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">
<path fill="currentColor"
d="M285.476 272.971L91.132 467.314c-9.373 9.373-24.569 9.373-33.941 0l-22.667-22.667c-9.357-9.357-9.375-24.522-.04-33.901L188.505 256 34.484 101.255c-9.335-9.379-9.317-24.544.04-33.901l22.667-22.667c9.373-9.373 24.569-9.373 33.941 0L285.475 239.03c9.373 9.372 9.373 24.568.001 33.941z">
</path>
</svg></a>
</div>
</td>
</tr>
</table>
<hr>
<!--FOOTER-->
<!--Contact info using table-->

<div class="nav-projectbt-item right">
<a style="font-family: sans-serif;" href="Human.html">Human<svg style="width: 28px; height: 28px; padding-left:25px"
aria-hidden="true" focusable="false" data-prefix="fas" data-icon="chevron-right"
class="svg-inline--fa fa-chevron-right fa-w-10" role="img" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 320 512">
<path fill="currentColor"
d="M285.476 272.971L91.132 467.314c-9.373 9.373-24.569 9.373-33.941 0l-22.667-22.667c-9.357-9.357-9.375-24.522-.04-33.901L188.505 256 34.484 101.255c-9.335-9.379-9.317-24.544.04-33.901l22.667-22.667c9.373-9.373 24.569-9.373 33.941 0L285.475 239.03c9.373 9.372 9.373 24.568.001 33.941z">
</path>
</svg></a>
<div>
</div>
</div>
<div class="contact-table">
<h3>Contact</h3>
<table>
<tr>
<td>
<div class="contact-symbol"><svg aria-hidden="true" focusable="false" data-prefix="far"
data-icon="envelope" class="svg-inline--fa fa-envelope fa-w-16" role="img"
xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<path fill="currentColor"
d="M464 64H48C21.49 64 0 85.49 0 112v288c0 26.51 21.49 48 48 48h416c26.51 0 48-21.49 48-48V112c0-26.51-21.49-48-48-48zm0 48v40.805c-22.422 18.259-58.168 46.651-134.587 106.49-16.841 13.247-50.201 45.072-73.413 44.701-23.208.375-56.579-31.459-73.413-44.701C106.18 199.465 70.425 171.067 48 152.805V112h416zM48 400V214.398c22.914 18.251 55.409 43.862 104.938 82.646 21.857 17.205 60.134 55.186 103.062 54.955 42.717.231 80.509-37.199 103.053-54.947 49.528-38.783 82.032-64.401 104.947-82.653V400H48z">
</path>
</svg>
</div>
</td>
<td>
<div>[email protected]</div>
</td>
</tr>
<tr>
<td>
<div class="contact-symbol"><svg aria-hidden="true" focusable="false" data-prefix="fas"
data-icon="phone" class="svg-inline--fa fa-phone fa-w-16" role="img"
xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<path fill="currentColor"
d="M493.4 24.6l-104-24c-11.3-2.6-22.9 3.3-27.5 13.9l-48 112c-4.2 9.8-1.4 21.3 6.9 28l60.6 49.6c-36 76.7-98.9 140.5-177.2 177.2l-49.6-60.6c-6.8-8.3-18.2-11.1-28-6.9l-112 48C3.9 366.5-2 378.1.6 389.4l24 104C27.1 504.2 36.7 512 48 512c256.1 0 464-207.5 464-464 0-11.2-7.7-20.9-18.6-23.4z">
</path>
</svg>
</div>
</td>
<td>
<div>
0705348906
</div>
</td>
</tr>
<tr>
<td>
<div class="contact-symbol">
<svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="instagram"
class="svg-inline--fa fa-instagram fa-w-14" role="img" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 448 512">
<path fill="currentColor"
d="M224.1 141c-63.6 0-114.9 51.3-114.9 114.9s51.3 114.9 114.9 114.9S339 319.5 339 255.9 287.7 141 224.1 141zm0 189.6c-41.1 0-74.7-33.5-74.7-74.7s33.5-74.7 74.7-74.7 74.7 33.5 74.7 74.7-33.6 74.7-74.7 74.7zm146.4-194.3c0 14.9-12 26.8-26.8 26.8-14.9 0-26.8-12-26.8-26.8s12-26.8 26.8-26.8 26.8 12 26.8 26.8zm76.1 27.2c-1.7-35.9-9.9-67.7-36.2-93.9-26.2-26.2-58-34.4-93.9-36.2-37-2.1-147.9-2.1-184.9 0-35.8 1.7-67.6 9.9-93.9 36.1s-34.4 58-36.2 93.9c-2.1 37-2.1 147.9 0 184.9 1.7 35.9 9.9 67.7 36.2 93.9s58 34.4 93.9 36.2c37 2.1 147.9 2.1 184.9 0 35.9-1.7 67.7-9.9 93.9-36.2 26.2-26.2 34.4-58 36.2-93.9 2.1-37 2.1-147.8 0-184.8zM398.8 388c-7.8 19.6-22.9 34.7-42.6 42.6-29.5 11.7-99.5 9-132.1 9s-102.7 2.6-132.1-9c-19.6-7.8-34.7-22.9-42.6-42.6-11.7-29.5-9-99.5-9-132.1s-2.6-102.7 9-132.1c7.8-19.6 22.9-34.7 42.6-42.6 29.5-11.7 99.5-9 132.1-9s102.7-2.6 132.1 9c19.6 7.8 34.7 22.9 42.6 42.6 11.7 29.5 9 99.5 9 132.1s2.7 102.7-9 132.1z">
</path>
</svg>
</div>
</td>
<td>
<div>
<a style="color:black" href="https://www.instagram.com/shepaar/">@shepaar</a>
</div>
</td>
</tr>
</table>
</div>
<!--Validator symbol-->
<div class="validator-icon">
<a href="https://validator.w3.org/" target="_blank"><img src="https://www.w3.org/Icons/valid-css-blue"
alt="Validator icon">
</a>
</div>

</body>

</html>

0 comments on commit 8b32bcf

Please sign in to comment.