Styling Flo's content and creating a copy of the page for Lucy
This commit is contained in:
Jason Williams
parent
15b9b0a4a1
commit
48845160a2
|
|
@ -94,6 +94,9 @@ textarea {
|
|||
--jason-hover-bg-color: #913A50;
|
||||
--jason-hover-fg-color: #FFFFFF;
|
||||
--flo-bg-color: #601F22;
|
||||
--flo-accent-color: #FFE4E1;
|
||||
--flo-hover-bg-color: #00C4FF;
|
||||
--flo-hover-fg-color: #FFFFFF;
|
||||
}
|
||||
|
||||
body {
|
||||
|
|
@ -192,6 +195,27 @@ div {
|
|||
|
||||
.splash.flo, .main.flo {
|
||||
background-color: var(--flo-bg-color);
|
||||
font-family: 'Quicksand', sans-serif;
|
||||
}
|
||||
|
||||
.flo h1 {
|
||||
font-family: 'Marck Script', cursive;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.flo h1 a {
|
||||
text-decoration: none;
|
||||
color: var(--flo-accent-color);
|
||||
}
|
||||
|
||||
.links.flo li a {
|
||||
background-color: var(--flo-accent-color);
|
||||
color: var(--flo-bg-color);
|
||||
}
|
||||
|
||||
.links.flo li a:hover {
|
||||
background-color: var(--flo-hover-bg-color);
|
||||
color: var(--flo-hover-fg-color);
|
||||
}
|
||||
|
||||
@media (orientation: landscape) {
|
||||
|
|
|
|||
|
|
@ -12,11 +12,11 @@
|
|||
<meta property="og:url" content="">
|
||||
<meta property="og:image" content="">
|
||||
|
||||
<link rel="stylesheet" href="css/normalize.css">
|
||||
<link rel="stylesheet" href="css/main.css">
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Cinzel&family=Raleway&display=swap" rel="stylesheet">
|
||||
<link rel="stylesheet" href="/css/normalize.css">
|
||||
<link rel="stylesheet" href="/css/main.css">
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Cinzel&family=Marck+Script&family=Quicksand&family=Raleway&display=swap" rel="stylesheet">
|
||||
|
||||
<meta name="theme-color" content="#fafafa">
|
||||
</head>
|
||||
|
|
@ -52,13 +52,13 @@
|
|||
<div id="main-flo" class="main flo notjason">
|
||||
<div class="col-container">
|
||||
<div id="banner-flo" class="banner flo notjason" data-person="flo">
|
||||
<a href="/flo" class="openlink">Flo Banner</a>
|
||||
<h1><a href="/flo" class="openlink">Flo de Guzman</a></h1>
|
||||
</div>
|
||||
<div id="links-flo" class="links flo notjason">
|
||||
<ul>
|
||||
<li><a href="#"><i class="fa-brands fa-linkedin-in"></i> LinkedIn</a></li>
|
||||
<li><a href="#"><i class="fa-brands fa-instagram"></i> Instagram</a></li>
|
||||
<li><a href="#"><i class="fa-brands fa-facebook-f"></i>Facebook</a></li>
|
||||
<li><a href="#"><i class="fa-brands fa-facebook-f"></i> Facebook</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -72,9 +72,9 @@
|
|||
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.1/jquery.min.js" integrity="sha512-aVKKRRi/Q/YV+4mjoKBsE4x3H+BkegoM/em46NNlCqNTmUYADjBbeNefNxYV7giUp0VxICtqdrbqU7iVaeZNXA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/js/all.min.js" integrity="sha512-rpLlll167T5LJHwp0waJCh3ZRf7pO6IT1+LZOhAyP6phAirwchClbTZV3iqL3BMrVxIYRbzGTpli4rfxsCK6Vw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
||||
<script src="js/vendor/modernizr-3.11.2.min.js"></script>
|
||||
<script src="js/plugins.js"></script>
|
||||
<script src="js/main.js"></script>
|
||||
<script src="/js/vendor/modernizr-3.11.2.min.js"></script>
|
||||
<script src="/js/plugins.js"></script>
|
||||
<script src="/js/main.js"></script>
|
||||
|
||||
<!-- Google Analytics: change UA-XXXXX-Y to be your site's ID. -->
|
||||
<script>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,87 @@
|
|||
<!doctype html>
|
||||
<html class="no-js" lang="">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Welcome to JnF.me</title>
|
||||
<meta name="description" content="">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
|
||||
<meta property="og:title" content="">
|
||||
<meta property="og:type" content="">
|
||||
<meta property="og:url" content="">
|
||||
<meta property="og:image" content="">
|
||||
|
||||
<link rel="stylesheet" href="/css/normalize.css">
|
||||
<link rel="stylesheet" href="/css/main.css">
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Cinzel&family=Marck+Script&family=Quicksand&family=Raleway&display=swap" rel="stylesheet">
|
||||
|
||||
<meta name="theme-color" content="#fafafa">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="container">
|
||||
<div id="splash-jason" class="splash jason notflo">
|
||||
<div class="col-container">
|
||||
<img src="/img/splash-jason.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div id="main-jason" class="main jason notflo">
|
||||
<div class="col-container">
|
||||
<div id="banner-jason" class="banner jason notflo" data-person="jason">
|
||||
<a href="/jason" class="openlink" data-person="jason" data-pos="0vw"><img src="/img/profile-jason.png"></a>
|
||||
<h1><a href="/jason" class="openlink">Jason Williams</a></h1>
|
||||
</div>
|
||||
<div id="links-jason" class="links jason notflo">
|
||||
<ul>
|
||||
<li><a href="https://ja.son-williams.ca"><i class="fa-solid fa-user"></i> Website</a></li>
|
||||
<li><a href="https://ja.son-williams.ca/resume"><i class="fa-solid fa-file"></i> Résumé</a></li>
|
||||
<li><a href="https://www.linkedin.com/in/jaywll/"><i class="fa-brands fa-linkedin-in"></i> LinkedIn</a></li>
|
||||
<li><a href="https://twitter.com/jaywll"><i class="fa-brands fa-twitter"></i> Twitter</a></li>
|
||||
<li><a href="https://mstdn.ca/@jaywll"><i class="fa-brands fa-mastodon"></i> Mastodon</a></li>
|
||||
<li><a href="https://www.instagram.com/jaywll/"><i class="fa-brands fa-instagram"></i> Instagram</a></li>
|
||||
<li><a href="https://jaywll.wordpress.com/category/blog/"><i class="fa-brands fa-wordpress"></i> Blog</a></li>
|
||||
<li><a href="https://code.jaywll.co/explore/repos"><i class="fa-solid fa-code-branch"></i> Code</a></li>
|
||||
<li><a href="https://ja.son-williams.ca/contact"><i class="fa-solid fa-envelope"></i> Contact Me</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="main-flo" class="main flo notjason">
|
||||
<div class="col-container">
|
||||
<div id="banner-flo" class="banner flo notjason" data-person="flo">
|
||||
<h1><a href="/flo" class="openlink">Flo de Guzman</a></h1>
|
||||
</div>
|
||||
<div id="links-flo" class="links flo notjason">
|
||||
<ul>
|
||||
<li><a href="#"><i class="fa-brands fa-linkedin-in"></i> LinkedIn</a></li>
|
||||
<li><a href="#"><i class="fa-brands fa-instagram"></i> Instagram</a></li>
|
||||
<li><a href="#"><i class="fa-brands fa-facebook-f"></i> Facebook</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="splash-flo" class="splash flo notjason">
|
||||
<div class="col-container">
|
||||
Flo Splash
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.1/jquery.min.js" integrity="sha512-aVKKRRi/Q/YV+4mjoKBsE4x3H+BkegoM/em46NNlCqNTmUYADjBbeNefNxYV7giUp0VxICtqdrbqU7iVaeZNXA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/js/all.min.js" integrity="sha512-rpLlll167T5LJHwp0waJCh3ZRf7pO6IT1+LZOhAyP6phAirwchClbTZV3iqL3BMrVxIYRbzGTpli4rfxsCK6Vw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
||||
<script src="/js/vendor/modernizr-3.11.2.min.js"></script>
|
||||
<script src="/js/plugins.js"></script>
|
||||
<script src="/js/main.js"></script>
|
||||
|
||||
<!-- Google Analytics: change UA-XXXXX-Y to be your site's ID. -->
|
||||
<script>
|
||||
window.ga = function () { ga.q.push(arguments) }; ga.q = []; ga.l = +new Date;
|
||||
ga('create', 'UA-XXXXX-Y', 'auto'); ga('set', 'anonymizeIp', true); ga('set', 'transport', 'beacon'); ga('send', 'pageview')
|
||||
</script>
|
||||
<script src="https://www.google-analytics.com/analytics.js" async></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Loading…
Reference in New Issue