Customize theme

* Consolidate colours and update to my pref * Remove remote fonts * Remove screenshots/refs to skull/vertical layout
Updated README
2023-12-03 21:49:13 +00:00 · 2016-02-10 13:37:19 -05:00 · 2015-01-02 03:00:04 -05:00 · 2015-01-02 02:59:00 -05:00 · 2015-01-02 02:43:17 -05:00 · 2015-01-02 02:41:25 -05:00
10 changed files with 76 additions and 214 deletions
--- a/LICENSE.md
+++ b/LICENSE.md
@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2015 Pavel Mamontov
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
--- a/README.md
+++ b/README.md
@@ -1,44 +1,21 @@
-# Skull theme for Pico CMS
+# Theme for Pico CMS

-Skull is a basic [Pico](http://picocms.org) theme made utilizing the [Skeleton 2.0](http://getskeleton.com) responsive boilerplate. 
-
-Comes with two layouts; one with a vertical navigation, one with horizontal navigation.
+A basic pico theme forked from https://github.com/bananana/skull, mostly with updates to fonts/colours. 

 # Installation

-1. Clone the theme into your Pico theme directory.
+**1)** Clone the theme into your Pico theme directory.

-<code>
+<pre>
    cd /path/to/Pico/themes
-    git clone https://github.com/bananana/skull
-</code>
+    git clone $repo
+</pre>

-2. Edit your *config.php* file and change <code>$config['theme']</code> to <code>$config['theme'] = 'skull'</code>.
+**2)** Edit your *config.php* file and change <code>$config['theme']</code> to <code>$config['theme'] = 'skull'</code>.

-3. By default the theme is set to have a vertical sidebar with navigation. To change to something that looks more like the default Pico theme (with horizontal header), rename *index.php* file to *index-v-nav.php* and rename *index-h-nav.php* to *index.php*.
+**3)** Change colours in skeleton.css to your preference

-<cod>
-    cd /path/to/Pico/themes
-    mv index.php index-v-nav.php
-    mv index-h-nav.php index.php
-</code>
+# To Do

