cynic
/
frontend
mirror of https://github.com/kurisufriend/frontend
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

added dropdown menu and about section

Browse Source
master
zhetic 4 years ago
parent ce546e1adf
commit 869697990e
5 changed files with 96 additions and 15 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 29
      about.html
  2. 10
      catalog.html
  3. 44
      css/stylesheet.css
  4. 10
      search.html
  5. 10
      title.html

29
about.html
Unescape View File

@ -8,7 +8,15 @@
</head>
<body>
<div id="header">
<a href="./catalog.html"><img id="home" src="img/home.png"/></a>
<div id="menu">
<img id="menu-icon" src="img/home.png"/>
<div id="menu-items">
<a href="./catalog.html">Catalog</a>
<a href="./search.html">Search</a>
<a href="">Tags</a>
<a href="./about.html">About</a>
</div>
</div>
<form action="/search.html">
<input id="search_bar" type="search" name="title" placeholder="Search">
<button id="search_button" type="submit">Search</button>
@ -17,8 +25,23 @@
</div>
<div id="content">
<div style="position:relative;top:20px;">
<p>Instance address:</p>
<div style="display:block">
<h2>About</h2>
<p>
This site is licensed under the MIT free software license, and is accessible through <a href="https://github.com/a-manga-thing"><u>our github</u></a>.
</p>
<p>
Mangaloid operates as a network of instances, each serving a subset of manga. Our example interface pulls all it's metadata from the <a href="https://test.cynic.moe/info"><u>REST api</u></a> of one of these hosts. You are free to host your own instance or interface as you see fit.
</p>
<p>
Images are stored and loaded in a distributed manner via a number of <a href="https://ipfs.io"><u>IPFS</u></a> nodes and gateways hosted by volunteers. The easiest way to improve loading times is to host your own node.
</p>
<p>
Feel free to stop by our IRC channel if you have questions: irc.rizon.net #mangaloid
</p>
</div>
<div style="display:block;position:relative;">
<h2>Instance address:</h2>
<input style="width:500px" id="address" placeholder="test.cynic.moe"></input>
<button onclick="update_address()">Update</button>
<button onclick="clear_instance()">Default</button>

10
catalog.html
Unescape View File

@ -9,7 +9,15 @@
</head>
<body>
<div id="header">
<a href="./catalog.html"><img id="home" src="img/home.png"/></a>
<div id="menu">
<img id="menu-icon" src="img/home.png"/>
<div id="menu-items">
<a href="./catalog.html">Catalog</a>
<a href="./search.html">Search</a>
<a href="">Tags</a>
<a href="./about.html">About</a>
</div>
</div>
<form action="/search.html">
<input id="search_bar" type="search" name="title" placeholder="Search">
<button id="search_button" type="submit">Search</button>

44
css/stylesheet.css
Unescape View File

@ -61,11 +61,45 @@ a:visited {
overflow: hidden;
}
#header #home {
position: relative;
height: 40%;
top: 30%;
left: 2em;
#header #menu {
position: fixed;
top: 0;
left: 0;
width: 5em;
height: 5em;
}
#header #menu #menu-icon {
position: fixed;
top: 1.5em;
left: 1.5em;
height: 2em;
width: 2em;
}
#header #menu #menu-items {
position: fixed;
display: none;
top: 5em;
width: 250px;
height: auto;
z-index: 1;
}
#header #menu #menu-items a {
display: block;
color: black;
background-color: var(--light-accent);
font-size: 15px;
padding: 15px;
}
#header #menu:hover #menu-items {
display: block;
}
#header #menu #menu-items a:hover {
background-color: var(--medium-grey);
}
#header #search_bar {

10
search.html
Unescape View File

@ -10,7 +10,15 @@
</head>
<body>
<div id="header">
<a href="./catalog.html"><img id="home" src="img/home.png"/></a>
<div id="menu">
<img id="menu-icon" src="img/home.png"/>
<div id="menu-items">
<a href="./catalog.html">Catalog</a>
<a href="./search.html">Search</a>
<a href="">Tags</a>
<a href="./about.html">About</a>
</div>
</div>
<img id="logo" src="img/logo.png"/>
</div>

10
title.html
Unescape View File

@ -10,7 +10,15 @@
<body>
<div id="header">
<a href="./catalog.html"><img id="home" src="img/home.png"/></a>
<div id="menu">
<img id="menu-icon" src="img/home.png"/>
<div id="menu-items">
<a href="./catalog.html">Catalog</a>
<a href="./search.html">Search</a>
<a href="">Tags</a>
<a href="./about.html">About</a>
</div>
</div>
<form action="/search.html">
<input id="search_bar" type="search" name="title" placeholder="Search">
<button id="search_button" type="submit">Search</button>

Write Preview
Loading…
Cancel
Save