travis/heinstrom.com
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Make card more prominent and fix iOS touch

Browse Source 
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
travis
2026-04-02 16:16:10 -04:00
parent 595a890704
commit 20b4ec5327
2 changed files with 14 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
css/style.css
View File

@@ -41,9 +41,9 @@ body {
.card {
display: block;
position: relative;
max-width: 420px;
width: 80%;
height: 260px;
max-width: 500px;
width: 85%;
height: 300px;
color: #fff;
flex: none;
perspective: 1000px;
@@ -56,8 +56,8 @@ body {
min-height: 100%;
display: block;
position: relative;
background: #111;
border-radius: 3px;
background: linear-gradient(145deg, #161616, #0e0e0e);
border-radius: 5px;
}
.card__figure::before {
@@ -67,10 +67,10 @@ body {
height: calc(100% - 14px);
top: 6px;
left: 6px;
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 2px;
border: 1px solid rgba(255, 255, 255, 0.12);
border-radius: 3px;
pointer-events: none;
box-shadow: 0 30px 20px rgb(0 0 0 / 50%);
box-shadow: 0 30px 40px rgb(0 0 0 / 60%), 0 0 80px rgb(0 0 0 / 30%);
}
.card__deco {
@@ -100,7 +100,7 @@ body {
figcaption {
height: 100%;
padding: 25px;
padding: 30px;
color: #eee;
font-family: Avenir;
display: flex;
@@ -110,9 +110,10 @@ figcaption {
h1 {
margin: 0;
font-size: 3.3rem;
line-height: 3.3rem;
font-size: 3.6rem;
line-height: 3.6rem;
font-weight: 900;
letter-spacing: -0.02em;
}
.links {

3
js/main.js
View File

@@ -105,6 +105,7 @@
};
this.touchmoveFn = function (ev) {
ev.preventDefault();
if (self._gyroActive) return;
var touch = ev.touches[0];
if (!touch) return;
@@ -123,7 +124,7 @@
this.DOM.el.addEventListener("mouseleave", this.mouseleaveFn);
this.DOM.el.addEventListener("mouseenter", this.mouseenterFn);
this.DOM.el.addEventListener("touchstart", this.touchstartFn, { passive: true });
this.DOM.el.addEventListener("touchmove", this.touchmoveFn, { passive: true });
this.DOM.el.addEventListener("touchmove", this.touchmoveFn, { passive: false });
this.DOM.el.addEventListener("touchend", this.debounceLeaveFn);
};