ada/portfoliosketchpine64backup
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Initial test development.

Browse source
This commit is contained in:
Alex Huddleston 2018-01-25 03:34:07 -06:00
parent 20aa6f5260
commit 37b7a5a260
3 changed files with 89 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

34
index.html Normal file
View file

@ -0,0 +1,34 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Portfolio Sketch</title>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.css"></link>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick-theme.css"></link>
<script
src="https://code.jquery.com/jquery-3.3.1.min.js"
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
crossorigin="anonymous"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.js"></script>
<script type="text/javascript" src="main.js"></script>
<link rel="stylesheet" type="text/css" href="main.css">
</head>
<body>
<header class="centered">
<div class="title centered">
<h1><b>Testing...</b></h1>
</div>
</header>
<div class="content">
<div id="top-spacer"></div>
<div class="test-slider slick-slider slick-dotted draggable outer-slider-div">
<div>One</div>
<div>Two</div>
<div>Three</div>
<div>Four</div>
<div>Five</div>
<div>Six</div>
</div>
</div>
</body>
</html>

48
main.css Normal file
View file

@ -0,0 +1,48 @@
@charset "UTF-8";
body {
font-family: sans-serif;
background-color: #55f;
//background-image: url("https://static.pexels.com/photos/375732/pexels-photo-375732.jpeg");
}
header {
position: fixed;
top: 0;
right: 0;
left: 0;
z-index: 1;
color: #999999;
background-color: #292929;
border-color: #101010;
border-style: solid;
border-width: 0;
border-bottom-width: 1px;
}
.content {
margin: auto;
padding: 25px;
width: 900px;
height: 600px;
}
.title {
left: auto;
right: auto;
}
.centered {
margin-left: auto;
margin-right: auto;
}
#top-spacer {
height: 100px;
}
.outer-slider-div {
display: block;
height: 300px;
max-height: 300px;
}

7
main.js Normal file
View file

@ -0,0 +1,7 @@
$(document).ready(function(){
$('.test-slider').slick({
infinite: true,
slidesToShow: 3,
slidesToScroll: 3
});
});