Skip to content

Commit

Permalink
Add new icons for popup window
Browse files Browse the repository at this point in the history
  • Loading branch information
jlcarrascof committed Apr 22, 2023
1 parent aef23e1 commit 90cf81f
Show file tree
Hide file tree
Showing 11 changed files with 590 additions and 312 deletions.
Binary file added Project-portfolio.rar
Binary file not shown.
485 changes: 311 additions & 174 deletions assets/css/styles.css

Large diffs are not rendered by default.

3 changes: 3 additions & 0 deletions assets/images/Counter.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions assets/images/gitButton.svg
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 assets/images/icon-close-popup.png
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 assets/images/icon-export-blue.png
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 assets/images/icon-git-blue.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions assets/images/liveButton.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions assets/images/xButton.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
166 changes: 159 additions & 7 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@

<ul class="nav-menu">
<li class="nav-item">
<a href="#portfolio" class="nav-link">Portfolio</a>
<a href="#Portfolio" class="nav-link">Portfolio</a>
</li>
<li class="nav-item">
<a href="#aboutMyself" class="nav-link">About</a>
Expand Down Expand Up @@ -49,10 +49,7 @@ <h1>I’m Javier. <br />Glad to see you!</h1>
<li><a href="#" target="_blank"><img src="./assets/images/angel-list.svg" alt=""></a></li>
</ul>
</section>
<section id="portfolio">

<!-- cards generated dinamically -->

<!--
<div class="card-container">
<div class="cards card-1">
<div>
Expand Down Expand Up @@ -222,8 +219,128 @@ <h3 class="card-title">Multi-Post Stories</h3>
</div>
</div>
</div>
<div class="recent-work" id="portfolio"></div>
<div class="project-popup-container"></div>
-->
<section class="works" id="Portfolio">
<div class="works__card f_cr">
<div class="img-container f_cr">
<img src="./assets/images/image5.svg" alt="project one" />
</div>
<div class="works__card--text">
<h2>Tonic</h2>
<ul class="works__card--info f_cr">
<li class="f_cr"><span>CANOPY</span></li>
<li class="f_cr">
<img src="./assets/images/Counter.svg" alt="counter" />
<p>Back End Dev</p>
</li>
<li class="f_cr">
<img src="./assets/images/Counter.svg" alt="counter" />
<p>2015</p>
</li>
</ul>
<p>
A daily selection of privately personalized reads; no accounts or
sign-ups required.
</p>
<ul class="works__card--tags f_cr">
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
</ul>
<button type="button" class="button">See project</button>
</div>
</div>
<div class="works__card f_cr">
<div class="img-container f_cr">
<img src="./assets/images/image2.svg" alt="project two" />
</div>
<div class="works__card--text">
<h2>Uber Navigation</h2>
<ul class="works__card--info f_cr">
<li class="f_cr"><span>Uber</span></li>
<li class="f_cr">
<img src="./assets/images/Counter.svg" alt="counter" />
<p>Lead Developer</p>
</li>
<li class="f_cr">
<img src="./assets/images/Counter.svg" alt="counter" />
<p>2018</p>
</li>
</ul>
<p>
A smart assistant to make driving more safe, efficient, and fun by
unlocking your most expensive computer: your car.
</p>
<ul class="works__card--tags f_cr">
<li>HTML</li>
<li>Ruby on Rails</li>
<li>CSS</li>
<li>JavaScript</li>
</ul>
<button type="button" class="button">See project</button>
</div>
</div>
<div class="works__card f_cr">
<div class="img-container f_cr">
<img src="./assets/images/image1.svg" alt="project three" />
</div>
<div class="works__card--text">
<h2>Facebook 360</h2>
<ul class="works__card--info f_cr">
<li class="f_cr"><span>FACEBOOK</span></li>
<li class="f_cr">
<img src="./assets/images/Counter.svg" alt="counter" />
<p>Back End Dev</p>
</li>
<li class="f_cr">
<img src="./assets/images/Counter.svg" alt="counter" />
<p>2015</p>
</li>
</ul>
<p>
Exploring the future of media in Facebook's first Virtual Reality
app; a place to discover and enjoy 360 photos and videos on Gear VR.
</p>
<ul class="works__card--tags f_cr">
<li>HTML</li>
<li>Ruby on Rails</li>
<li>CSS</li>
<li>JavaScript</li>
</ul>
<button type="button" class="button">See project</button>
</div>
</div>
<div class="works__card f_cr">
<div class="img-container f_cr">
<img src="./assets/images/image4.svg" alt="project four" />
</div>
<div class="works__card--text">
<h2>Multi-Post Stories</h2>
<ul class="works__card--info f_cr">
<li class="f_cr"><span>FACEBOOK</span></li>
<li class="f_cr">
<img src="./assets/images/Counter.svg" alt="counter" />
<p>Full Stack Dev</p>
</li>
<li class="f_cr">
<img src="./assets/images/Counter.svg" alt="counter" />
<p>2015</p>
</li>
</ul>
<p>
Experimental content creation feature that allows users to add to an
existing story over the course of a day without spamming their
friends.
</p>
<ul class="works__card--tags f_cr">
<li>HTML</li>
<li>Ruby on Rails</li>
<li>CSS</li>
<li>JavaScript</li>
</ul>
<button type="button" class="button">See project</button>
</div>
</div>
</section>
<section id="aboutMyself">
<div class="about-container">
Expand Down Expand Up @@ -356,6 +473,41 @@ <h2 class="white">Contact me</h2>
</form>
</div>
</section>
<section id="popupSection">
<div class="modal">
<div class="modal-content">
<div class="between">
<h2 class="modal-title"></h2>
<span class="close"><img src="./assets/images/xButton.svg" alt="close"></span>
</div>
<div class="modal-project-info"></div>
<div class="image-container">
<img class="modal-image" src="" alt="">
</div>
<div class="d-flex">
<p class="modal-description"></p>
<div class="second">
<div class="modal-badges f_cr"></div>
<div class="modal-buttons">
<a class="modal-button live-button" href="" target="_blank">See Live
<img src="./assets/images/liveButton.svg" alt="live">
</a>
<a class="modal-button source-button" href="" target="_blank">See Source
<img src="./assets/images/gitButton.svg" alt="github">
</a>
</div>
</div>
</div>
<div class="modal-nav">
<button class="modal-nav-button prev-button" onclick="fillModal(projects[index - 1], index - 1)"
disabled>
<-- Previous</button> <button class="modal-nav-button next-button"
onclick="fillModal(projects[index + 1], index + 1)" disabled>Next -->
</button>
</div>
</div>
</div>
</section>
<script src="scripts.js"></script>
<script src="popup.js"></script>
</body>
Expand Down
Loading

0 comments on commit 90cf81f

Please sign in to comment.