New Plan! Reduce the interactivity and complexity a lot
parent
e24c1e32b7
commit
c3d9e61948
@ -1,104 +1,157 @@
|
||||
# Byte-compiled / optimized / DLL files
|
||||
__pycache__/
|
||||
*.py[cod]
|
||||
*$py.class
|
||||
|
||||
# C extensions
|
||||
*.so
|
||||
|
||||
# Distribution / packaging
|
||||
.Python
|
||||
build/
|
||||
develop-eggs/
|
||||
dist/
|
||||
downloads/
|
||||
eggs/
|
||||
.eggs/
|
||||
lib/
|
||||
lib64/
|
||||
parts/
|
||||
sdist/
|
||||
var/
|
||||
wheels/
|
||||
*.egg-info/
|
||||
.installed.cfg
|
||||
*.egg
|
||||
MANIFEST
|
||||
|
||||
# PyInstaller
|
||||
# Usually these files are written by a python script from a template
|
||||
# before PyInstaller builds the exe, so as to inject date/other infos into it.
|
||||
*.manifest
|
||||
*.spec
|
||||
|
||||
# Installer logs
|
||||
pip-log.txt
|
||||
pip-delete-this-directory.txt
|
||||
|
||||
# Unit test / coverage reports
|
||||
htmlcov/
|
||||
.tox/
|
||||
.coverage
|
||||
.coverage.*
|
||||
.cache
|
||||
nosetests.xml
|
||||
coverage.xml
|
||||
*.cover
|
||||
.hypothesis/
|
||||
.pytest_cache/
|
||||
|
||||
# Translations
|
||||
*.mo
|
||||
*.pot
|
||||
|
||||
# Django stuff:
|
||||
*.log
|
||||
local_settings.py
|
||||
db.sqlite3
|
||||
|
||||
# Flask stuff:
|
||||
instance/
|
||||
.webassets-cache
|
||||
|
||||
# Scrapy stuff:
|
||||
.scrapy
|
||||
|
||||
# Sphinx documentation
|
||||
docs/_build/
|
||||
|
||||
# PyBuilder
|
||||
target/
|
||||
|
||||
# Jupyter Notebook
|
||||
.ipynb_checkpoints
|
||||
|
||||
# pyenv
|
||||
.python-version
|
||||
|
||||
# celery beat schedule file
|
||||
celerybeat-schedule
|
||||
|
||||
# SageMath parsed files
|
||||
*.sage.py
|
||||
|
||||
# Environments
|
||||
.env
|
||||
.venv
|
||||
env/
|
||||
venv/
|
||||
ENV/
|
||||
env.bak/
|
||||
venv.bak/
|
||||
|
||||
# Spyder project settings
|
||||
.spyderproject
|
||||
.spyproject
|
||||
|
||||
# Rope project settings
|
||||
.ropeproject
|
||||
|
||||
# mkdocs documentation
|
||||
/site
|
||||
|
||||
# mypy
|
||||
.mypy_cache/
|
||||
|
||||
# Created by https://www.gitignore.io/api/sass,webstorm,jetbrains+all
|
||||
# Edit at https://www.gitignore.io/?templates=sass,webstorm,jetbrains+all
|
||||
|
||||
### JetBrains+all ###
|
||||
# Covers JetBrains IDEs: IntelliJ, RubyMine, PhpStorm, AppCode, PyCharm, CLion, Android Studio and WebStorm
|
||||
# Reference: https://intellij-support.jetbrains.com/hc/en-us/articles/206544839
|
||||
|
||||
# User-specific stuff
|
||||
.idea/**/workspace.xml
|
||||
.idea/**/tasks.xml
|
||||
.idea/**/usage.statistics.xml
|
||||
.idea/**/dictionaries
|
||||
.idea/**/shelf
|
||||
|
||||
# Generated files
|
||||
.idea/**/contentModel.xml
|
||||
|
||||
# Sensitive or high-churn files
|
||||
.idea/**/dataSources/
|
||||
.idea/**/dataSources.ids
|
||||
.idea/**/dataSources.local.xml
|
||||
.idea/**/sqlDataSources.xml
|
||||
.idea/**/dynamic.xml
|
||||
.idea/**/uiDesigner.xml
|
||||
.idea/**/dbnavigator.xml
|
||||
|
||||
# Gradle
|
||||
.idea/**/gradle.xml
|
||||
.idea/**/libraries
|
||||
|
||||
# Gradle and Maven with auto-import
|
||||
# When using Gradle or Maven with auto-import, you should exclude module files,
|
||||
# since they will be recreated, and may cause churn. Uncomment if using
|
||||
# auto-import.
|
||||
# .idea/modules.xml
|
||||
# .idea/*.iml
|
||||
# .idea/modules
|
||||
# *.iml
|
||||
# *.ipr
|
||||
|
||||
# CMake
|
||||
cmake-build-*/
|
||||
|
||||
# Mongo Explorer plugin
|
||||
.idea/**/mongoSettings.xml
|
||||
|
||||
# File-based project format
|
||||
*.iws
|
||||
|
||||
# IntelliJ
|
||||
out/
|
||||
|
||||
# mpeltonen/sbt-idea plugin
|
||||
.idea_modules/
|
||||
|
||||
# JIRA plugin
|
||||
atlassian-ide-plugin.xml
|
||||
|
||||
# Cursive Clojure plugin
|
||||
.idea/replstate.xml
|
||||
|
||||
# Crashlytics plugin (for Android Studio and IntelliJ)
|
||||
com_crashlytics_export_strings.xml
|
||||
crashlytics.properties
|
||||
crashlytics-build.properties
|
||||
fabric.properties
|
||||
|
||||
# Editor-based Rest Client
|
||||
.idea/httpRequests
|
||||
|
||||
# Android studio 3.1+ serialized cache file
|
||||
.idea/caches/build_file_checksums.ser
|
||||
|
||||
### JetBrains+all Patch ###
|
||||
# Ignores the whole .idea folder and all .iml files
|
||||
# See https://github.com/joeblau/gitignore.io/issues/186 and https://github.com/joeblau/gitignore.io/issues/360
|
||||
|
||||
.idea/
|
||||
|
||||
# Reason: https://github.com/joeblau/gitignore.io/issues/186#issuecomment-249601023
|
||||
|
||||
*.iml
|
||||
modules.xml
|
||||
.idea/misc.xml
|
||||
*.ipr
|
||||
|
||||
# Sonarlint plugin
|
||||
.idea/sonarlint
|
||||
|
||||
### Sass ###
|
||||
.sass-cache/
|
||||
*.css.map
|
||||
*.sass.map
|
||||
*.scss.map
|
||||
|
||||
### WebStorm ###
|
||||
# Covers JetBrains IDEs: IntelliJ, RubyMine, PhpStorm, AppCode, PyCharm, CLion, Android Studio and WebStorm
|
||||
# Reference: https://intellij-support.jetbrains.com/hc/en-us/articles/206544839
|
||||
|
||||
# User-specific stuff
|
||||
|
||||
# Generated files
|
||||
|
||||
# Sensitive or high-churn files
|
||||
|
||||
# Gradle
|
||||
|
||||
# Gradle and Maven with auto-import
|
||||
# When using Gradle or Maven with auto-import, you should exclude module files,
|
||||
# since they will be recreated, and may cause churn. Uncomment if using
|
||||
# auto-import.
|
||||
# .idea/modules.xml
|
||||
# .idea/*.iml
|
||||
# .idea/modules
|
||||
# *.iml
|
||||
# *.ipr
|
||||
|
||||
# CMake
|
||||
|
||||
# Mongo Explorer plugin
|
||||
|
||||
# File-based project format
|
||||
|
||||
# IntelliJ
|
||||
|
||||
# mpeltonen/sbt-idea plugin
|
||||
|
||||
# JIRA plugin
|
||||
|
||||
# Cursive Clojure plugin
|
||||
|
||||
# Crashlytics plugin (for Android Studio and IntelliJ)
|
||||
|
||||
# Editor-based Rest Client
|
||||
|
||||
# Android studio 3.1+ serialized cache file
|
||||
|
||||
### WebStorm Patch ###
|
||||
# Comment Reason: https://github.com/joeblau/gitignore.io/issues/186#issuecomment-215987721
|
||||
|
||||
# *.iml
|
||||
# modules.xml
|
||||
# .idea/misc.xml
|
||||
# *.ipr
|
||||
|
||||
# Sonarlint plugin
|
||||
.idea/**/sonarlint/
|
||||
|
||||
# SonarQube Plugin
|
||||
.idea/**/sonarIssues.xml
|
||||
|
||||
# Markdown Navigator plugin
|
||||
.idea/**/markdown-navigator.xml
|
||||
.idea/**/markdown-navigator/
|
||||
|
||||
# End of https://www.gitignore.io/api/sass,webstorm,jetbrains+all
|
||||
@ -0,0 +1,10 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>About Me</title>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -0,0 +1,10 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Contact Me</title>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -1,95 +1,40 @@
|
||||
.jumbotron {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#UpperCarousel {
|
||||
width: 70%;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
#LowerCarousel {
|
||||
width: 70%;
|
||||
margin: auto;
|
||||
}
|
||||
.header {
|
||||
overflow: hidden;
|
||||
background-color: lightgrey;
|
||||
padding: 20px 10px; }
|
||||
|
||||
.carousel-cell {
|
||||
width: 66%;
|
||||
background: #ffffff;
|
||||
margin-right: 10px;
|
||||
height: 60px;
|
||||
line-height: 1.5;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.carousel-cell-content {
|
||||
color: #2E2E2E;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.grid-item {
|
||||
width: 30%;
|
||||
.header a {
|
||||
float: left;
|
||||
height: auto;
|
||||
background: #e6e5e4;
|
||||
border: 2px solid #b6b5b4;
|
||||
margin: 5px;
|
||||
color: black;
|
||||
text-align: center;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.grid {
|
||||
align-content: center;
|
||||
}
|
||||
|
||||
.student {
|
||||
border-width: 4px;
|
||||
background-color: #ef9a9a;
|
||||
border-radius: 5px;
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
.developer {
|
||||
border-width: 4px;
|
||||
background-color: #81d4fa;
|
||||
border-radius: 5px;
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
.person {
|
||||
border-width: 4px;
|
||||
background-color: #66bb6a;
|
||||
border-radius: 5px;
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
.python {
|
||||
border-width: 4px;
|
||||
border-top-color: #FFD43B;
|
||||
border-bottom-color: #FFD43B;
|
||||
border-left-color: #306998;
|
||||
border-right-color: #306998;
|
||||
border-style: solid;
|
||||
}
|
||||
|
||||
.unity {
|
||||
border-width: 4px;
|
||||
border-top-color: #000000;
|
||||
border-bottom-color: #000000;
|
||||
border-left-color: #dddddd;
|
||||
border-right-color: #dddddd;
|
||||
border-style: solid;
|
||||
}
|
||||
|
||||
.friends {
|
||||
border-width: 4px;
|
||||
border-top-color: #33691e;
|
||||
border-bottom-color: #33691e;
|
||||
border-left-color: #283593;
|
||||
border-right-color: #283593;
|
||||
border-style: solid;
|
||||
}
|
||||
padding: 12px;
|
||||
text-decoration: none;
|
||||
font-size: 18px;
|
||||
line-height: 25px;
|
||||
border-radius: 4px; }
|
||||
|
||||
.header a.name {
|
||||
font-size: 25px;
|
||||
font-weight: bold; }
|
||||
|
||||
.header a:hover {
|
||||
background-color: #dddddd;
|
||||
color: black; }
|
||||
|
||||
.header a:active {
|
||||
background-color: dodgerblue;
|
||||
color: white; }
|
||||
|
||||
.header-right {
|
||||
float: right; }
|
||||
|
||||
@media screen and (max-width: 500px) {
|
||||
.header a {
|
||||
float: none;
|
||||
display: block;
|
||||
text-align: left; }
|
||||
|
||||
.header-right {
|
||||
float: none; } }
|
||||
|
||||
/*# sourceMappingURL=index.css.map */
|
||||
|
||||
@ -1 +1,7 @@
|
||||
{"version":3,"sourceRoot":"","sources":["../sass/index.sass"],"names":[],"mappings":"AAMA;EACE;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EA1BA;EACA;EACA;EACA;;;AA2BF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA","file":"index.css"}
|
||||
{
|
||||
"version": 3,
|
||||
"mappings": "AAEA,OAAO;EACL,QAAQ,EAAE,MAAM;EAChB,gBAAgB,EAAE,SAAS;EAC3B,OAAO,EAAE,SAAS;;AAEpB,SAAS;EACP,KAAK,EAAE,IAAI;EACX,KAAK,EAAE,KAAK;EACZ,UAAU,EAAE,MAAM;EAClB,OAAO,EAAE,IAAI;EACb,eAAe,EAAE,IAAI;EACrB,SAAS,EAAE,IAAI;EACf,WAAW,EAAE,IAAI;EACjB,aAAa,EAAE,GAAG;;AAEpB,cAAc;EACZ,SAAS,EAAE,IAAI;EACf,WAAW,EAAE,IAAI;;AAEnB,eAAe;EACb,gBAAgB,EAAE,OAAO;EACzB,KAAK,EAAE,KAAK;;AAEd,gBAAgB;EACd,gBAAgB,EAAE,UAAU;EAC5B,KAAK,EAAE,KAAK;;AAEd,aAAa;EACX,KAAK,EAAE,KAAK;;AAEd,oCAA4C;EAC1C,SAAS;IACP,KAAK,EAAE,IAAI;IACX,OAAO,EAAE,KAAK;IACd,UAAU,EAAE,IAAI;;EAElB,aAAa;IACX,KAAK,EAAE,IAAI",
|
||||
"sources": ["../sass/index.sass"],
|
||||
"names": [],
|
||||
"file": "index.css"
|
||||
}
|
||||
|
||||
@ -1,224 +1,23 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta content="width=device-width, initial-scale=1" name="viewport">
|
||||
<meta content="Jake Cover's Homepage" name="description">
|
||||
<title>Jake Cover</title>
|
||||
|
||||
<!-- Mobile Stuff -->
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
|
||||
<!-- Generic CSS for other things -->
|
||||
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
|
||||
integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
|
||||
crossorigin="anonymous"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"
|
||||
integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1"
|
||||
crossorigin="anonymous"></script>
|
||||
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
|
||||
integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM"
|
||||
crossorigin="anonymous"></script>
|
||||
|
||||
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
|
||||
integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
|
||||
<link rel="stylesheet" href="https://unpkg.com/flickity@2/dist/flickity.min.css">
|
||||
<script src="https://unpkg.com/flickity@2/dist/flickity.pkgd.min.js"></script>
|
||||
<script src="https://unpkg.com/isotope-layout@3/dist/isotope.pkgd.min.js"></script>
|
||||
<script src="https://unpkg.com/packery@2/dist/packery.pkgd.min.js"></script>
|
||||
<script src="./scripts/packery-mode.pkgd.min.js"></script>
|
||||
<script src="./scripts/filter_on_flickity.js"></script>
|
||||
|
||||
<!-- Custom CSS -->
|
||||
<link rel="stylesheet" href="./css/index.css">
|
||||
</link>
|
||||
|
||||
<link href="css/index.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="container">
|
||||
<div class="jumbotron">
|
||||
<h1>Hi!</h1>
|
||||
<h3>I'm <b>Jake Cover</b>, a</h3><br>
|
||||
<div id="UpperCarousel">
|
||||
<div class="upper-main-carousel">
|
||||
<div class="carousel-cell developer">
|
||||
<h3 class="carousel-cell-content">
|
||||
Developer
|
||||
</h3>
|
||||
</div>
|
||||
<div class="carousel-cell student">
|
||||
<h3 class="carousel-cell-content">
|
||||
Student
|
||||
</h3>
|
||||
</div>
|
||||
<div class="carousel-cell person">
|
||||
<h3 class="carousel-cell-content">
|
||||
Person
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
$('.upper-main-carousel').flickity({
|
||||
wrapAround: true,
|
||||
autoPlay: 3000,
|
||||
pageDots: false,
|
||||
on: {
|
||||
change: function (index) {
|
||||
console.log("Upper: " + index)
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
<button onclick="">Clike ME!</button>
|
||||
</div>
|
||||
<br>
|
||||
<h3>Who likes</h3><br>
|
||||
<div id="LowerCarousel">
|
||||
<div class="lower-main-carousel">
|
||||
<div class="carousel-cell python">
|
||||
<h3 class="carousel-cell-content">
|
||||
Python
|
||||
</h3>
|
||||
</div>
|
||||
<div class="carousel-cell unity">
|
||||
<h3 class="carousel-cell-content">
|
||||
Unity
|
||||
</h3>
|
||||
</div>
|
||||
<div class="carousel-cell games">
|
||||
<h3 class="carousel-cell-content">
|
||||
FPS Games
|
||||
</h3>
|
||||
</div>
|
||||
<div class="carousel-cell people">
|
||||
<h3 class="carousel-cell-content">
|
||||
People
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
$('.lower-main-carousel').flickity({
|
||||
wrapAround: true,
|
||||
autoPlay: 2000,
|
||||
pageDots: false,
|
||||
on: {
|
||||
change: function (index) {
|
||||
switch (index) {
|
||||
case 0:
|
||||
$('.grid').isotope({ filter: '.python' });
|
||||
break;
|
||||
case 1:
|
||||
$('.grid').isotope({ filter: '.unity' });
|
||||
break;
|
||||
case 2:
|
||||
$('.grid').isotope({ filter: '.people' });
|
||||
break;
|
||||
case 3:
|
||||
$('.grid').isotope({ filter: '.games' });
|
||||
break;
|
||||
}
|
||||
console.log("Lower: " + index)
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid">
|
||||
<div class="grid-item python developer">
|
||||
<h5>1 Distest</h5>
|
||||
<p>
|
||||
This is a really cool project!
|
||||
|
||||
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the
|
||||
industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type
|
||||
and scrambled it to make a type specimen book. It has survived not only five centuries, but also the
|
||||
leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s
|
||||
with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop
|
||||
publishing software like Aldus PageMaker including versions of Lorem Ipsum.
|
||||
</p>
|
||||
</div>
|
||||
<div class="grid-item python developer">
|
||||
<h5>2 ReplyBot</h5>
|
||||
<p>
|
||||
This is a really cool project!
|
||||
<br>
|
||||
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the
|
||||
industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type
|
||||
and scrambled it to make a type specimen book. It has survived not only five centuries, but also the
|
||||
leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s
|
||||
with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop
|
||||
publishing software like Aldus PageMaker including versions of Lorem Ipsum.
|
||||
</p>
|
||||
</div>
|
||||
<div class="grid-item developer unity">
|
||||
<h5>3 ForeSight Sports</h5>
|
||||
<p>
|
||||
This is a really cool project!
|
||||
|
||||
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the
|
||||
industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type
|
||||
and scrambled it to make a type specimen book. It has survived not only five centuries, but also the
|
||||
leap into electronic typesetting, remaining essentially unchanged.
|
||||
</p>
|
||||
</div>
|
||||
<div class="grid-item student unity">
|
||||
<h5>4 Unity Club</h5>
|
||||
<p>
|
||||
This is a really cool project!
|
||||
|
||||
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the
|
||||
industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type
|
||||
and scrambled it to make a type specimen book. It has survived not only five centuries, but also the
|
||||
leap into electronic typesetting, remaining essentially unchanged.
|
||||
</p>
|
||||
</div>
|
||||
<div class="grid-item student">
|
||||
<h5>5 Robotics Captain</h5>
|
||||
<p>
|
||||
This is a really cool project!
|
||||
|
||||
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the
|
||||
industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type
|
||||
and scrambled it to make a type specimen book. It has survived not only five centuries, but also the
|
||||
leap into electronic typesetting, remaining essentially unchanged.
|
||||
</p>
|
||||
</div>
|
||||
<div class="grid-item friends person">
|
||||
<h5>6 Telegram</h5>
|
||||
<p>
|
||||
This is a really cool project!
|
||||
<br>
|
||||
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the
|
||||
industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type
|
||||
and scrambled it to make a type specimen book. It has survived not only five centuries, but also the
|
||||
leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s
|
||||
with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop
|
||||
publishing software like Aldus PageMaker including versions of Lorem Ipsum.
|
||||
</p>
|
||||
</div>
|
||||
<div class="grid-item person games">
|
||||
<h5>steam</h5>
|
||||
<p>
|
||||
This is a really cool project!
|
||||
<br>
|
||||
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the
|
||||
industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type
|
||||
and scrambled it to make a type specimen book. It has survived not only five centuries, but also the
|
||||
leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s
|
||||
with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop
|
||||
publishing software like Aldus PageMaker including versions of Lorem Ipsum.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
$('.grid').isotope({
|
||||
itemSelector: '.grid-item',
|
||||
layoutMode: 'fitRows',
|
||||
layoutMode: 'packery',
|
||||
});
|
||||
</script>
|
||||
<header>
|
||||
<a href="index.html" class="name">Jake Cover</a>
|
||||
|
||||
<div class="header-right">
|
||||
<a class="active" href="index.html">Home</a>
|
||||
<a href="contact.html">Contact</a>
|
||||
<a href="about.html">About</a>
|
||||
<a href="https://github.com/JakeCover">GitHub</a>
|
||||
</div>
|
||||
</header>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@ -0,0 +1,86 @@
|
||||
@mixin centerer
|
||||
position: absolute
|
||||
top: 50%
|
||||
left: 50%
|
||||
transform: translate(-50%, -50%)
|
||||
|
||||
.jumbotron
|
||||
text-align: center
|
||||
|
||||
#UpperCarousel
|
||||
width: 70%
|
||||
margin: auto
|
||||
|
||||
#LowerCarousel
|
||||
width: 70%
|
||||
margin: auto
|
||||
|
||||
|
||||
.carousel-cell
|
||||
width: 66%
|
||||
background: #ffffff
|
||||
margin-right: 10px
|
||||
height: 60px
|
||||
line-height: 1.5
|
||||
border-radius: 5px
|
||||
|
||||
.carousel-cell-content
|
||||
color: #2E2E2E
|
||||
@include centerer
|
||||
|
||||
// Grid Info
|
||||
.grid-item
|
||||
width: 30%
|
||||
float: left
|
||||
height: auto
|
||||
background: #e6e5e4
|
||||
border: 2px solid #b6b5b4
|
||||
margin: 5px
|
||||
text-align: center
|
||||
border-radius: 5px
|
||||
|
||||
.grid
|
||||
align-content: center
|
||||
|
||||
.student
|
||||
border-width: 4px
|
||||
background-color: #ef9a9a
|
||||
border-radius: 5px
|
||||
border-style: none
|
||||
|
||||
.developer
|
||||
border-width: 4px
|
||||
background-color: #81d4fa
|
||||
border-radius: 5px
|
||||
border-style: none
|
||||
|
||||
.person
|
||||
border-width: 4px
|
||||
background-color: #66bb6a
|
||||
border-radius: 5px
|
||||
border-style: none
|
||||
|
||||
.python
|
||||
border-width: 4px
|
||||
border-top-color: #FFD43B
|
||||
border-bottom-color: #FFD43B
|
||||
border-left-color: #306998
|
||||
border-right-color: #306998
|
||||
border-style: solid
|
||||
|
||||
.unity
|
||||
border-width: 4px
|
||||
border-top-color: #000000
|
||||
border-bottom-color: #000000
|
||||
border-left-color: #dddddd
|
||||
border-right-color: #dddddd
|
||||
border-style: solid
|
||||
|
||||
.friends
|
||||
border-width: 4px
|
||||
border-top-color: #33691e
|
||||
border-bottom-color: #33691e
|
||||
border-left-color: #283593
|
||||
border-right-color: #283593
|
||||
border-style: solid
|
||||
|
||||
@ -1,86 +1,40 @@
|
||||
@mixin centerer
|
||||
position: absolute
|
||||
top: 50%
|
||||
left: 50%
|
||||
transform: translate(-50%, -50%)
|
||||
|
||||
.jumbotron
|
||||
text-align: center
|
||||
|
||||
#UpperCarousel
|
||||
width: 70%
|
||||
margin: auto
|
||||
|
||||
#LowerCarousel
|
||||
width: 70%
|
||||
margin: auto
|
||||
|
||||
$mobile-break: 500px
|
||||
|
||||
.carousel-cell
|
||||
width: 66%
|
||||
background: #ffffff
|
||||
margin-right: 10px
|
||||
height: 60px
|
||||
line-height: 1.5
|
||||
border-radius: 5px
|
||||
.header
|
||||
overflow: hidden
|
||||
background-color: lightgrey
|
||||
padding: 20px 10px
|
||||
|
||||
.carousel-cell-content
|
||||
color: #2E2E2E
|
||||
@include centerer
|
||||
|
||||
// Grid Info
|
||||
.grid-item
|
||||
width: 30%
|
||||
.header a
|
||||
float: left
|
||||
height: auto
|
||||
background: #e6e5e4
|
||||
border: 2px solid #b6b5b4
|
||||
margin: 5px
|
||||
color: black
|
||||
text-align: center
|
||||
border-radius: 5px
|
||||
|
||||
.grid
|
||||
align-content: center
|
||||
|
||||
.student
|
||||
border-width: 4px
|
||||
background-color: #ef9a9a
|
||||
border-radius: 5px
|
||||
border-style: none
|
||||
|
||||
.developer
|
||||
border-width: 4px
|
||||
background-color: #81d4fa
|
||||
border-radius: 5px
|
||||
border-style: none
|
||||
|
||||
.person
|
||||
border-width: 4px
|
||||
background-color: #66bb6a
|
||||
border-radius: 5px
|
||||
border-style: none
|
||||
|
||||
.python
|
||||
border-width: 4px
|
||||
border-top-color: #FFD43B
|
||||
border-bottom-color: #FFD43B
|
||||
border-left-color: #306998
|
||||
border-right-color: #306998
|
||||
border-style: solid
|
||||
|
||||
.unity
|
||||
border-width: 4px
|
||||
border-top-color: #000000
|
||||
border-bottom-color: #000000
|
||||
border-left-color: #dddddd
|
||||
border-right-color: #dddddd
|
||||
border-style: solid
|
||||
|
||||
.friends
|
||||
border-width: 4px
|
||||
border-top-color: #33691e
|
||||
border-bottom-color: #33691e
|
||||
border-left-color: #283593
|
||||
border-right-color: #283593
|
||||
border-style: solid
|
||||
|
||||
padding: 12px
|
||||
text-decoration: none
|
||||
font-size: 18px
|
||||
line-height: 25px
|
||||
border-radius: 4px
|
||||
|
||||
.header a.name
|
||||
font-size: 25px
|
||||
font-weight: bold
|
||||
|
||||
.header a:hover
|
||||
background-color: #dddddd
|
||||
color: black
|
||||
|
||||
.header a:active
|
||||
background-color: dodgerblue
|
||||
color: white
|
||||
|
||||
.header-right
|
||||
float: right
|
||||
|
||||
@media screen and (max-width: $mobile-break)
|
||||
.header a
|
||||
float: none
|
||||
display: block
|
||||
text-align: left
|
||||
|
||||
.header-right
|
||||
float: none
|
||||
|
||||
@ -1,13 +0,0 @@
|
||||
// var $upper_carousel = $('.upper-main-carousel').flickity();
|
||||
// var $lower_carousel = $('.lower-main-carousel').flickity();
|
||||
|
||||
// function listen_for_upper_selection(event, index) {
|
||||
// console.log(index)
|
||||
// }
|
||||
|
||||
// function listen_for_lower_selection(event, index) {
|
||||
// console.log(index)
|
||||
// }
|
||||
|
||||
// $upper_carousel.on('change.flickity',
|
||||
// $lower_carousel.on('change.flickity', listen_for_lower_selection)
|
||||
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue