Skip to content

Commit

Permalink
info edits, removed google analytics, added contact button and modal
Browse files Browse the repository at this point in the history
  • Loading branch information
complxalgorithm committed Nov 3, 2023
1 parent bb6d95c commit a1a9cf8
Show file tree
Hide file tree
Showing 5 changed files with 77 additions and 25 deletions.
33 changes: 33 additions & 0 deletions assets/js/contact.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
// File: contact.js
// Author: Stephen C Sanders <https://stephensanders.me>
// License: MIT

// Target Contact button
var contactButton = document.getElementById("contact-button");

// Run when Contact button is clicked
contactButton.addEventListener('click', () => {
// Set email address
var asdfg = "scsandman6496"
var hjklp = "gmail.com"
var d = asdfg + "@" + hjklp

// Needed to open default email program
var m = "mail" + "to" + ":"

// Set message
var message = "If you have any questions or professional inquiries, "
message += "feel free to email me at " + "<a href=\"" + m + d + "\" style=\"color:#981A61 !important;\">" + d + "</a>.\n"
message += "I am not necessarily looking for work right now, but am open to working on projects for small businesses.\n"
message += "In any case, I will attempt to get back to you as soon as I can.\nThank you!"

// Create new Popup and set relevant information
const Contact = new Popup({
id: "contact-popup",
title: "Contact",
content: message,
});

// Show the Contact pop-up
Contact.show();
});
2 changes: 1 addition & 1 deletion assets/js/script.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
// File: scripts.js
// File: script.js
// Author: Stephen C Sanders <https://stephensanders.me>
// License: MIT

Expand Down
30 changes: 14 additions & 16 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,8 @@
<title>Stephen C. Sanders</title>

<meta name="author" content="Stephen C. Sanders">
<meta name="description" content="Stephen C. Sanders is a Web Developer, Web Designer, and aspiring GIS Analyst based in Buffalo, New York who specializes in demographics data, cartography, WordPress, HTML/CSS/SCSS, and website administration.">
<meta name="keywords" content="GIS Analyst, ArcGIS Pro, QGIS, Python, web developer, web development, web design, Rochester, Buffalo, New York, HTML, CSS, SCSS, WordPress development, website administration">
<meta name="description" content="Stephen C. Sanders is a Data and GIS Analyst based in Buffalo, New York who specializes in demographics data, crime data, market data, and cartography.">
<meta name="keywords" content="GIS, GIS Analyst, data analyst, demographics, market research, ArcGIS Pro, QGIS, Python, web developer, web development, web design, Rochester, Buffalo, Brockport, New York, HTML, CSS, SCSS, WordPress development, website administration">

<link rel="icon" type="image/jpg" href="assets/img/mi.jpg" />

Expand All @@ -21,17 +21,8 @@
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<link href="styles/assets/ie10-viewport-bug-workaround.css" rel="stylesheet">

<!-- Google Analytics -->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

ga('create', 'UA-77261307-2', 'auto');
ga('send', 'pageview');

</script>
<!-- popup-js -->
<script src="https://cdn.jsdelivr.net/npm/@simondmc/[email protected]/popup.min.js"></script>
</head>

<body id="body">
Expand Down Expand Up @@ -67,6 +58,10 @@ <h5>BUFFALO, NEW YORK</h5>
<a href="https://www.facebook.com/Scsandman4/" target="_blank" class="btn btn-social-icon btn-lg btn-facebook"><i class="fab fa-facebook"><span class="seo-icon">F</span></i></a>
</div>
</div>

