adding a page about coding and collaboration

This commit is contained in:
miggymofongo 2024-02-29 00:19:21 -04:00
parent 70cd62453a
commit 553dfbdf96
3 changed files with 403 additions and 5 deletions

163
code.html Normal file
View file

@ -0,0 +1,163 @@
<!DOCTYPE html>
<head>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<title>El Asteroide De Miguel</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous"></link>
<link rel="stylesheet" href="./styles.css"></link>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script>
<script src="https://unpkg.com/htmx.org@1.9.10" integrity="sha384-D1Kt99CQMDuVetoL1lrYwg5t+9QdHe7NLX/SoJYkXDFfX37iInKRy5xLSi8nO7UC" crossorigin="anonymous"></script>
<script src="./scripts.js"></script>
<style>
.center {
display: block;
margin-left: auto;
margin-right: auto;
width: 50%;
}
.photo {
float: left;
}
.btn-dark-custom {
background-color: #343a40; /* Slightly lighter than the default bg-dark */
color: white;
}
.btn-dark-custom:hover {
background-color: #23272b; /* Darken on hover for interaction feedback */
color: white;
}
/* CSS used here will be applied after bootstrap.css */
.jumbotron{
position: relative;
z-index:-2;
}
#video-background {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
overflow: hidden;
z-index: -1;
width:100%;
}
</style>
</head>
</head>
<body>
<header>
<nav class="navbar navbar-dark bg-dark fixed-top">
<div class="container-fluid">
<a class="navbar-brand" href="#">Miguel's Asteroid</a>
<button class="navbar-toggler" type="button" data-bs-toggle="offcanvas" data-bs-target="#offcanvasDarkNavbar" aria-controls="offcanvasDarkNavbar" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="offcanvas offcanvas-end text-bg-dark" tabindex="-1" id="offcanvasDarkNavbar" aria-labelledby="offcanvasDarkNavbarLabel">
<div class="offcanvas-header">
<h5 class="offcanvas-title" id="offcanvasDarkNavbarLabel">Menu</h5>
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="offcanvas" aria-label="Close"></button>
</div>
<div class="offcanvas-body">
<ul class="navbar-nav justify-content-end flex-grow-1 pe-3">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://migs.uber.space/">About</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://yakihonne.com/users/nprofile1qqswe9j5qhs356nps6e8lfz35tluzwtwmeug85h2z8pjl0fvvwvkjespr3mhxue69uhkummnw3ez6vp39eukz6mfdphkumn99e3k7mgpr3mhxue69uhkummnw3ez6vpj9eukz6mfdphkumn99e3k7mgpremhxue69uhkummnw3ez6vpn9ejx7unpveskxar0wfujummjvuq3gamnwvaz7tmjv4kxz7fwv3sk6atn9e5k7qg7waehxw309ahx7um5wgknqv3wv3hhyctxv93hgmmj0yhx7un8rfe7nx">Nostr</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
Collaborate
</a>
<ul class="dropdown-menu dropdown-menu-dark">
<li><a class="dropdown-item" href="#">Content Production</a></li>
<li><a class="dropdown-item" href="#">Code</a></li>
<li><a class="dropdown-item" href="#">Campaign Strategy</a></li>
</ul>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
Resumes
</a>
<ul class="dropdown-menu dropdown-menu-dark">
<li><a class="dropdown-item" href="#">Hospitality</a></li>
<li><a class="dropdown-item" href="#">Public Interest Communications</a></li>
</ul>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
Garden
</a>
<ul class="dropdown-menu dropdown-menu-dark">
<li><a class="dropdown-item" href="#">Library</a></li>
<li><a class="dropdown-item" href="https://migs.uber.space/blog">Chronicles</a></li>
<li><a class="dropdown-item" href="">Quote Shuffler</a></li>
</ul>
</li>
</ul>
</div>
</div>
</div>
</nav>
<section>
<div class="my-5">
<div class="p-5 text-center bg-body-tertiary" style="">
<!--quote shuffler begins-->
<div class="clearfix">
<div id="quoteBanner" class="quote-banner card-footer">
<blockquote class="blockquote mb-0">
<p>Quote goes here</p>
<footer class="blockquote-footer">Someone famous in <cite title="Source Title">Source Title</cite></footer>
</blockquote>
</div>
</div>
</section>
</header>

