.editorconfig

@@ -1,17 +0,0 @@
-# For more information about the properties used in this file,
-# please see the EditorConfig documentation:
-# http://editorconfig.org
-
-[*]
-charset = utf-8
-end_of_line = lf
-indent_size = 4
-indent_style = space
-insert_final_newline = true
-trim_trailing_whitespace = true
-
-[{*.yml,package.json}]
-indent_size = 2
-
-# The indent size used in the package.json file cannot be changed:
-# https://github.com/npm/npm/pull/3180#issuecomment-16336516

README.md

@@ -1,6 +1,6 @@
 # Using the Simple theme
 
- * Copy the theme into the `themes/` directory of your Silverstripe project.  If you've named it correctly, there should be a directory called `themes/simple/templates`.
+ * Copy the theme into the `themes/` directory of your SilverStripe project.  If you've named it correctly, there should be a directory called `themes/simple/templates`.
  
  * Add the following to your `mysite/_config.php` file.  Remove any existing `SSViewer::set_theme` lines.
 

code-of-conduct.md

@@ -1 +0,0 @@
-When having discussions about this module in issues or pull request please adhere to the [SilverStripe Community Code of Conduct](https://docs.silverstripe.org/en/contributing/code_of_conduct).

composer.json

@@ -2,27 +2,16 @@
     "name": "silverstripe-themes/simple",
     "description": "The SilverStripe simple theme (default SilverStripe 3 theme)",
     "type": "silverstripe-theme",
-    "keywords": [
-        "silverstripe",
-        "theme"
-    ],
+    "keywords": ["silverstripe", "theme"],
     "license": "BSD-3-Clause",
     "authors": [
         {
-            "name": "Sara Tu\u0161ar (Innovaif)",
+            "name": "Sara Tušar (Innovaif)",
             "homepage": "http://www.saratusar.com"
         }
     ],
     "require": {
         "composer/installers": "*",
-        "silverstripe/framework": ">=3.5"
-    },
-    "extra": {
-        "expose": [
-            "css",
-            "images",
-            "javascript",
-            "webfonts"
-        ]
+        "silverstripe/framework": ">=3.0"
     }
 }

css/form.css

@@ -88,9 +88,7 @@ form .message {
         background-color: #ecf9d0;
         border-color: #8fbe00;
     }
