App-Followme
view release on metacpan or search on metacpan
lib/App/Followme/Initialize.pm view on Meta::CPAN
<body>
<header>
<div><img src="banner.jpg"></div>
<span class= "title"><a href="#">Your Title Here</a></span>
<div class="dropdown" style="float:right;">
<button class="dropbtn">☰</button>
<nav class="dropdown-content">
<a href="essays/index.html">Essays</a>
<a href="photos/index.html">Photos</a>
</nav>
</div>
</header>
<article>
<section id="primary">
<!-- section primary -->
<h2>Followme</h2>
<p>Usage: followme [file or directory]</p>
<p>Update a static website after changes. Constant portions of each page are
updated to match, text files are converted to html, and indexes are created
for new files in the archive.</p>
<p>The script is run on the directory or file passed as its argument. If no
argument is given, it is run on the current directory.</p>
<p>If a file is passed, the script is run on the directory the file is in. In
addition, the script is run in quick mode, meaning that only the directory
the file is in is checked for changes. Otherwise not only that directory, but
all directories below it are checked.</p>
<p>Followme can be downloaded from CPAN as App::Followme.</p>
<p>This file is used as a template for the site. Any markup outside the section
comments will be shared between all pages. Modify it to get the desired look for
your site. The subdirectories show some of the capabilities of this application.
Keep or modify them as you wish.</p>
<p>See <a href="help/index.html">help</a> for more information about this
script.</p>
<!-- endsection primary-->
<section id="secondary">
<!-- section secondary -->
<!-- endsection secondary-->
</section>
</article>
<footer>
<nav class="footer-content">
<a href="essays/index.html">Essays</a>
<a href="photos/index.html">Photos</a>
</nav>
</footer>
</body>
</html>
#>>> copy text theme.css
/*
Global styles
*****************/
body {
font-family: helvetica, arial, sans-serif;
line-height: 1.5;
margin: 0 auto;
max-width: 50em;
padding: 0 1em;
}
h1, h2, h3, h4, h5, h6 {
margin: 1em 0 0.5em 0;
line-height: 1.2em;
}
img {
max-width: 100%;
}
figure {
margin: 1em 0;
text-align: center;
}
figcaption {
font-size: small;
}
pre, code, samp, kbd {
color: #009;
font-family: monospace, monospace;
font-size: 0.9em;
}
pre code, pre samp, pre kbd {
font-size: 1em;
}
pre kbd {
color: #060;
}
pre {
background: #eee;
padding: 0.5em;
overflow: auto;
}
blockquote {
background: #eee;
border-left: medium solid #ccc;
margin: 1em 0;
padding: 0.5em;
}
blockquote :first-child {
margin-top: 0;
}
blockquote :last-child {
margin-bottom: 0;
}
/*
Header
*****************/
header {
padding: 0;
background: #222;
border-radius: 6px;
}
.title {
padding: 16px;
font-size: 1.75em;
}
.title a {
text-decoration: none;
color: #aaa;
}
.title a:hover {
color: #fff;
}
/*
Footer
*****************/
footer {
padding: 8px;
background: #222;
border-radius: 6px;
}
.footer-content a {
padding: 16px;
text-decoration: none;
color: #aaa;
}
.footer-content a:hover {
color: #fff;
}
/*
Menu
*****************/
.dropbtn {
font-size: 1.75em;
background-color: #222;
color: #aaa;
border: none;
cursor: pointer;
}
.dropdown {
position: relative;
display: inline-block;
}
.dropdown-content {
display: none;
position: absolute;
right: 0;
background-color: #222;
min-width: 160px;
border-radius: 6px;
z-index: 1;
}
.dropdown-content a {
color: #aaa;
padding: 12px 16px;
border-radius: 6px;
text-decoration: none;
display: block;
}
.dropdown-content a:hover {
color: #fff;
}
.dropdown:hover .dropdown-content {
display: block;
}
.dropdown:hover .dropbtn {
color:#fff;
background-color: #222;
border-color: #222;
}
/*
Photo Gallery
*****************/
#gallery {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
grid-gap: 10px;
align-items: start;
}
.thumb {
border: 1px solid #ccc;
box-shadow: 2px 2px 6px 0px rgba(0,0,0,0.3);
max-width: 100%;
}
.lightbox {
position: fixed;
z-index: 999;
height: 0;
width: 0;
text-align: center;
top: 0;
left: 0;
( run in 0.796 second using v1.01-cache-2.11-cpan-5735350b133 )