-
Notifications
You must be signed in to change notification settings - Fork 0
/
writings.html
133 lines (116 loc) · 5.13 KB
/
writings.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
<!DOCTYPE html>
<html lang="en"><head>
<meta charset="utf-8">
<title>DANIEL AUSTIN</title>
<link rel="icon" type="image/x-icon" href="/Website Assets/Favicon/Favicon.ico">
<link rel="apple-touch-icon" href="/Website Assets/Favicon/apple-touch-icon.png">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="Daniel Austin, ASTNDSGN, and IMDANIELAUSTIN Is A Multi-Disciplinary Brand Designer, Product Conceptual Artist, Graphic Designer, and Product Designer Based In The Los Angeles, California Area With An Interest In FinTech/Financial Technology, Consumer Product, And Environmental Sustainability.">
<meta property="og:title" content="DANIEL AUSTIN">
<meta property="og:image" content="/Website Assets/iMessagePreview1.png">
<link rel="stylesheet" href="assets/css/styles.css">
<noscript><link rel="stylesheet" href="assets/css/noscript.css"></noscript>
</head>
<body>
<header>
<nav>
<div class="nav-content">
<!-- logo -->
<a href="/index" class="logo">
<span class="symbol">
<img src="/images/ASTNDSGN Logomark Short Animation Alpha Loop Once.gif" alt="" width="30" height="30" style="display: block;">
</span>
</a>
<!-- navigation -->
<div class="nav-icon">
<div class="bar one"></div>
<div class="bar two"></div>
</div>
<!-- naviagtion links -->
<div class="nav-links">
<a href="/"><button>HOME</button></a>
<a href="/About"><button>RÉSUMÉ</button></a>
<a href="/writings"><button>WRITINGS</button></a>
<a><button id="copyEmailBtn">EMAIL ME</button></a>
</div>
</div>
</nav>
</header>
<!-- masthead -->
<main>
<section class="tiles">
<div class="tile tile-1">
<a href="https://example.com/page1"><img src="/images/Cadillac Tile Cover.png" alt="Blog Name — XX/XX/XXXX"></a>
</div>
<div class="tile tile-2">
<a href="https://example.com/page2"><img src="/images/Cadillac Tile Cover.png" alt="Blog Name — XX/XX/XXXX"></a>
</div>
<div class="tile tile-3">
<a href="https://example.com/page3"><img src="/images/Cadillac Tile Cover.png" alt="Blog Name — XX/XX/XXXX"></a>
</div>
</section>
</main>
<button id="myBtn" title="Back to Top" style="padding: 8px; margin: 8px; display: none;">Back to Top</button>
<!-- FOOTER -->
<footer>
<div class="footer">
<pre>© 2016-2024 Daniel Austin, LLC. All rights reserved.</pre>
<a href="/sitemap">Privacy Policy</a>
<a href="/termsofuse">Terms of Use</a>
</div>
</footer>
<!-- Hidden input to hold the email address -->
<input type="text" value="[email protected]" id="emailAddress" style="position: absolute; left: -9999px;">
<script>
document.addEventListener("DOMContentLoaded", function() {
// Back to Top button
const backToTopButton = document.getElementById("myBtn");
// Show the button when scrolling down 20px
window.onscroll = function() {
if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
backToTopButton.style.display = "block";
} else {
backToTopButton.style.display = "none";
}
};
// Scroll to the top when the button is clicked
backToTopButton.onclick = function() {
document.body.scrollTop = 0; // For Safari
document.documentElement.scrollTop = 0; // For Chrome, Firefox, IE and Opera
};
// Copy email to clipboard
const copyEmailBtn = document.getElementById('copyEmailBtn');
const emailAddress = document.getElementById("emailAddress");
if (copyEmailBtn && emailAddress) {
copyEmailBtn.addEventListener('click', function() {
emailAddress.select();
emailAddress.setSelectionRange(0, 99999); // For mobile devices
document.execCommand("copy");
// Alert the copied text (optional)
alert("Copied the email: " + emailAddress.value);
});
}
// Nav
const navIcon = document.querySelector(".nav-icon");
const nav = document.querySelector("nav");
if (navIcon && nav) {
navIcon.onclick = function () {
nav.classList.toggle('show');
};
}
// Filter Posts
function filterPosts(tag) {
const posts = document.querySelectorAll('.blog-post');
posts.forEach(post => {
const tags = post.getAttribute('data-tags').split(', ');
if (tag === 'all' || tags.includes(tag)) {
post.style.display = 'block';
} else {
post.style.display = 'none';
}
});
}
window.filterPosts = filterPosts; // Expose the function to global scope if needed
});
</script>
<script src="scripts.js"></script>