New Plan! Reduce the interactivity and complexity a lot

replace/c3d9e61948508d157f3701d3b6a942d65830a185
Cobular 5 years ago
parent 2311680499
commit 5976f479eb

261
.gitignore vendored

@ -1,104 +1,157 @@
# Byte-compiled / optimized / DLL files
__pycache__/ # Created by https://www.gitignore.io/api/sass,webstorm,jetbrains+all
*.py[cod] # Edit at https://www.gitignore.io/?templates=sass,webstorm,jetbrains+all
*$py.class
### JetBrains+all ###
# C extensions # Covers JetBrains IDEs: IntelliJ, RubyMine, PhpStorm, AppCode, PyCharm, CLion, Android Studio and WebStorm
*.so # Reference: https://intellij-support.jetbrains.com/hc/en-us/articles/206544839
# Distribution / packaging # User-specific stuff
.Python .idea/**/workspace.xml
build/ .idea/**/tasks.xml
develop-eggs/ .idea/**/usage.statistics.xml
dist/ .idea/**/dictionaries
downloads/ .idea/**/shelf
eggs/
.eggs/ # Generated files
lib/ .idea/**/contentModel.xml
lib64/
parts/ # Sensitive or high-churn files
sdist/ .idea/**/dataSources/
var/ .idea/**/dataSources.ids
wheels/ .idea/**/dataSources.local.xml
*.egg-info/ .idea/**/sqlDataSources.xml
.installed.cfg .idea/**/dynamic.xml
*.egg .idea/**/uiDesigner.xml
MANIFEST .idea/**/dbnavigator.xml
# PyInstaller # Gradle
# Usually these files are written by a python script from a template .idea/**/gradle.xml
# before PyInstaller builds the exe, so as to inject date/other infos into it. .idea/**/libraries
*.manifest
*.spec # Gradle and Maven with auto-import
# When using Gradle or Maven with auto-import, you should exclude module files,
# Installer logs # since they will be recreated, and may cause churn. Uncomment if using
pip-log.txt # auto-import.
pip-delete-this-directory.txt # .idea/modules.xml
# .idea/*.iml
# Unit test / coverage reports # .idea/modules
htmlcov/ # *.iml
.tox/ # *.ipr
.coverage
.coverage.* # CMake
.cache cmake-build-*/
nosetests.xml
coverage.xml # Mongo Explorer plugin
*.cover .idea/**/mongoSettings.xml
.hypothesis/
.pytest_cache/ # File-based project format
*.iws
# Translations
*.mo # IntelliJ
*.pot out/
# Django stuff: # mpeltonen/sbt-idea plugin
*.log .idea_modules/
local_settings.py
db.sqlite3 # JIRA plugin
atlassian-ide-plugin.xml
# Flask stuff:
instance/ # Cursive Clojure plugin
.webassets-cache .idea/replstate.xml
# Scrapy stuff: # Crashlytics plugin (for Android Studio and IntelliJ)
.scrapy com_crashlytics_export_strings.xml
crashlytics.properties
# Sphinx documentation crashlytics-build.properties
docs/_build/ fabric.properties
# PyBuilder # Editor-based Rest Client
target/ .idea/httpRequests
# Jupyter Notebook # Android studio 3.1+ serialized cache file
.ipynb_checkpoints .idea/caches/build_file_checksums.ser
# pyenv ### JetBrains+all Patch ###
.python-version # 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
# celery beat schedule file
celerybeat-schedule .idea/
# SageMath parsed files # Reason: https://github.com/joeblau/gitignore.io/issues/186#issuecomment-249601023
*.sage.py
*.iml
# Environments modules.xml
.env .idea/misc.xml
.venv *.ipr
env/
venv/ # Sonarlint plugin
ENV/ .idea/sonarlint
env.bak/
venv.bak/ ### Sass ###
.sass-cache/
# Spyder project settings *.css.map
.spyderproject *.sass.map
.spyproject *.scss.map
# Rope project settings ### WebStorm ###
.ropeproject # Covers JetBrains IDEs: IntelliJ, RubyMine, PhpStorm, AppCode, PyCharm, CLion, Android Studio and WebStorm
# Reference: https://intellij-support.jetbrains.com/hc/en-us/articles/206544839
# mkdocs documentation
/site # User-specific stuff
# mypy # Generated files
.mypy_cache/
# 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 { .header {
text-align: center; overflow: hidden;
} background-color: lightgrey;
padding: 20px 10px; }
#UpperCarousel {
width: 70%;
margin: auto;
}
#LowerCarousel {
width: 70%;
margin: auto;
}
.carousel-cell { .header a {
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%;
float: left; float: left;
height: auto; color: black;
background: #e6e5e4;
border: 2px solid #b6b5b4;
margin: 5px;
text-align: center; text-align: center;
border-radius: 5px; padding: 12px;
} text-decoration: none;
font-size: 18px;
.grid { line-height: 25px;
align-content: center; border-radius: 4px; }
}
.header a.name {
.student { font-size: 25px;
border-width: 4px; font-weight: bold; }
background-color: #ef9a9a;
border-radius: 5px; .header a:hover {
border-style: none; background-color: #dddddd;
} color: black; }
.developer { .header a:active {
border-width: 4px; background-color: dodgerblue;
background-color: #81d4fa; color: white; }
border-radius: 5px;
border-style: none; .header-right {
} float: right; }
.person { @media screen and (max-width: 500px) {
border-width: 4px; .header a {
background-color: #66bb6a; float: none;
border-radius: 5px; display: block;
border-style: none; text-align: left; }
}
.header-right {
.python { float: none; } }
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;
}
/*# sourceMappingURL=index.css.map */ /*# 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> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <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> <title>Jake Cover</title>
<!-- Mobile Stuff --> <link href="css/index.css">
<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>
</head> </head>
<body> <body>
<div class="container"> <header>
<div class="jumbotron"> <a href="index.html" class="name">Jake Cover</a>
<h1>Hi!</h1>
<h3>I'm <b>Jake Cover</b>, a</h3><br> <div class="header-right">
<div id="UpperCarousel"> <a class="active" href="index.html">Home</a>
<div class="upper-main-carousel"> <a href="contact.html">Contact</a>
<div class="carousel-cell developer"> <a href="about.html">About</a>
<h3 class="carousel-cell-content"> <a href="https://github.com/JakeCover">GitHub</a>
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>
</div> </div>
</header>
</body> </body>
</html> </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 $mobile-break: 500px
position: absolute
top: 50%
left: 50%
transform: translate(-50%, -50%)
.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 .header a
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 float: left
height: auto color: black
background: #e6e5e4
border: 2px solid #b6b5b4
margin: 5px
text-align: center text-align: center
border-radius: 5px padding: 12px
text-decoration: none
.grid font-size: 18px
align-content: center line-height: 25px
border-radius: 4px
.student
border-width: 4px .header a.name
background-color: #ef9a9a font-size: 25px
border-radius: 5px font-weight: bold
border-style: none
.header a:hover
.developer background-color: #dddddd
border-width: 4px color: black
background-color: #81d4fa
border-radius: 5px .header a:active
border-style: none background-color: dodgerblue
color: white
.person
border-width: 4px .header-right
background-color: #66bb6a float: right
border-radius: 5px
border-style: none @media screen and (max-width: $mobile-break)
.header a
.python float: none
border-width: 4px display: block
border-top-color: #FFD43B text-align: left
border-bottom-color: #FFD43B
border-left-color: #306998 .header-right
border-right-color: #306998 float: none
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,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…
Cancel
Save