-    form .bad,
-    form .required,
-    form .error {
+    form .bad, form .required {
         background-color: #f9d0d0;
         border-color: #cf0000;
         color: #b80000;
@@ -101,7 +99,7 @@ form .message {
 .Actions {
     margin-bottom: 20px;
 }
-    a.btn, button, input[type="submit"], input[type="reset"], .Actions .action {
+    a.btn, button, input[type="submit"], .Actions .action {
         background: #b80000;
         color: #fff;
         display: inline-block;
@@ -198,7 +196,7 @@ form .date .middleColumn input {
     font-size: 13px;                            /* reset to default */
     color: #333;                                /* reset to default */
 }
-form .requiredField label.left:after, form .requiredField legend.left:after { /* pseudo element adds an asterisk to a required fields label */
+form .requiredField label.left:after { /* pseudo element adds an asterisk to a required fields label */
     color: #B94A48;
     content: "*";
     font-size: 14px;
@@ -246,6 +244,8 @@ form input.holder-required {        /* This class needs to be changed - is used
 input:invalid,
 textarea:invalid {
     border-radius: 1px;
+    -moz-box-shadow: 0px 0px 5px red;
+    -webkit-box-shadow: 0px 0px 5px red;
     box-shadow: 0px 0px 5px red;
 }
 .no-boxshadow input:invalid,

css/layout.css

@@ -48,15 +48,15 @@
 	padding:0 10px;
 	-moz-box-sizing:border-box;
 	-webkit-box-sizing:border-box;
-	box-sizing:border-box; /* box-sizing:border-box; creates a box-model where
-	padding and border are NOT added onto the width - they are included in the width,
+	box-sizing:border-box; /* box-sizing:border-box; creates a box-model where 
+	padding and border are NOT added onto the width - they are included in the width, 
 	so a 200px wide element with 20px padding will be 200px, NOT 240px wide */
 }
 .unitRightv { /* Use this class if you want to offset a column eg: |--content(.unit)--|--content(.unit)--|--no-content--|--no-content--|--content(.unitRighttv)--| */
 	float:right;
 }
 
-/* sizeXofY - Extends unit. Indicates the fractional width of the unit, for example size3of4 would take up three quarters, or 75%, of the horizontal space.
+/* sizeXofY - Extends unit. Indicates the fractional width of the unit, for example size3of4 would take up three quarters, or 75%, of the horizontal space. 
 The following fractions are supported: 1, 1/2, 1/3, 2/3, 1/4, 3/4, 1/5, 2/5, 3/5, 4/5 */
 /* It is possible to add more columns if you wish you will just have to add the fractions that are missing eg: .size1of6 {width:16.66666%;} */
 
@@ -93,7 +93,7 @@ The following fractions are supported: 1, 1/2, 1/3, 2/3, 1/4, 3/4, 1/5, 2/5, 3/5
 .lastUnit { /* lastUnit - Extends unit. Applied to the last child of every line. */
 	float:none;
 	width:auto;
-	_position:relative; /* Bug fix for IE6 - Internet Explorer 6 and below wouldn't fail on properties that were prefixed with non-alphanumeric characters.
+	_position:relative; /* Bug fix for IE6 - Internet Explorer 6 and below wouldn't fail on properties that were prefixed with non-alphanumeric characters. 
 	meaning that anything prefixed with _ wouldn't be picked up by any other browsers */
 	_left:-3px;
 	_margin-right:-3px;
@@ -103,7 +103,7 @@ The following fractions are supported: 1, 1/2, 1/3, 2/3, 1/4, 3/4, 1/5, 2/5, 3/5
 body {
     margin: 0;
     background: #ededed;
-    min-width: 240px;
+    min-width: 240px; 
     -webkit-text-size-adjust: none; /* The text size is not adjusted for Safari on iPhone */
 }
 	.ie7 body,
@@ -183,6 +183,7 @@ body {
 		    color: #888;
 		    margin: 0;
 		    border: none;
+		    -moz-border-radius: 14px;
 		    border-radius: 14px;
 		    background: #fff;
 		}
@@ -313,7 +314,7 @@ body {
 		    list-style-type: none;
 		    margin-bottom: 0;
 		}
-			.main .secondary li .arrow {
+			.main .secondary li .arrow { 
 			    color: #b80000;
 			    padding-right: 5px;
 			    display: block;
@@ -356,7 +357,7 @@ body {
 			.main .secondary li.current a {
 			    color: #000;
 			}
-
+		
 
 		/* Secondary navigation 2-5 levels deep */
 		.main .secondary ul ul {
@@ -380,7 +381,7 @@ body {
 		.main .secondary ul ul ul ul li a { padding-left: 30px; }
 			.main .secondary ul ul ul ul li a .arrow { left: 32px; }
 			.main .secondary ul ul ul ul li a:hover .arrow { left: 36px; }
-
+			
 		.main .secondary ul ul ul ul ul li a { padding-left: 40px; }
 			.main .secondary ul ul ul ul ul li a .arrow { left: 32px; }
 			.main .secondary ul ul ul ul ul li a:hover .arrow { left: 36px; }
@@ -424,14 +425,14 @@ body h1 span.amp {
 
 /* FOOTER */
 .footer {
-    color: #6B6B6B;
+    color: #999;
     background: #ededed;
     padding: 20px 0;
     font-size: 11px;
     line-height: 22px;
 }
 	.footer a {
-	    color: #6B6B6B;
+	    color: #999;
 	}
 	.footer a:hover {
 	    color: #B90000;
@@ -521,7 +522,7 @@ body h1 span.amp {
 		    display:table; /* displays the pagination as a table so that elements stay inline and the middle column adjusts its size to accomodate and the right arrow stays to the right */
 		    width:100%;
 		}
-		.searchResults #PageNumbers .pagination button{
+		.searchResults #PageNumbers .pagination span{
 			display:table-cell; /* each element in the pagination div displays as a table cell */
 		}
 		.searchResults #PageNumbers p {
@@ -548,7 +549,7 @@ body h1 span.amp {
     display: none; /* removes the nav toggle button for desktop site */
 }
 #media-query-trigger {
-    /* instead of detecting the width of the window in simple/javascript/script.js it detects the visibility of this element (which is set using media queries)
+    /* instead of detecting the width of the window in simple/javascript/script.js it detects the visibility of this element (which is set using media queries) 
     instead to trigger the hiding/showing of nav and search in mobile mode */
     display: none;
     visibility: hidden;
@@ -570,7 +571,7 @@ body h1 span.amp {
 /* BREAKPOINT 640px */
 
 /* when changing the breakpoint below, change it ito the same value in the script.js file as well */
-@media only screen and (max-width: 640px) {
+@media only screen and (max-width: 640px) { 
 	body {
 	    max-width: 640px;
 	}
@@ -593,7 +594,7 @@ body h1 span.amp {
 		    padding-right: 100px; /* padding stops .brand text from overlapping the search and nav buttons */
 		}
 	.tablet-nav .header {
-	    padding: 0;
+	    padding: 0px;
 	}
 		.tablet-nav .header .inner {
 		    padding: 20px 0 0 0;
@@ -611,9 +612,6 @@ body h1 span.amp {
 		    font-family: 'WebSymbolsRegular';
 		    font-size: 20px;
 		    color: #ededed;
-            background: #000;
-            margin-top: 0;
-            padding: 0;
 		}
 		.tablet-nav .header .primary ul {
 		    z-index: 10;
@@ -640,7 +638,7 @@ body h1 span.amp {
 			    position: absolute;
 			    right: 20px;
 			    top: 0px;
-                font-family: 'WebSymbolsRegular';
+			    font-family: 'WebSymbolsRegular';
 			    font-size: 14px;
 			    color: #999;
 			    text-align: center;
@@ -721,7 +719,8 @@ body h1 span.amp {
 	    border: 1px solid #e5e5e5;
 	    background: #fff;
 	    font-size: 17px;
-	    border-radius: 20px; /* increase border radius due to increased padding */
+	    -moz-border-radius: 20px; /* increase border radius due to increased padding */
+		border-radius: 20px;
 	}
 	.search-bar form input.action {
 	    right: 5%;
@@ -841,4 +840,4 @@ body h1 span.amp {
     nav.primary {
 	    display: none;
 	}
-}
+}

css/typography.css

@@ -93,12 +93,12 @@ body {
 }
 
 /* LINKS */
-.typography a,
+.typography a, 
 .typography a.intro {
     color: #B80000;
     text-decoration: none;
 }
-  .typography a:hover {
+  .typography a:hover { 
     color: #D80000;
     border-bottom: 1px dashed #B80000;
   }
@@ -107,7 +107,7 @@ body {
 
 /* LIST STYLES
 -------------------------------------------- */
-.typography ul,
+.typography ul, 
 .typography ol,
 .typography dl { margin: 0 0 20px 25px; }
 .typography ul li { list-style-type: disc; } /* adds disc style bullet to the list */
@@ -142,20 +142,20 @@ body {
   }
 
 
-/* WYSIWYG EDITOR ALIGNMENT CLASSES
+/* WYSIWYG EDITOR ALIGNMENT CLASSES 
 -------------------------------------------- */
-.typography .text-left {
+.typography .left {
     text-align: left
 }
-.typography .text-center {
+.typography .center {
     text-align: center
 }
-.typography .text-right {
+.typography .right {
     text-align: right
 }
 
 
-/* IMAGES
+/* IMAGES 
 -------------------------------------------- */
 .typography img {
     border: 5px solid #d7d7d7;
@@ -265,4 +265,4 @@ body {
 address {
   display: block;
   margin-bottom: 20px;
-}
+}

javascript/script.js

@@ -2,13 +2,26 @@ jQuery.noConflict();
 
 (function($) {
 	$(document).ready(function() {
-		// L is a magnifying glass icon in the font
+		/* removes text from search form on focus and replaces it on unfocus - if text is entered then it does not get replaced with default on unfocus */
 		$('#SearchForm_SearchForm_action_results').val('L');
+		var searchField = $('#SearchForm_SearchForm_Search');
+		var default_value = searchField.val();
+		searchField.focus(function() {
+			$(this).addClass('active');
+			if(searchField.val() == default_value) {
+				searchField.val('');
+			}
+		});
+		searchField.blur(function() {
+			  if(searchField.val() == '') {
+					searchField.val(default_value);
+			  }
+		});
 
 		if (!$.browser.msie || ($.browser.msie && (parseInt($.browser.version, 10) > 8))) {
-			var searchBarButton = $("button.search-dropdown-icon");
+			var searchBarButton = $("span.search-dropdown-icon");
 			var searchBar = $('div.search-bar');
-			var menuButton = $("button.nav-open-button");
+			var menuButton = $("span.nav-open-button");
 			var menu = $('.header .primary ul');
 			var mobile = false;
 			var changed = false;
@@ -71,65 +84,4 @@ jQuery.noConflict();
 			});
 		}
 	});
-
-// ---------------------------------------------------------
-// Use of jQuery.browser is frowned upon.
-// More details: http://api.jquery.com/jQuery.browser
-// jQuery.uaMatch maintained for back-compat
-
-    jQuery.uaMatch = function( ua ) {
-        ua = ua.toLowerCase();
-
-        var match = /(chrome)[ \/]([\w.]+)/.exec( ua ) ||
-            /(webkit)[ \/]([\w.]+)/.exec( ua ) ||
-            /(opera)(?:.*version|)[ \/]([\w.]+)/.exec( ua ) ||
-            /(msie) ([\w.]+)/.exec( ua ) ||
-            ua.indexOf("compatible") < 0 && /(mozilla)(?:.*? rv:([\w.]+)|)/.exec( ua ) ||
-            [];
-
-        return {
-            browser: match[ 1 ] || "",
-            version: match[ 2 ] || "0"
-        };
-    };
-
-    matched = jQuery.uaMatch( navigator.userAgent );
-    browser = {};
-
-    if ( matched.browser ) {
-        browser[ matched.browser ] = true;
-        browser.version = matched.version;
-    }
-
-    // Chrome is Webkit, but Webkit is also Safari.
-    if ( browser.chrome ) {
-        browser.webkit = true;
-    } else if ( browser.webkit ) {
-        browser.safari = true;
-    }
-
-    jQuery.browser = browser;
-
-    jQuery.sub = function() {
-        function jQuerySub( selector, context ) {
-            return new jQuerySub.fn.init( selector, context );
-        }
-        jQuery.extend( true, jQuerySub, this );
-        jQuerySub.superclass = this;
-        jQuerySub.fn = jQuerySub.prototype = this();
-        jQuerySub.fn.constructor = jQuerySub;
-        jQuerySub.sub = this.sub;
-        jQuerySub.fn.init = function init( selector, context ) {
-            if ( context && context instanceof jQuery && !(context instanceof jQuerySub) ) {
-                context = jQuerySub( context );
-            }
-
-            return jQuery.fn.init.call( this, selector, context, rootjQuerySub );
-        };
-        jQuerySub.fn.init.prototype = jQuerySub.fn;
-        var rootjQuerySub = jQuerySub(document);
-        return jQuerySub;
-    };
-// ---------------------------------------------------------
-
 }(jQuery));

templates/Includes/Footer.ss

@@ -4,7 +4,7 @@
 			<div class="left">
 				<a href="$BaseHref" class="brand" rel="home">$SiteConfig.Title</a>
 				<span class="arrow">&rarr;</span> <% include Navigation %></div>
-			<small class="right"><a href="http://simple.innovatif.com/about/">Theme</a> by Sara (Innovatif) / Powered by <a href="http://silverstripe.org">SilverStripe</a></small>
+			<small class="right"><a href="http://simple.innovatif.com/about/">Theme</a> by <a href="http://www.saratusar.com">Sara</a> (Innovatif) / Powered by <a href="http://silverstripe.org">SilverStripe</a></small>
 		</div>
 	</div>
-</footer>
+</footer>

templates/Includes/Header.ss

@@ -8,7 +8,7 @@
 				<% end_if %>
 			</a>
 			<% if $SearchForm %>
-				<button class="search-dropdown-icon">L</button>
+				<span class="search-dropdown-icon">L</span>
 				<div class="search-bar">
 					$SearchForm
 				</div>

templates/Includes/Navigation.ss

@@ -1,5 +1,5 @@
 <nav class="primary">
-	<button class="nav-open-button">²</button>
+	<span class="nav-open-button">²</span>
 	<ul>
 		<% loop $Menu(1) %>
 			<li class="$LinkingMode"><a href="$Link" title="$Title.XML">$MenuTitle.XML</a></li>

templates/Page.ss

@@ -16,7 +16,7 @@ Change it, enhance it and most importantly enjoy it!
 	<% base_tag %>
 	<title><% if $MetaTitle %>$MetaTitle<% else %>$Title<% end_if %> &raquo; $SiteConfig.Title</title>
 	<meta charset="utf-8">
-	<meta name="viewport" content="width=device-width, initial-scale=1">
+	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
 	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 	$MetaTags(false)
 	<!--[if lt IE 9]>
@@ -26,9 +26,9 @@ Change it, enhance it and most importantly enjoy it!
 	<% require themedCSS('typography') %>
 	<% require themedCSS('form') %>
 	<% require themedCSS('layout') %>
-	<link rel="shortcut icon" href="$resourceURL('themes/simple/images/favicon.ico')" />
+	<link rel="shortcut icon" href="$ThemeDir/images/favicon.ico" />
 </head>
-<body class="$ClassName.ShortName<% if not $Menu(2) %> no-sidebar<% end_if %>" <% if $i18nScriptDirection %>dir="$i18nScriptDirection"<% end_if %>>
+<body class="$ClassName<% if not $Menu(2) %> no-sidebar<% end_if %>" <% if $i18nScriptDirection %>dir="$i18nScriptDirection"<% end_if %>>
 <% include Header %>
 <div class="main" role="main">
 	<div class="inner typography line">
@@ -37,8 +37,9 @@ Change it, enhance it and most importantly enjoy it!
 </div>
 <% include Footer %>
 
-<% require javascript('//code.jquery.com/jquery-3.3.1.min.js') %>
-<% require themedJavascript('script') %>
+<% require javascript('framework/thirdparty/jquery/jquery.js') %>
+<%-- Please move: Theme javascript (below) should be moved to mysite/code/page.php  --%>
+<script type="text/javascript" src="{$ThemeDir}/javascript/script.js"></script>
 
 </body>
 </html>