Permalink
Cannot retrieve contributors at this time
Name already in use
A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?
Tyler-Burke-DMD-3470-Web-II/cssShowcase/index.html
Go to fileThis commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
178 lines (128 sloc)
7.2 KB
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <meta http-equiv="X-UA-Compatible" content="ie=edge"> | |
| <title>Tyler Burke</title> | |
| <link rel="stylesheet" href="style.css"> | |
| <link rel="stylesheet" href="newCss.css"> | |
| <link href="https://fonts.googleapis.com/css?family=Abril+Fatface|Hind:300&display=swap" rel="stylesheet"> | |
| <link href="https://fonts.googleapis.com/css?family=Karla:700&display=swap" rel="stylesheet"> | |
| <link href="https://fonts.googleapis.com/css?family=Reenie+Beanie&display=swap" rel="stylesheet"> | |
| <link href="https://fonts.googleapis.com/css?family=Montserrat&display=swap" rel="stylesheet"> | |
| </head> | |
| <body> | |
| <div class="loader-wrapper"> | |
| <div class="wrap"> | |
| <div class="loading"> | |
| <div class="bounceball"></div> | |
| <div class="text">LOADING</div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="title"> | |
| <p aria-label="Tyler"> | |
| <span data-text="T">T</span> | |
| <span data-text="Y">Y</span> | |
| <span data-text="L">L</span> | |
| <span data-text="E">E</span> | |
| <span data-text="R">R</span> | |
| <span data-text=" "> </span> | |
| <span data-text="B">B</span> | |
| <span data-text="U">U</span> | |
| <span data-text="R">R</span> | |
| <span data-text="K">K</span> | |
| <span data-text="E">E</span> | |
| </p> | |
| </div> | |
| <nav id="nav"> | |
| <ul> | |
| <li><a href="https://github.uconn.edu/pages/tjb17003/Tyler-Burke-DMD-3470-Web-II/cssShowcase/index.html#" class="btn btn-2">Home</a></li> | |
| <li><a id="about"href="#" class="btn btn-2">About</a></li> | |
| <li><a id="contact" href="#" class="btn btn-2">Contact</a> | |
| <ul class="drop-menu"> | |
| <li><a class="drop" href="https://www.instagram.com/tylerjamesburke/"><i id="icons" class="fa fa-instagram" aria-hidden="true"></i>Instagram</a></li> | |
| <li><a class="drop" href="mailto:tylerburke3@gmail.com"><i id="icons" class="fa fa-envelope-o" aria-hidden="true"></i>Email</a></li> | |
| <li><a class="drop" href="www.linkedin.com/in/tyler-burke-149ab31a3"><i id="icons" class="fa fa-linkedin" aria-hidden="true"></i>Linkedin</a></li> | |
| </ul> | |
| </li> | |
| </ul> | |
| </nav> | |
| <div class="center"> | |
| <div class="drop-menu2"> | |
| <p id="aboutInfo">Hello,</p> | |
| <p id="aboutInfo">Welcome to my page! I have chosen a few of my favored pieces to display my craft below. Currently, I am attending the University of Connecticut as | |
| a Digital Media and Design student. I am on a focused concentration of Web & Interactive Media Design. </p> | |
| <p id="aboutInfo">I have a passion for art and creating detailed illustrations. For me, conveying emotion and making an observer feel a certain type of way is the most rewarding | |
| aspect of drawing. To do this, I shape my artwork to exposes a certain emotion leaving a lingering impression on a person. Such as picking a certain subject | |
| matter and implementing hidden messages underneath the broader picture. Interpretation of these messages are totally individualized for the viewer. Art has the power to | |
| transform, to educate, inspire and motivate others. It is a significant feature of my life and has altered the way I view this world.</p> | |
| <p id="aboutInfo"> Thank you for taking some time to read a little about me.</p> | |
| <p id="aboutInfo">Enjoy some art!</p> | |
| </div> | |
| </div> | |
| <div class="center"> | |
| <div class ="artwork"> | |
| <div class="l show-on-scroll"> | |
| <a href="../cssShowcase/img/art2.jpg" data-lightbox="mygallery" data-title="Gold Miner"><img src="../cssShowcase/img/art2.jpg" alt="Boy picking nose"></a> | |
| </div> | |
| <div class="s show-on-scroll"> | |
| <a href="../cssShowcase/img/art1.jpg" data-lightbox="mygallery" data-title="Broken Mind"><img src="../cssShowcase/img/art1.jpg" alt="Broken mind"></a> | |
| </div> | |
| <div class="s show-on-scroll"> | |
| <a href="../cssShowcase/img/art4.JPG" data-lightbox="mygallery" data-title="Italian Nude Figure Study"><img src="../cssShowcase/img/art4.JPG" alt="Nude figure drawing"></a> | |
| </div> | |
| <div class="m show-on-scroll"> | |
| <a href="../cssShowcase/img/art12.jpg" data-lightbox="mygallery" data-title="Empty"><img src="../cssShowcase/img/art12.jpg" alt="Empty"></a> | |
| </div> | |
| <div class="m show-on-scroll"> | |
| <a href="../cssShowcase/img/art5.jpg" data-lightbox="mygallery" data-title="Still Life"><img src="../cssShowcase/img/art5.jpg" alt="Still life"></a> | |
| </div> | |
| <div class="s show-on-scroll"> | |
| <a href="../cssShowcase/img/art3.jpg" data-lightbox="mygallery" data-title="Sinking"><img src="../cssShowcase/img/art3.jpg" alt="Sinking"></a> | |
| </div> | |
| <div class="l show-on-scroll"> | |
| <a href="../cssShowcase/img/art6.jpg" data-lightbox="mygallery" data-title="Hidden"><img src="../cssShowcase/img/art6.jpg" alt="Hidden"></a> | |
| </div> | |
| <div class="s show-on-scroll"> | |
| <a href="../cssShowcase/img/art8.jpg" data-lightbox="mygallery" data-title="Still Life"><img src="../cssShowcase/img/art8.jpg" alt="Still Life"></a> | |
| </div> | |
| <div class="m show-on-scroll"> | |
| <a href="../cssShowcase/img/art9.jpg" data-lightbox="mygallery" data-title="Reflecting"><img src="../cssShowcase/img/art9.jpg" alt="Reflecting"></a> | |
| </div> | |
| <div class="m show-on-scroll"> | |
| <a href="../cssShowcase/img/art10.jpg" data-lightbox="mygallery" data-title="Mirror"><img src="../cssShowcase/img/art10.jpg" alt="Mirror"></a> | |
| </div> | |
| <div class="l show-on-scroll"> | |
| <a href="../cssShowcase/img/art7.jpg" data-lightbox="mygallery" data-title="Jon Snow"><img src="../cssShowcase/img/art7.jpg" alt="Jon Snow"></a> | |
| </div> | |
| <div class="s show-on-scroll"> | |
| <a href="../cssShowcase/img/art11.JPG" data-lightbox="mygallery" data-title="Justin"><img src="../cssShowcase/img/art11.JPG" alt="Justin"></a> | |
| </div> | |
| <div class="s show-on-scroll"> | |
| <a href="../cssShowcase/img/art13.jpg" data-lightbox="mygallery" data-title="Eye"><img src="../cssShowcase/img/art13.jpg" alt="Eye"></a> | |
| </div> | |
| </div> | |
| </div> | |
| <script src="https://use.fontawesome.com/0e60a59edb.js"></script> | |
| <script src="newJS.js"></script> | |
| <script src="https://code.jquery.com/jquery-3.4.1.js"></script> | |
| <script type="text/javascript"> | |
| $(document).ready(function(){ | |
| $("#contact").click(function(){ | |
| $("ul").toggleClass("active") | |
| }) | |
| }); | |
| $(document).ready(function(){ | |
| $("#about").click(function(){ | |
| $("div").toggleClass("active") | |
| }) | |
| }); | |
| $(window).on("load", function(){ | |
| $(".loader-wrapper").fadeOut("slow"); | |
| }); | |
| </script> | |
| <script src="main.js"></script> | |
| </body> | |
| </html> |