tonyair/silverstripe-simple
1
0
Fork 0
mirror of https://github.com/silverstripe/silverstripe-simple synced 2024-10-22 11:05:50 +02:00
Code Issues Projects Releases Wiki Activity

Merge pull request #15 from clarkepaul/forms-type

Browse Source 
FIX basic updates to enhance usability and appearance of theme
This commit is contained in:
Will Rossiter 2012-10-10 00:24:29 -07:00
commit 037eac159e
6 changed files with 134 additions and 76 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

140
css/layout.css
View File

@ -62,7 +62,7 @@ body {
}
/* Brand */
.brand, .brand:hover {
header .brand, header .brand:hover {
float: left;
color: #fff;
display: inline-block;
@ -82,34 +82,30 @@ body {
margin-bottom: 22px;
}
/* Search form */ /* TODO: make sure this is not double up from form.css */
/* Search form */
.search-bar {
position: absolute;
right: 30px;
top: 34px;
right: 28px;
top: 32px;
}
.search-bar form fieldset {
position: relative;
padding: 0;
.search-bar #Search {
margin: 0;
padding: 0;
}
.search-bar form input.text {
width: 155px;
padding:6px 35px 6px 10px;
padding: 5px 34px 5px 10px;
color: #888;
margin: 0;
border: none;
border-radius: 20px;
border-radius: 14px;
background: #fff;
font-family: Arial, Helvetica, sans-serif;
}
.search-bar form input.active {
color: #000
}
.search-bar form input.action {
font-size: 15px;
font-size: 14px;
position: absolute;
right: 3px;
right: 0;
top: -1px;
cursor: pointer;
border: none;
@ -118,8 +114,9 @@ body {
font-family: 'WebSymbolsRegular';
color: #848484;
border-radius: 0;
margin-top:0;
margin: 0;
}
.search-bar form input.active,
.search-bar form input.action:hover {
color: #000
}
@ -127,14 +124,12 @@ body {
.header textarea:focus {
outline: none
}
#Search {
padding:0;
}
.search-dropdown-icon {
display: none
}
/* NAVIGATION */
/* Primary navigation */
@ -143,7 +138,7 @@ body {
}
.header .primary li {
float: left;
padding-bottom: 17px;
padding-bottom: 14px;
margin: 0 5px;
position: relative;
white-space: nowrap;
@ -190,13 +185,11 @@ body {
float: left;
clear: both;
position: relative;
margin: 20px 0 4px -12px;
margin: 20px 0 0 -13px;
white-space: nowrap;
right: auto;
}
.tablet-nav .header .primary ul li {
margin-bottom: 10px;
padding-bottom: 0;
white-space: nowrap;
}
.tablet-nav .header .primary ul li a {
@ -204,15 +197,6 @@ body {
-webkit-transition: none;
transition: none;
}
.tablet-nav .header .primary ul li.current a,
.tablet-nav .header .primary ul li.section a {
background-color: #525252;
border-radius: 4px;
}
.tablet-nav .header .primary li.section:after,
.tablet-nav .header .primary li.current:after {
display: none
}
.tablet-nav .footer .right {
float: left;
width: 100%;
@ -252,13 +236,12 @@ body {
-webkit-transition: 0.2s;
transition: 0.2s;
}
.main .secondary li:hover .arrow {
.main .secondary li a:hover .arrow {
left: 6px
}
.main .secondary li a {
padding: 10px 0;
display: block;
width: 100%;
text-transform: uppercase;
letter-spacing: 2px;
font-size: 11px;
@ -271,9 +254,12 @@ body {
padding-left: 28px;
display: block;
}
.main .secondary li.current a.current {
color: #b80000;
}
.main .secondary li.section,
.main .secondary li.current {
background-color: #f7f7f7
background-color: #f1f1f1
}
.main .secondary li.section a,
.main .secondary li.current a {
@ -283,6 +269,41 @@ body {
color: #aaa;
}
/* Secondary navigation 2-5 levels deep */
.main .secondary ul ul {
display: none;
}
.secondary ul li.current ul,
.secondary ul li.section ul { /* Only show child pages from selected parent */
display: block;
}
.secondary li.current ul ul {
display: none;
}
.main .secondary ul ul li a { padding-left: 10px; } /* Indent all sidebar navigation levels*/
.main .secondary ul ul li a .arrow { left: 12px; }
.main .secondary ul ul li a:hover .arrow { left: 16px; }
.main .secondary ul ul ul li a { padding-left: 20px; }
.main .secondary ul ul ul li a .arrow { left: 22px; }
.main .secondary ul ul ul li a:hover .arrow { left: 26px; }
.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; }
.main .secondary li a:hover,
.main .secondary li.section a:hover,
.main .secondary li.current a:hover {
color: #b80000;
}
/* MIXED */
header:after,
@ -304,6 +325,8 @@ footer:after {
-webkit-transition: color 0.2s;
transition: color 0.2s;
}
.footer a.brand { color: #333; margin-left: 0; }
.footer a.brand:hover { color: #B80000; }
body h1 span.amp {
font-family: Baskerville,"Goudy Old Style","Palatino","Book Antiqua",Georgia;
font-style: italic;
@ -313,17 +336,21 @@ body h1 span.amp {
/* PAGE SPECIFIC LAYOUT */
/* Homepage */
/* Search Results */ /* TODO: Test search results styles */
.searchResults h1 {
font-size: 36px;
margin-bottom: 15px;
}
/* Search Results */
.typography .searchResults h1 {
margin-bottom: 0;
padding-bottom: 0;
border-bottom: none;
} /* TODO: Test search results styles */
.searchResults p.searchQuery {
color: #333;
margin-bottom: 10px;
font-size: 15px;
font-weight: bold;
}
.searchResults ul#SearchResults {
padding: 0
padding: 0;
margin-left: 0;
border-bottom: 1px solid #e5e5e5;
}
.searchResults ul#SearchResults li {
border-top: 1px solid #e5e5e5;
@ -331,13 +358,7 @@ body h1 span.amp {
list-style-type: none;
}
.searchResults ul#SearchResults p {
margin-bottom: 12px
}
.searchResults ul#SearchResults a.searchResultHeader {
font-size: 16px;
font-weight: bold;
margin-bottom: 6px;
display: block;
margin-bottom: 10px
}
.searchResults #PageNumbers {
border-top: 1px solid #e5e5e5;
@ -373,10 +394,10 @@ body h1 span.amp {
line-height: 22px;
}
.footer a {
color: #999
color: #999;
}
.footer a:hover {
color: #000
color: #B90000
}
.footer .left {
float: left;
@ -534,6 +555,13 @@ body h1 span.amp {
.header .primary ul li a:hover {
color: inherit
}
.header .primary li.section:after,
.header .primary li.current:after {
display: none;
}
.tablet-nav .header nav.primary ul li {
padding: 0;
}
/* Search Form */
.search-bar {
@ -543,7 +571,7 @@ body h1 span.amp {
right: 0;
display: none;
padding: 20px 0;
margin: 0;
margin: 80px 0 0;
background-color: #E7E7E7;
}
.search-dropdown-icon {
@ -693,7 +721,11 @@ body h1 span.amp {
/* Simple theme custom print styles */
.header,
.footer {
display: none
.footer,
.nav-open-button,
.search-bar,
.search-dropdown-icon,
nav.primary {
display: none;
}
}

6
css/typography.css
View File

@ -53,8 +53,8 @@ body {
.typography h6 {
font-family: "CamboRegular", Georgia, "Times New Roman", Times, serif;
font-weight: normal;
color: #b80000;
margin-bottom: 10px;
color: #444;
}
.typography h1 { font-size: 36px;
line-height: 45px;
@ -95,9 +95,11 @@ body {
.typography a.intro {
color: #B80000;
text-decoration: none;
}
.typography a:hover {
color: #D80000;
border-bottom: 1px dashed #B80000;
}
.typography a:hover { color: #D80000; }
.typography a:focus { }

4
templates/Includes/Footer.ss
View File

@ -1,6 +1,8 @@
<footer class="footer" role="contentinfo">
<div class="inner copy">
<div class="left">$SiteConfig.Title <span class="arrow">&rarr;</span> <% include Navigation %></div>
<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 <a href="http://www.saratusar.com">Sara</a> (Innovatif) / Powered by <a href="http://silverstripe.org">Silverstripe</a></small>
</div>
</footer>

4
templates/Includes/SideBar.ss
View File

@ -7,8 +7,8 @@
<% end_loop %>
</h3>
<ul>
<% loop Menu(2) %>
<li class="$LinkingMode"><a href="$Link" title="Go to the $Title.XML page"><span class="arrow">&rarr;</span><span class="text">$MenuTitle.XML</span></a></li>
<% loop Menu(1) %>
<% include SidebarMenu %>
<% end_loop %>
</ul>
</nav>

18
templates/Includes/SidebarMenu.ss Normal file
View File

@ -0,0 +1,18 @@
<!--Include SidebarMenu recursively /-->
<% if Children %>
<% loop Children %>
<li class="$LinkingMode">
<a href="$Link" class="$LinkingMode" title="Go to the $Title.XML page">
<span class="arrow">&rarr;</span>
<span class="text">$MenuTitle.XML</span>
</a>
<% if Children %>
<ul>
<% include SidebarMenu %>
</ul>
<% end_if %>
</li>
<% end_loop %>
<% end_if %>

8
templates/Layout/Page_results.ss
View File

@ -2,21 +2,25 @@
<h1>$Title</h1>
<% if Query %>
<p class="searchQuery"><strong>You searched for &quot;{$Query}&quot;</strong></p>
<p class="searchQuery">You searched for &quot;{$Query}&quot;</p>
<% end_if %>
<% if Results %>
<ul id="SearchResults">
<% control Results %>
<li>
<a class="searchResultHeader" href="$Link">
<h4>
<a href="$Link">
<% if MenuTitle %>
$MenuTitle
<% else %>
$Title
<% end_if %>
</a>
</h4>
<% if Content %>
<p>$Content.LimitWordCountXML</p>
<% end_if %>
<a class="readMoreLink" href="$Link" title="Read more about &quot;{$Title}&quot;">Read more about &quot;{$Title}&quot;...</a>
</li>
<% end_control %>