updated icons about About page styling
Before Width: | Height: | Size: 7.5 KiB After Width: | Height: | Size: 12 KiB |
Before Width: | Height: | Size: 16 KiB After Width: | Height: | Size: 21 KiB |
Before Width: | Height: | Size: 6.5 KiB After Width: | Height: | Size: 9.9 KiB |
BIN
voicegardens/static/images/STOP-BWW.png
Normal file
After Width: | Height: | Size: 5.1 KiB |
BIN
voicegardens/static/images/up-projects.png
Normal file
After Width: | Height: | Size: 30 KiB |
@ -14,49 +14,21 @@
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Rubik";
|
||||
src: url("fonts/Rubik-Bold.ttf") format("ttf"),
|
||||
url("fonts/rubik-bold-webfont.woff") format("woff"),
|
||||
url("fonts/rubik-bold-webfont.woff2") format("woff2");
|
||||
font-weight: bold;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Rubik";
|
||||
src: url("fonts/Rubik-Regular.ttf") format("ttf");
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Rubik";
|
||||
src: url("fonts/Rubik-Italic.ttf") format("ttf");
|
||||
font-weight: normal;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "PalanquinDark";
|
||||
src: url("fonts/PalanquinDark-Bold.ttf") format("ttf");
|
||||
font-weight: bold;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "PalanquinDark";
|
||||
src: url("fonts/PalanquinDark-Regular.ttf") format("ttf");
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
body {
|
||||
height: 100vh;
|
||||
margin: 0px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: red;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
canvas {
|
||||
display: block;
|
||||
}
|
||||
@ -117,7 +89,7 @@ img.button {
|
||||
height: 100vh;
|
||||
padding: 1em;
|
||||
width: 60%;
|
||||
font-family: sans-serif;
|
||||
font-family: 'Signika', sans-serif;
|
||||
font-size: 1.5em;
|
||||
line-height: 1.5em;
|
||||
overflow: scroll;
|
||||
@ -127,6 +99,10 @@ h1 {
|
||||
line-height: 1em;
|
||||
}
|
||||
|
||||
h3 {
|
||||
padding: 1em 0;
|
||||
}
|
||||
|
||||
.backtoindex img {
|
||||
width: 10%;
|
||||
margin: 0 auto !important;
|
||||
|
@ -172,7 +172,7 @@ function setupRecording() {
|
||||
recordButton.mousePressed(record);
|
||||
recordButton.class("button record");
|
||||
|
||||
stopButton = createImg("../static/images/STOP-BW.png");
|
||||
stopButton = createImg("../static/images/STOP-BWW.png");
|
||||
stopButton.mousePressed(stop);
|
||||
stopButton.class("button stop");
|
||||
|
||||
|
@ -6,6 +6,9 @@
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
<title>voicegardens.org: home</title>
|
||||
<link rel="stylesheet" href="/static/styles.css" type="text/css" media="screen" />
|
||||
<style>
|
||||
@import url('https://fonts.googleapis.com/css?family=Signika&display=swap');
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
@ -18,16 +21,16 @@
|
||||
<h3>1. Key</h3>
|
||||
|
||||
<img class="button button-about" src="../static/images/RECORD-COLOR.png">
|
||||
<h6>Record</h6>
|
||||
<h4>Record</h4>
|
||||
|
||||
<img class="button button-about" src="../static/images/STOP-BW.png">
|
||||
<h6>Stop / Generate shape</h6>
|
||||
<img class="button button-about" src="../static/images/STOP-BWW.png">
|
||||
<h4>Stop / Generate shape</h4>
|
||||
|
||||
<img class="button button-about" src="../static/images/GARDEN-BW.png">
|
||||
<h6>Plant / Load a sound by another visitor</h6>
|
||||
<h4>Plant / Load a sound by another visitor</h4>
|
||||
|
||||
<img class="button button-about" src="../static/images/ABOUT-BW.png">
|
||||
<h6>About</h6>
|
||||
<h4>About</h4>
|
||||
|
||||
<h3>2. About the work</h3>
|
||||
<p>Welcome to <i>Wet Signal Voice Gardens</i>, a growing online landscape and tool to explore the many facets of the human voice! <i>Wet Signal Voice Gardens</i> is a web-based artwork that invites broad participation to investigate the
|
||||
@ -95,7 +98,7 @@
|
||||
79.
|
||||
|
||||
<div class="footer">
|
||||
Supported by <img class="ac" src="../static/images/artscouncil.png"><img class="stimu" src="../static/images/stimu.en.gif"><img class="up" src="../static/images/up-projects.jpg">
|
||||
Supported by <img class="ac" src="../static/images/artscouncil.png"><img class="stimu" src="../static/images/stimu.en.gif"><img class="up" src="../static/images/up-projects.png">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|