<div class="contact-row">
<button class="btn btn-lg" id="contact-button">Contact</button>
</div>
</div>
</div>
</div>
Expand All @@ -86,9 +81,9 @@ <h2 class="sec-header about-header">About Me</h2>
<div class="col-md-6">
<div class="about-text">
<p>I'm Stephen C. Sanders, and I am a data analyst. I completed an A.S. in Geography and Certificate in Geospatial Information Science and Technology at <a href="https://www.monroecc.edu" target="_blank" class="link">Monroe Community College</a>. Previously, I graduated from <a href="https://brockport.edu/" target="_blank" class="link">SUNY Brockport</a>, where I majored in Philosophy and minored in Anthropology.</p>
<p>I have 1.5 years of experience using geographic information systems, especially ArcGIS Pro and QGIS. I have programmed in Python extensively in my work, and can use the ArcPy, Pandas, GeoPandas, and Matplotlib libraries. I also have four years of experience as a web developer, mainly using WordPress, HTML5/CSS3 (SCSS, Bootstrap), JavaScript, and Git. I have also worked as a website administrator for multiple client websites.</p>
<p>I have 1.5 years of experience using geographic information systems, especially ArcGIS Pro and QGIS. I have programmed in Python extensively in my work, and can use the ArcPy, Pandas, GeoPandas, and Plotly libraries. In the past, I worked as a web developer for four years, mainly using WordPress, HTML5/CSS3 (SCSS, Bootstrap), JavaScript, and Git. I also acted as a website administrator for multiple client websites.</p>
<p>The main activity in which I partake outside of GIS is <a href="https://www.wikitree.com/genealogy/Sanders-Family-Tree-11855" target="_blank" class="link">genealogical research</a>. I have been researching my family tree for around five years. I enjoy research involving New York State, veterans of the American Civil War, <a href="https://en.wikipedia.org/wiki/Gottschee" target="_blank" class="link">Gottschee</a>, and Germany.</p>
<p>I am also an amateur philosopher (I have to put my philosophy degree to use somehow). I've written some <a href="https://philpeople.org/profiles/stephen-c-sanders" target="_blank" class="link">neat stuff</a> related to culture, society, and philosophical topics such as epistemology.</p>
<p>I am also an amateur philosopher (I have to put my philosophy degree to use somehow). I've written <a href="https://philpeople.org/profiles/stephen-c-sanders" target="_blank" class="link">some stuff</a> related to culture, society, and philosophical topics such as epistemology.</p>
</div>
</div>
</div>
Expand Down Expand Up @@ -370,7 +365,10 @@ <h5 class="proj-yrs">Jun 2017 - Sep 2017</h5>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<script defer src="https://use.fontawesome.com/releases/v5.3.1/js/all.js"></script>

<!-- Custom JS - mainly animations -->
<!-- Animate main information -->
<script src="assets/js/script.js"></script>

<!-- Contact Module -->
<script src="assets/js/contact.js"></script>
</body>
</html>
2 changes: 1 addition & 1 deletion styles/main.css

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

35 changes: 28 additions & 7 deletions styles/scss/main.scss
Original file line number Diff line number Diff line change
Expand Up @@ -107,12 +107,19 @@ body {

.main-info {
position: relative;
@include transform-y(55%, auto);
@include transform-y(40%, auto);

@media screen and (max-width: 440px) {
top: 30% !important;
@media screen and (max-width: 375px) {
transform: translateY(20%) !important;
}

@media screen and (min-width: 376px) and (max-width: 400px) {
transform: translateY(30%) !important;
}

@media screen and (min-width: 401px) and (max-width: 475px) {
transform: translateY(40%) !important;
}

h1 {
font-size: 55px;
Expand Down Expand Up @@ -174,6 +181,20 @@ body {
}
}
}

.contact-row {
padding: 15px 0;

button {
color: white;
background-color: $secondary-color;
font-family: $main-font;

&:hover {
background-color: $primary-color;
}
}
}
}
}
}
Expand Down Expand Up @@ -313,15 +334,15 @@ body {
}

// MOBILE STYLES
@media screen and (max-width: 379px) {
@media screen and (max-width: 390px) {
.main-info {
h3 {
font-size: 16px !important;
}
}
}

@media screen and (min-width: 380px) and (max-width: 569px) {
@media screen and (min-width: 391px) and (max-width: 569px) {
.main-info {
h1 {
font-size: 40px !important;
Expand Down Expand Up @@ -359,8 +380,8 @@ body {

@media screen and (min-width: 1500px) { // styles for larger monitors
.main-info {
top: 75% !important;
transform: translateY(75%) !important;
top: 65% !important;
transform: translateY(65%) !important;

h1 {
font-size: 75px;
Expand Down

0 comments on commit a1a9cf8

Please sign in to comment.