236
collaborate.html Normal file
View file

@ -0,0 +1,236 @@
<!DOCTYPE html>
<head>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<title>El Asteroide De Miguel</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous"></link>
<link rel="stylesheet" href="./styles.css"></link>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script>
<script src="https://unpkg.com/htmx.org@1.9.10" integrity="sha384-D1Kt99CQMDuVetoL1lrYwg5t+9QdHe7NLX/SoJYkXDFfX37iInKRy5xLSi8nO7UC" crossorigin="anonymous"></script>
<script src="./scripts.js"></script>
<style>
.center {
display: block;
margin-left: auto;
margin-right: auto;
width: 50%;
}
.photo {
float: left;
}
.btn-dark-custom {
background-color: #343a40; /* Slightly lighter than the default bg-dark */
color: white;
}
.btn-dark-custom:hover {
background-color: #23272b; /* Darken on hover for interaction feedback */
color: white;
}
/* CSS used here will be applied after bootstrap.css */
.jumbotron{
position: relative;
z-index:-2;
}
#video-background {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
overflow: hidden;
z-index: -1;
width:100%;
}
</style>
</head>
</head>
<body>
<header>
<nav class="navbar navbar-dark bg-dark fixed-top">
<div class="container-fluid">
<a class="navbar-brand" href="#">Miguel's Asteroid</a>
<button class="navbar-toggler" type="button" data-bs-toggle="offcanvas" data-bs-target="#offcanvasDarkNavbar" aria-controls="offcanvasDarkNavbar" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="offcanvas offcanvas-end text-bg-dark" tabindex="-1" id="offcanvasDarkNavbar" aria-labelledby="offcanvasDarkNavbarLabel">
<div class="offcanvas-header">
<h5 class="offcanvas-title" id="offcanvasDarkNavbarLabel">Menu</h5>
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="offcanvas" aria-label="Close"></button>
</div>
<div class="offcanvas-body">
<ul class="navbar-nav justify-content-end flex-grow-1 pe-3">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://migs.uber.space/">About</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://yakihonne.com/users/nprofile1qqswe9j5qhs356nps6e8lfz35tluzwtwmeug85h2z8pjl0fvvwvkjespr3mhxue69uhkummnw3ez6vp39eukz6mfdphkumn99e3k7mgpr3mhxue69uhkummnw3ez6vpj9eukz6mfdphkumn99e3k7mgpremhxue69uhkummnw3ez6vpn9ejx7unpveskxar0wfujummjvuq3gamnwvaz7tmjv4kxz7fwv3sk6atn9e5k7qg7waehxw309ahx7um5wgknqv3wv3hhyctxv93hgmmj0yhx7un8rfe7nx">Nostr</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
Collaborate
</a>
<ul class="dropdown-menu dropdown-menu-dark">
<li><a class="dropdown-item" href="#">Content Production</a></li>
<li><a class="dropdown-item" href="#">Code</a></li>
<li><a class="dropdown-item" href="#">Campaign Strategy</a></li>
</ul>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
Resumes
</a>
<ul class="dropdown-menu dropdown-menu-dark">
<li><a class="dropdown-item" href="#">Hospitality</a></li>
<li><a class="dropdown-item" href="#">Public Interest Communications</a></li>
</ul>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
Garden
</a>
<ul class="dropdown-menu dropdown-menu-dark">
<li><a class="dropdown-item" href="#">Library</a></li>
<li><a class="dropdown-item" href="https://migs.uber.space/blog">Chronicles</a></li>
<li><a class="dropdown-item" href="">Quote Shuffler</a></li>
</ul>
</li>
</ul>
</div>
</div>
</div>
</nav>
</header>
<section>
<div class="p-5 mb-4 bg-body-tertiary rounded-3">
<div class="container-fluid py-5">
<h1 class="display-5 fw-bold">Welcome to my asteroid.</h1>
<p class="col-md-8 fs-4">Check out my portfolio and explore my digital playground in uberspace.
<a href="https://yakihonne.com/users/nprofile1qyw8wumn8ghj7mn0wd68ytfsxyh8jcttd95x7mnwv5hxxmmdqyw8wumn8ghj7mn0wd68ytfsxgh8jcttd95x7mnwv5hxxmmdqy08wumn8ghj7mn0wd68ytfsxvhxgmmjv9nxzcm5dae8jtn0wfnsz9rhwden5te0wfjkccte9ejxzmt4wvhxjmcpremhxue69uhkummnw3ez6vpj9ejx7unpveskxar0wfujummjvuqzpmyk2sz7zxn2vxrtylay2x30lsfedm083q7jagguxtaa933ej6txsnr0xw"> Find me on Nostr </a>or <a href="mailto:contact@miguelalmodo.com">send an email to
contact@miguelalmodo.com
</a>
</p>
<button class="btn btn-dark-custom btn-lg" type="button" onclick="window.location.href='https://library.miguelalmodo.com';">Library</button>
<button class="btn btn-dark-custom btn-lg" type="button" onclick="window.location.href='https://portfolio.miguelalmodo.com';">Portfolio</button>
<button class="btn btn-dark-custom btn-lg" type="button" onclick="window.location.href='https://library.miguelalmodo.com';">Quote Shuffler</button>
</div>
</div>
</section>
<section>
<button type="button" class="btn btn-dark-custom" data-bs-toggle="modal" data-bs-target="#exampleModal2">
Let's Collaborate
</button>
<div class="modal fade" id="exampleModal2" tabindex="-1" aria-labelledby="exampleModalLabel2" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel2">Public Interest Communications</h5>
<button type="button" class="close" data-bs-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<h4>Society at a Crossroads</h4>
<p>The political division we see today is not by accident. In this dystopic society
mired in controversy, tragedy, and a blatant disregard for our shared humanity,
movements must adopt a robust communication strategy and the power of open
sourced internet protocols. </p>
<h4>Corporate Ownership of the Means of Communication</h4>
<p>Corporate tech corporations have a monopoly on our communications infrastructure.
This gives them unfair power over the mainstream narrative and the ability to
control what is or what is not possible. Antagonizing algorithms and the constant
bombardment of advertising fuel a hyperconsumer that props up a war economy.</p>
<h4>Cocreating Understanding</h4>
<p>The current moment demands that we learn how to talk to each other across political
and cultural divisions and broaden our collective understanding of how communication
influences outcomes beyond "strategic sharing" and fundraising.</p>
</p>
<h4>Communications Infrastructure</h4>
<p>The current moment demands that we learn how to talk to each other across political
and cultural divisions must broaden our collective understanding of how communication influences outcomes
beyond "strategic sharing". We
</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</section>
<section>
<section>
<div class="p-5 mb-4 bg-body-tertiary rounded-3">
<div class="jumbotron">
<video id="video-background" preload="" autoplay="" loop="">
<source src="https://v.nostr.build/vmol.webm" type="video/mp4">
<source src="http://www.w3schools.com/html/mov_bbb.ogg" type="video/ogg">
</video>
</div>
</div>
</section>
</section>
</body>
</html>

View file

@ -302,20 +302,19 @@ $('.container').infiniteScroll({
<section>
<section style="background-color: #23272b;">
<div class="container px-4 py-5" style="background-color: #23272b;">
<h2 class="pb-2 border-bottom quote-banner">Good Communication fuels Good Relationships.</h2>
<h2 class="pb-2 border-bottom quote-banner">Let's collaborate.</h2>
<div class="row row-cols-1 row-cols-md-2 align-items-md-center g-5 py-5">
<div class="d-flex flex-column align-items-start gap-2">
<h3 class="fw-bold" style="color: aliceblue;">Communications for the Public Good</h3>
<p style="color: rgb(255, 255, 255);">The current media landscape looks grim.
If you feel like your messaging is not hitting your audience how it needs to.
Communication should bring people together.
</p>
It's on us to take back the commons from the corporations that are currently
tearing our society apart.</p>
<a href="#" class="btn btn-primary btn-lg">Schedule a Consultation</a>
</div>
<div class="row row-cols-1 row-cols-sm-2 g-4">