Amolith 3 years ago
parent
commit
d77e37f31a
Signed by: Amolith
GPG Key ID: 51FD40936DB0065B
  1. 60
      assets/css/main.css
  2. 129
      assets/images/cover.svg
  3. BIN
      assets/images/gideon.jpg
  4. BIN
      assets/images/gideon.png
  5. 73
      contact/index.html
  6. 55
      hosts/index.html
  7. 6
      index.html

60
assets/css/main.css

@ -1,5 +1,4 @@
@import url("../css/fonts.css");
/* @import url("../css/palette.css") */
html {
background-color: #fff;
@ -18,6 +17,12 @@ body {
height: 100%;
width: 80%;
}
.wrapper-page {
text-align: center;
height: 100%;
width: 100%;
margin-top: 40px;
}
.logo {
background: url(../images/logo.svg) no-repeat center;
height: 135px;
@ -28,6 +33,16 @@ body {
margin-top: 25px;
padding: 10px;
}
.logo-page {
background: url(../images/logo.svg) no-repeat center;
height: 15px;
background-size: 90px;
display:flex;
justify-content:center;
align-items:center;
margin-top: 5px;
padding: 10px;
}
.site-title {
font-family: Montserrat;
font-size: 3.3rem;
@ -45,6 +60,36 @@ body {
text-align: inherit;
padding-bottom: 2rem;
}
.menu-top {
margin-top: 30px;
color: #000;
}
.menu-top a {
color: #000;
text-decoration: none;
font-weight: lighter;
font-size: smaller;
}
.menu-top a:hover {
text-decoration: underline;
}
.flex-wrapper {
padding-top: 130px;
flex-wrap: wrap;
display: flex;
flex-direction: row;
}
.flex-wrapper .image img {
border-radius: 50%;
border: 7px solid #000;
width: 20%;
}
.flex-wrapper .text {
display: inline-block;
vertical-align: top;
padding-left: 10vw;
margin-top: -30px;
}
.player {
width: 80%;
padding-bottom: 2.80rem;
@ -125,11 +170,20 @@ body {
background-color: #fff;
color: #323234;
}
.menu-top {
color: #fff;
}
.menu-top a {
color: #fff;
}
.flex-wrapper .image img {
border-color: #fff;
}
}
@media (min-width: 1367px) {
body {
margin-top: 10%;
.wrapper {
margin-top: 17%;
}
.player {
max-width: 50%;

129
assets/images/cover.svg

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 17 KiB

BIN
assets/images/gideon.jpg

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.8 MiB

BIN
assets/images/gideon.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.5 MiB

73
contact/index.html

@ -0,0 +1,73 @@
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>The Musical Ideation Podcast</title>
<meta name="description" content="The Musical Ideation Podcast, hosted by Joshua Marsh and Gideon White, is a podcast all about music, whether that's software, hardware, artists, albums, or pretty much anything else in that realm.">
<link rel="canonical" href="https://musicalideation.com/">
<!-- Social: Twitter -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="The Musical Ideation Podcast" />
<meta name="twitter:description" content="The Musical Ideation Podcast, hosted by Joshua Marsh and Gideon White, is a podcast all about music, whether that's software, hardware, artists, albums, or pretty much anything else in that realm."/>
<meta name="twitter:image" content="assets/images/cover.png" />
<!-- Social: OpenGraph -->
<meta property="og:locale" content="The Musical Ideation Podcast, hosted by Joshua Marsh and Gideon White, is a podcast all about music, whether that's software, hardware, artists, albums, or pretty much anything else in that realm.">
<meta property="og:type" content="article">
<meta property="og:title" content="The Musical Ideation Podcast">
<meta property="og:description" content="">
<meta property="og:url" content="https://musicalideation.com/">
<meta property="og:site_name" content="The Musical Ideation Podcast">
<meta property="og:image" content="assets/images/cover.png" />
<!-- Styles -->
<link rel="stylesheet" href="assets/css/main.css">
<link rel="stylesheet" href="assets/fonts/fork-awesome/css/fork-awesome.min.css">
<link rel="stylesheet" href="assets/css/plyr.css">
</head>
<body>
<div class=wrapper>
<div class="logo">
</div>
<div class="header">
<h1>
<span class="site-title">The Musical Ideation Podcast</span>
<span class="site-subtitle">Hosted by Joshua Marsh and Gideon White</span>
</h1>
</div>
<div class="player">
<audio id="player" controls>
</audio>
</div>
<div class="menu">
<a href="/archive/feed.xml" class="links">
<span><button class="icons" title="RSS Feed"><i class="fa fa-rss" aria-hidden="true"></i></button></span>
<span class="link-text">RSS Feed</span>
</a>
<a href="" class="links">
<span><button class="icons" title="Listen on iTunes"><i class="fa fa-apple" aria-hidden="true"></i></button></span>
<span class="link-text">iTunes</span>
</a>
<a href="/archive" class="links">
<span><button class="icons" title="Archive"><i class="fa fa-bank" aria-hidden="true"></i></button></span>
<span class="link-text">Archive</span>
</a>
<a href="/about" class="links">
<span><button class="icons" title="About the hosts"><i class="fa fa-users" aria-hidden="true"></i></button></span>
<span class="link-text">Hosts</span>
</a>
<a href="/contact" class="links">
<span><button class="icons" title="Contact page"><i class="fa fa-envelope" aria-hidden="true"></i></button></span>
<span class="link-text">Contact</span>
</a>
</div
</div>
<script src="assets/js/plyr.js"></script>
<script>
const player = new Plyr('#player');
</script>
</body>

55
hosts/index.html

@ -0,0 +1,55 @@
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>The Musical Ideation Podcast | Hosts</title>
<meta name="description" content="The Musical Ideation Podcast, hosted by Joshua Marsh and Gideon White, is a podcast all about music, whether that's software, hardware, artists, albums, or pretty much anything else in that realm.">
<link rel="canonical" href="https://musicalideation.com/">
<!-- Social: Twitter -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="The Musical Ideation Podcast | Hosts" />
<meta name="twitter:description" content="The Musical Ideation Podcast, hosted by Joshua Marsh and Gideon White, is a podcast all about music, whether that's software, hardware, artists, albums, or pretty much anything else in that realm."/>
<meta name="twitter:image" content="/assets/images/cover.png" />
<!-- Social: OpenGraph -->
<meta property="og:locale" content="The Musical Ideation Podcast, hosted by Joshua Marsh and Gideon White, is a podcast all about music, whether that's software, hardware, artists, albums, or pretty much anything else in that realm.">
<meta property="og:type" content="article">
<meta property="og:title" content="The Musical Ideation Podcast | Hosts">
<meta property="og:description" content="">
<meta property="og:url" content="https://musicalideation.com/">
<meta property="og:site_name" content="The Musical Ideation Podcast">
<meta property="og:image" content="/assets/images/cover.png" />
<!-- Styles -->
<link rel="stylesheet" href="/assets/css/main.css">
<link rel="stylesheet" href="/assets/fonts/fork-awesome/css/fork-awesome.min.css">
<link rel="stylesheet" href="/assets/css/plyr.css">
</head>
<body>
<div class="wrapper-page">
<div class="header">
<h1>
<span class="site-title">Hosts</span>
<div class="menu-top">
<i class="fa fa-home"></i> <a href="/">Home</a> |
<i class="fa fa-rss"></i> <a href="/archive/feed.xml">RSS Feed</a> |
<i class="fa fa-apple"></i> <a href="/">iTunes</a> |
<i class="fa fa-bank"></i> <a href="/archive/">Archive</a> |
<i class="fa fa-envelope"></i> <a href="/">Contact</a>
</div>
<div class="flex-wrapper">
<div class="image">
<img src="/assets/images/gideon.png" alt="a picture of Joshua Marsh">
</div>
<div class="text">
<h1>Gideon White</h1>
</div>
</div>
</h1>
</div>
</div>
</body>

6
index.html

@ -52,15 +52,15 @@
<span><button class="icons" title="Listen on iTunes"><i class="fa fa-apple" aria-hidden="true"></i></button></span>
<span class="link-text">iTunes</span>
</a>
<a href="/archive" class="links">
<a href="/archive/" class="links">
<span><button class="icons" title="Archive"><i class="fa fa-bank" aria-hidden="true"></i></button></span>
<span class="link-text">Archive</span>
</a>
<a href="/about" class="links">
<a href="/hosts/" class="links">
<span><button class="icons" title="About the hosts"><i class="fa fa-users" aria-hidden="true"></i></button></span>
<span class="link-text">Hosts</span>
</a>
<a href="/contact" class="links">
<a href="/contact/" class="links">
<span><button class="icons" title="Contact page"><i class="fa fa-envelope" aria-hidden="true"></i></button></span>
<span class="link-text">Contact</span>
</a>

Loading…
Cancel
Save