mirror of
https://gitlab.com/sbrl/GalleryShare.git
synced 2018-06-12 22:45:16 +00:00
Start footer and tweak even more xslt / css
I'm so undecided and such a perfectionist when it comes to web page design :D
This commit is contained in:
parent
442db404f9
commit
e551dc274f
5 changed files with 31 additions and 16 deletions
BIN
GalleryShare/Embed/Background-Caption.png
Normal file
BIN
GalleryShare/Embed/Background-Caption.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 50 KiB |
1
GalleryShare/Embed/Badge-License.svg
Normal file
1
GalleryShare/Embed/Badge-License.svg
Normal file
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="106" height="20"><linearGradient id="b" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><mask id="a"><rect width="106" height="20" rx="3" fill="#fff"/></mask><g mask="url(#a)"><path fill="#555" d="M0 0h51v20H0z"/><path fill="#007ec6" d="M51 0h55v20H51z"/><path fill="url(#b)" d="M0 0h106v20H0z"/></g><g fill="#fff" text-anchor="middle" font-family="DejaVu Sans,Verdana,Geneva,sans-serif" font-size="11"><text x="25.5" y="15" fill="#010101" fill-opacity=".3">License</text><text x="25.5" y="14">License</text><text x="77.5" y="15" fill="#010101" fill-opacity=".3">MPL-2.0</text><text x="77.5" y="14">MPL-2.0</text></g></svg>
|
After Width: | Height: | Size: 746 B |
|
@ -6,18 +6,19 @@
|
|||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title><xsl:value-of select="/DirectoryListing/CurrentDirectory" /> - GalleryShare</title>
|
||||
<title><xsl:value-of select="/DirectoryListing/CurrentDirectory" /> <xsl:text disable-output-escaping="yes"><![CDATA[ • ]]></xsl:text> GalleryShare</title>
|
||||
</head>
|
||||
<body>
|
||||
<h1><xsl:value-of select="/DirectoryListing/CurrentDirectory" /> - GalleryShare</h1>
|
||||
<h1><xsl:value-of select="/DirectoryListing/CurrentDirectory" /></h1>
|
||||
|
||||
<main>
|
||||
<xsl:apply-templates select="//ListingEntry" />
|
||||
</main>
|
||||
|
||||
<!-- <footer>
|
||||
<footer>
|
||||
Built by Starbeamrainbowlabs
|
||||
</footer> -->
|
||||
<img src="/!images/Badge-License.svg" />
|
||||
</footer>
|
||||
|
||||
<link rel="stylesheet" href="/!Theme.css" />
|
||||
</body>
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
--transparent-checkerboard-size: 2.5em;
|
||||
--checkerboard-bg: rgba(200, 200, 200, 0.2);
|
||||
--figcaption-bg-size: 13em;
|
||||
--figcaption-bg-position-y: 0.9em;
|
||||
--figcaption-bg-position-y: 0.7em;
|
||||
}
|
||||
|
||||
html, body { font-size: 100%; }
|
||||
|
@ -15,7 +15,7 @@ body
|
|||
|
||||
font-family: sans-serif;
|
||||
|
||||
background: url('/!Background-Texture.png'),
|
||||
background: url('/!images/Background-Texture.png'),
|
||||
/* Adapted from http://www.webcore-it.com/colorful-background */
|
||||
linear-gradient(45deg, hsla(30, 92%, 46%, 1) 0%, hsla(30, 92%, 46%, 0) 70%),
|
||||
linear-gradient(135deg, hsla(330, 96%, 50%, 1) 10%, hsla(330, 96%, 50%, 0) 80%),
|
||||
|
@ -40,7 +40,7 @@ main
|
|||
text-align: center;
|
||||
line-height: 0.8em;
|
||||
|
||||
background: rgba(75, 75, 75, 0.4);
|
||||
/*background: rgba(75, 75, 75, 0.4);*/
|
||||
/*background: rgba(125, 125, 125, 0.4);*/
|
||||
}
|
||||
|
||||
|
@ -77,19 +77,30 @@ figcaption
|
|||
|
||||
text-align: center;
|
||||
line-height: 1em;
|
||||
color: rgba(255, 255, 255, 0.3);
|
||||
|
||||
color: white;
|
||||
background:
|
||||
url('https://www.transparenttextures.com/patterns/lined-paper-2.png') 0 var(--figcaption-bg-position-y),
|
||||
rgba(10, 10, 10, 0.2);
|
||||
background-image: url('/!images/Background-Caption.png');
|
||||
background-color: rgba(10, 10, 10, 0.2);
|
||||
background-size: var(--figcaption-bg-size) var(--figcaption-bg-size);
|
||||
background-position: 0 var(--figcaption-bg-position-y);
|
||||
|
||||
transition: all 0.25s;
|
||||
}
|
||||
figure:hover figcaption
|
||||
{
|
||||
background:
|
||||
url('https://www.transparenttextures.com/patterns/lined-paper-2.png') 0 var(--figcaption-bg-position-y),
|
||||
rgb(25, 25, 25);
|
||||
background-size: var(--figcaption-bg-size) var(--figcaption-bg-size);
|
||||
color: white;
|
||||
background-color: rgb(25, 25, 25);
|
||||
}
|
||||
|
||||
footer
|
||||
{
|
||||
padding: 1em;
|
||||
|
||||
text-align: center;
|
||||
color: white;
|
||||
}
|
||||
|
||||
footer img
|
||||
{
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
|
|
@ -17,7 +17,9 @@ namespace GalleryShare.RequestRouter
|
|||
{
|
||||
{ "Transform-DirListing.xslt", new SpecialFileEntry(@"GalleryShare.Embed.DirectoryListing.xslt", "text/xsl") },
|
||||
{ "Theme.css", new SpecialFileEntry(@"GalleryShare.Embed.Theme.css", "text/css") },
|
||||
{ "Background-Texture.png", new SpecialFileEntry(@"GalleryShare.Embed.Background-Texture.png", "image/png") }
|
||||
{ "images/Background-Texture.png", new SpecialFileEntry(@"GalleryShare.Embed.Background-Texture.png", "image/png") },
|
||||
{ "images/Background-Caption.png", new SpecialFileEntry(@"GalleryShare.Embed.Background-Caption.png", "image/png") },
|
||||
{ "images/Badge-License.svg", new SpecialFileEntry(@"GalleryShare.Embed.Badge-License.svg", "image/svg+xml") }
|
||||
};
|
||||
|
||||
public RouteSpecialFile()
|
||||
|
|
Loading…
Reference in a new issue