add HTML files
This commit is contained in:
Prayag
68
src/html/about.html
Normal file
68
src/html/about.html
Normal file
@@ -0,0 +1,68 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en" dir="ltr">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>Skin Manager-About</title>
|
||||||
|
<link rel="stylesheet" href="style.css">
|
||||||
|
<link rel="icon" href="https://jellyfin.org/favicon.ico">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div class="header" align="center">
|
||||||
|
<div class="innerHeader nav">
|
||||||
|
<a href="#" class="link text"><li>See on Github</li></a>
|
||||||
|
<a href="#" class="link text"><li>Request a skin</li></a>
|
||||||
|
<a href="#" class="link text"><li class="selected">About</li></a>
|
||||||
|
<a href="https://jellyfin.org" class="logo link"><li><img src="https://jellyfin.org/images/banner-dark.svg" style="size: 1em;height: 50px;max-width: 80%;float: right;z-index: 1;"></li></a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="body">
|
||||||
|
<div class="About">
|
||||||
|
<div class="inner">
|
||||||
|
<h1>About Skin Manager</h1>
|
||||||
|
<div class="description">
|
||||||
|
<p>
|
||||||
|
This plugin isused to create custom skins and also give you(the user) few great community Skins. You can add more skins by clicking on the "Request a Skin" button.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="contributorsCont">
|
||||||
|
<fieldset>
|
||||||
|
<h3>Contributors</h3>
|
||||||
|
<p>The people who have helped in the development of this plugin are listed below</p>
|
||||||
|
<div class="cont">
|
||||||
|
<div class="contibutorsNames" style="background:linear-gradient(180deg, #c4c4c4ab, #c4c4c4ab), url(https://avatars2.githubusercontent.com/u/29411250?s=400&v=4);">
|
||||||
|
<a href="https://github.com/danialadov" class="contributorsLink">
|
||||||
|
<div class="top">
|
||||||
|
<h3>Danial Ladov</h3>
|
||||||
|
</div>@danialadov
|
||||||
|
<p class="description">
|
||||||
|
He is the creator of 3 Plugins for Jellyfin, namely- Merge Songs, Theme Music and Skin Manager
|
||||||
|
</p>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="contibutorsNames" style="margin-left: 3em;background:linear-gradient(180deg, #c4c4c4ab, #c4c4c4ab), url(https://avatars1.githubusercontent.com/u/55829513?s=460&u=3f232a3900ade07490ae8bdadd62ec5d0e9e4ecf&v=4);">
|
||||||
|
<a href="https://github.com/prayag17" class="contributorsLink">
|
||||||
|
<div class="top">
|
||||||
|
<h3>Prayag Prajapati</h3>
|
||||||
|
</div>@prayag17
|
||||||
|
<p class="description">
|
||||||
|
He is the creator of 2 jellyfin Skins, namely- JellySkin and JellyFlix. He has helped in creating the "Custom" option in this plugin.
|
||||||
|
</p>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="contibutorsNames" style="margin-left: 3em;background:linear-gradient(180deg, #c4c4c4ab, #c4c4c4ab), url(https://avatars2.githubusercontent.com/u/4365015?s=400&v=4);">
|
||||||
|
<a href="https://github.com/prayag17" class="contributorsLink">
|
||||||
|
<div class="top">
|
||||||
|
<h3>Casper Talvio</h3>
|
||||||
|
</div>@CTalvio
|
||||||
|
<p class="description">
|
||||||
|
He is the creator of 2 jellyfin Skins namely- Monochromic and Kaleidochromic.
|
||||||
|
</p>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</fieldset>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
36
src/html/help.html
Normal file
36
src/html/help.html
Normal file
@@ -0,0 +1,36 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en" dir="ltr">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>Skin Manager-Help</title>
|
||||||
|
<link rel="stylesheet" href="style.css">
|
||||||
|
<link rel="icon" href="https://jellyfin.org/favicon.ico">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div class="header" align="center">
|
||||||
|
<div class="innerHeader nav">
|
||||||
|
<a href="#" class="link text"><li>See on Github</li></a>
|
||||||
|
<a href="#" class="link text"><li>Request a skin</li></a>
|
||||||
|
<a href="#" class="link text"><li>About</li></a>
|
||||||
|
<a href="https://jellyfin.org" class="logo link"><li><img src="https://jellyfin.org/images/banner-dark.svg" style="size: 1em;height: 50px;max-width: 80%;float: right;z-index: 1;"></li></a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="body" style="color: #3a3a3a !important;">
|
||||||
|
<div class="skinRequest">
|
||||||
|
<fieldset>
|
||||||
|
<h1>How To request a new Skin</h1>
|
||||||
|
<div class="internal">
|
||||||
|
<h3>Steps</h3>
|
||||||
|
<br>
|
||||||
|
<ul>
|
||||||
|
<li>Open this <a href="https://github.com/danieladov/jellyfin-plugin-skin-manager/issues" class="link" style="color: #3a3a3a !important; text-decoration: underline;">link</a>or click the "Request a Skin" option present in the header</li>
|
||||||
|
<li>Then Create a New Issue with title- "Skin Request:"</li>
|
||||||
|
<li>Done! Note:We will not add all the Skins.</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</fieldset>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
97
src/html/style.css
Normal file
97
src/html/style.css
Normal file
@@ -0,0 +1,97 @@
|
|||||||
|
body{
|
||||||
|
margin: 0;
|
||||||
|
font-family: Arial;
|
||||||
|
}
|
||||||
|
.body {
|
||||||
|
margin: 2em;
|
||||||
|
}
|
||||||
|
.header {
|
||||||
|
height: 80px;
|
||||||
|
width: 100%;
|
||||||
|
background: #101010;
|
||||||
|
display: block;
|
||||||
|
top: 0;
|
||||||
|
position: sticky;
|
||||||
|
}
|
||||||
|
.innerHeader {
|
||||||
|
height: 100%;
|
||||||
|
margin: 0 1.5em;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav a{
|
||||||
|
display: table;
|
||||||
|
height: 100%;
|
||||||
|
float: right;
|
||||||
|
padding: 0px 10px !important;
|
||||||
|
}
|
||||||
|
.nav a li {
|
||||||
|
vertical-align: middle;
|
||||||
|
display: table-cell;
|
||||||
|
}
|
||||||
|
fieldset {
|
||||||
|
border-radius: 15px;
|
||||||
|
background: #dadada;
|
||||||
|
border: none;
|
||||||
|
padding: 1em;
|
||||||
|
margin-top: 2em;
|
||||||
|
}
|
||||||
|
.link{
|
||||||
|
text-decoration: none;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
a.logo.link {
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
.About {
|
||||||
|
margin: 2em;
|
||||||
|
}
|
||||||
|
.inner {
|
||||||
|
background: #c4c4c4;
|
||||||
|
padding: 1em;
|
||||||
|
border-radius: 15px;
|
||||||
|
color: #3a3a3a;
|
||||||
|
}
|
||||||
|
a {
|
||||||
|
text-decoration: none;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
.cont {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
.contibutorsNames {
|
||||||
|
padding: 1em;
|
||||||
|
border-radius: 15px;
|
||||||
|
width: fit-content;
|
||||||
|
max-width: 10em;
|
||||||
|
min-width: 10em;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
height: fit-content;
|
||||||
|
transition: box-shadow .2s;
|
||||||
|
max-height: 20em;
|
||||||
|
min-height: 15em;
|
||||||
|
background-size: cover !important;
|
||||||
|
}
|
||||||
|
.contibutorsNames:hover {
|
||||||
|
box-shadow: 0 0 17px -3px black;
|
||||||
|
}
|
||||||
|
.contributorsLink {
|
||||||
|
color: #3a3a3a !important;
|
||||||
|
}
|
||||||
|
.text li {
|
||||||
|
color: #9a9a9a;
|
||||||
|
transition: color .25s, border .25s;
|
||||||
|
border-bottom: 5px solid rgba(0,0,0,0);
|
||||||
|
}
|
||||||
|
.text li:hover {
|
||||||
|
color: white !important;
|
||||||
|
border-bottom-color: #00a4dc !important;
|
||||||
|
}
|
||||||
|
.selected {
|
||||||
|
color: white !important;
|
||||||
|
border-bottom-color: #aa5cc3 !important;
|
||||||
|
}
|
||||||
|
img.userImg {
|
||||||
|
width: 50%;
|
||||||
|
border-radius: 15px;
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user