-4. At this point you can remove the alt theme layout if you don't find in necessary. There's also a layout specific css file in *skull/css* direcotry.  
-
-# Screenshots
-
-Vertical sidebar navigation
-
-![Screenshot 1](images/screenshot-1.png "Screenshot 1")
-
- - -
-
-Horisontal header navigation
- 
-![Screenshot 2](images/screenshot-2.png "Screenshot 2")
-
- - -
-
-Mobile
-
-![Screenshot 0](images/screenshot-0.png "Screenshot 0") 
+- Add social media icons to footer
+- Update favicon
--- a/css/custom-h-nav.css
+++ b/css/custom-h-nav.css
@@ -7,8 +7,8 @@
 /* Header
 /*---------------------------------------------*/
 header {
-	background: #33C3F0;
-	color: #afe1da;
+	background: var(--header-background);
+	color: var(--header-text);
 	text-align: center;
 	padding: 25px 0;
 	margin-bottom: 30px;
@@ -24,14 +24,14 @@ header a:hover {
 }
 header a:hover,
 footer a:hover { 
-	color: #fff;
+	color: var(--header-text);
 }
 header h1 { 
 	font-weight: bold;
 	margin: 0; 
 }
 header h1 a {
-	color: #fff;
+	color: var(--header-text);
 }
 header ul {
 	list-style: none;
@@ -49,8 +49,8 @@ header ul a {
 /* Footer
 /*---------------------------------------------*/
 footer {
-	background: #1EAEDB;
-	color: #afe1da;
+	background: var(--footer-background);
+	color: var(--footer-text);
 	padding: 60px 0;
 	margin-top: 80px;
 }
--- a/css/custom-v-nav.css
+++ b/css/custom-v-nav.css
@@ -1,82 +0,0 @@
-/* Sidebar
-/*---------------------------------------------*/
-.sidebar {
-	position: relative;
-	background: #33C3F0;
-	color: #afe1da;
-	text-align: center;
-	padding: 25px 0;
-}	
-.sidebar a { 
-	color: #eee; 
-}
-.sidebar a,
-.sidebar a:hover { 
-	text-decoration: none;
-}
-.sidebar a:hover { 
-	color: #fff;
-}
-.sidebar h1 { 
-	font-weight: bold;
-	margin: 0; 
-}
-.sidebar h1 a {
-	color: #fff;
-}
-.sidebar ul {
-	list-style: none;
-	margin: 20px 0 0 0;
-	padding: 0;
-}
-.sidebar ul li {
-	display: inline;
-	margin: 0 5px; 
-}
-.sidebar ul a {
-	font-weight: bold;
-}
-.content {
-	padding: 25px 10px 0 10px;
-}
-
-/* Footer
-/*---------------------------------------------*/
-footer {
-	display: none;
-}
-
-/* For larger screens
-/*---------------------------------------------*/
-@media (min-width: 550px) {
-	html,
-	body,
-	.row,
-	.sidebar {
-		height: 100%;
-	}
-	.sidebar {
-		position: fixed;
-		top: 0;
-		left: 0;
-		padding: 60px 0;
-	}
-	.sidebar ul li {
-		display: list-item;
-		margin: inherit;
-	}
-	.content {
-		padding: 67px 50px 0 0;
-	}
-	footer {
-		display: block;
-		position: fixed;
-		bottom: 0;
-		left: 0;
-		width: inherit;
-		background: #1EAEDB;
-		padding: 60px 0;
-		margin-top: 80px;
-		font-size: 0.8em;
-	}		
-}
--- a/css/skeleton.css
+++ b/css/skeleton.css
@@ -26,6 +26,17 @@
 */


+/* Theme colours
+-------------------------------------------------- */
+:root {
+  --header-background: #600080;
+  --header-text: #fff;
+  --body-text: #222;
+  --body-background: #cceaea;
+  --footer-background: #4d0066;
+  --footer-text: var(--header-text);
+}
+
 /* Grid
 –––––––––––––––––––––––––––––––––––––––––––––––––– */
 .container {
@@ -124,8 +135,10 @@ body {
  font-size: 1.5em; /* currently ems cause chrome bug misinterpreting rems on body element */
  line-height: 1.6;
  font-weight: 400;
-  font-family: "Raleway", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
-  color: #222; }
+  font-family: sans-serif;
+  color: var(--body-text);
+  background: var(--body-background);
+}


 /* Typography
@@ -206,8 +219,8 @@ input[type="submit"].button-primary,
 input[type="reset"].button-primary,
 input[type="button"].button-primary {
  color: #FFF;
-  background-color: #33C3F0;
-  border-color: #33C3F0; }
+  background-color: var(--header-background);
+  border-color: var(--header-background); }
 .button.button-primary:hover,
 button.button-primary:hover,
 input[type="submit"].button-primary:hover,
@@ -266,7 +279,7 @@ input[type="url"]:focus,
 input[type="password"]:focus,
 textarea:focus,
 select:focus {
-  border: 1px solid #33C3F0;
+  border: 1px solid var(--header-background);
  outline: 0; }
 label,
 legend {
--- a/images/screenshot-0.png
+++ b/images/screenshot-0.png
--- a/images/screenshot-1.png
+++ b/images/screenshot-1.png
--- a/images/screenshot-2.png
+++ b/images/screenshot-2.png
--- a/index-h-nav.html
+++ b/index-h-nav.html
@@ -1,69 +0,0 @@
-<!DOCTYPE html>
-<html lang="en" class="no-js">
-<head>
-	
-	<!-- Basic Page Needs
-	–––––––––––––––––––––––––––––––––––––––––––––––––– -->
-	<meta charset="utf-8" />
-	<title>{% if meta.title %}{{ meta.title }} | {% endif %}{{ site_title }}</title>
-	{% if meta.description %}
-	<meta name="description" content="{{ meta.description }}"> 
-	{% endif %}
-	{% if meta.robots %}
-	<meta name="robots" content="{{ meta.robots }}">
-	{% endif %}
-	
-	<!-- Mobile Specific Metas
-	–––––––––––––––––––––––––––––––––––––––––––––––––– -->
-	<meta name="viewport" content="width=device-width, initial-scale=1">
-	
-	<!-- Font
-	–––––––––––––––––––––––––––––––––––––––––––––––––– -->
-	<link href="//fonts.googleapis.com/css?family=Raleway:400,300,600" rel="stylesheet" type="text/css">
-
-	<!-- CSS
-	–––––––––––––––––––––––––––––––––––––––––––––––––– -->
-	<link rel="stylesheet" href="{{ theme_url }}/css/normalize.css">
-	<link rel="stylesheet" href="{{ theme_url }}/css/skeleton.css">
-	<link rel="stylesheet" href="{{ theme_url }}/css/custom-h-nav.css">
-	
-	<!-- Favicon
-	–––––––––––––––––––––––––––––––––––––––––––––––––– -->
-	<link rel="icon" type="image/png" href="{{ theme_url }}/images/favicon.png">
-	
-</head>
-<body>
-	
-	<!-- Primary Page Layout
-	–––––––––––––––––––––––––––––––––––––––––––––––––– -->
-	<header>
-		<div class="container">
-			<div class="row">
-				<h1><a href="{{ base_url }}">{{ site_title }}</a></h1>
-				<ul class="nav">
-					{% for page in pages %}
-					<li><a href="{{ page.url }}">{{ page.title }}</a></li>
-					{% endfor %}
-				</ul>
-			</div>
-		</div>
-	</header>
-
-	<section class="content container">
-		<div class="row">
-			{{ content }}
-		</div>
-	</section>
-	
-	<footer>
-		<div class="container">
-			<div class="row">
-				<a href="https://github.com/bananana/skull">Skull theme</a> for <a href="http://picocms.org/">Pico CMS</a> was made by <a href="http://pavelmamontov.com">Pavel Mamontov</a> 
-			</div>
-		</div>
-	</footer>
-	
-<!-- End Document
-–––––––––––––––––––––––––––––––––––––––––––––––––– -->    
-</body>
-</html>
--- a/index.html
+++ b/index.html
@@ -17,15 +17,11 @@
 	–––––––––––––––––––––––––––––––––––––––––––––––––– -->
 	<meta name="viewport" content="width=device-width, initial-scale=1">

-	<!-- Font
-	–––––––––––––––––––––––––––––––––––––––––––––––––– -->
-	<link href="//fonts.googleapis.com/css?family=Raleway:400,300,600" rel="stylesheet" type="text/css">
-
 	<!-- CSS
 	–––––––––––––––––––––––––––––––––––––––––––––––––– -->
 	<link rel="stylesheet" href="{{ theme_url }}/css/normalize.css">
 	<link rel="stylesheet" href="{{ theme_url }}/css/skeleton.css">
-	<link rel="stylesheet" href="{{ theme_url }}/css/custom-v-nav.css">
+	<link rel="stylesheet" href="{{ theme_url }}/css/custom-h-nav.css">
 	
 	<!-- Favicon
 	–––––––––––––––––––––––––––––––––––––––––––––––––– -->
@@ -36,27 +32,33 @@
 	
 	<!-- Primary Page Layout
 	–––––––––––––––––––––––––––––––––––––––––––––––––– -->
-	<div class="row">
-		<div class="one-third column sidebar">
 	<header>
+		<div class="container">
+			<div class="row">
 				<h1><a href="{{ base_url }}">{{ site_title }}</a></h1>
 				<ul class="nav">
 					{% for page in pages %}
 					<li><a href="{{ page.url }}">{{ page.title }}</a></li>
 					{% endfor %}
 				</ul>
+			</div>
+		</div>
 	</header>

-			<footer>
-				<a href="https://github.com/bananana/skull">Skull theme</a> for <a href="http://picocms.org/">Pico CMS</a> was made by <a href="http://pavelmamontov.com">Pavel Mamontov</a>
-			</footer>
-		</div>
-	
-		<div class="two-thirds offset-by-one-third column content">
+	<section class="content container">
+		<div class="row">
 			{{ content }}
 		</div>
+	</section>
 	
+	<footer>
+		<div class="container">
+			<div class="row">
+				The website of Jennifer Radtke 
 			</div>
+		</div>
+	</footer>
+	
 <!-- End Document
 –––––––––––––––––––––––––––––––––––––––––––––––––– -->    
 </body>
Author	SHA1	Message	Date
Jennifer C J Radtke	e0198b13da	Customize theme * Consolidate colours and update to my pref * Remove remote fonts * Remove screenshots/refs to skull/vertical layout	2023-12-03 21:49:13 +00:00
bananana	192df8b8bb	Updated README	2016-02-10 13:37:19 -05:00
bananana	f2698de8d9	Rename LICENSE to LICENSE.md Minor edit	2015-01-02 03:00:04 -05:00
bananana	0af92f22d2	Create LICENSE Added MIT license	2015-01-02 02:59:00 -05:00
bananana	b180a9294f	Better explanation	2015-01-02 02:43:17 -05:00
bananana	2eb421b56d	Added a to do list	2015-01-02 02:41:25 -05:00
bananana	da3b3c0b1c	Making documentation pretty	2015-01-02 02:39:45 -05:00
bananana	99703d1932	More fixes	2015-01-02 02:37:19 -05:00
bananana	2cee96463b	Fixing documentation	2015-01-02 02:36:33 -05:00
bananana	760584a55a	And again	2015-01-02 02:35:55 -05:00