Part One of a complete cleanup of Blue stylesheet and navigation menus.

svn: r18600
This commit is contained in:
Rob G. Healey 2011-12-14 23:00:33 +00:00
parent 11858a624d
commit 344f682367
3 changed files with 69 additions and 123 deletions

View File

@ -4233,11 +4233,11 @@ class SourceListPage(BasePage):
thead += trow thead += trow
header_row = [ header_row = [
(None, "RowLabel"), (None, "ColumnRowLabel"),
(_("Source Name|Name"), "Name") ] (_("Source Name|Name"), "ColumnName") ]
trow.extend( trow.extend(
Html("th", label or " ", class_ = "Column" + colclass, inline = True) Html("th", label or " ", class_ =colclass, inline =True)
for (label, colclass) in header_row) for (label, colclass) in header_row)
# begin table body # begin table body
@ -4245,14 +4245,14 @@ class SourceListPage(BasePage):
table += tbody table += tbody
for index, key in enumerate(keys): for index, key in enumerate(keys):
(source, handle) = source_dict[key] source, handle = source_dict[key]
trow = Html("tr") + ( trow = Html("tr") + (
Html("td", index + 1, class_ = "ColumnRowLabel", inline = True) Html("td", index + 1, class_ ="ColumnRowLabel", inline =True)
) )
tbody += trow tbody += trow
trow.extend( trow.extend(
Html("td", self.source_link(source, None), class_ = "ColumnName") Html("td", self.source_link(source, None), class_ ="ColumnName")
) )
# add clearline for proper styling # add clearline for proper styling

View File

@ -42,25 +42,14 @@ Unknown #000
===== Web Graphics ===== ===== Web Graphics =====
Males Web_Gender_Male.png Males Web_Gender_Male.png
Females Web_Gender_Female.png Females Web_Gender_Female.png
************************************************* *************************************************
*/
/* NarrativeWeb Styles
NarrativeWeb Styles
================================================= */ ================================================= */
body { body {
background-color: #000; background-color: #000;
color: #FFF; color: #00029D;
}
/* General Elements
================================================= */
button#FamilyMap, button#Next, button#Prev {
background-color: purple;
color: #FFF;
font: bold .8em sans-serif;
padding: 10px;
border: solid 2px #00029D;
} }
div { div {
margin: 0; margin: 0;
@ -153,13 +142,12 @@ p#description {
padding:1em 20px; padding:1em 20px;
} }
p#description:first-letter { p#description:first-letter {
color: #13A926; color: purple;
font-size: 36px; font-size: 36px;
font-weight: bold; font-weight: bold;
font-style: italic; font-style: italic;
} }
p a { p a {
color: #FFF;
text-decoration: underline; text-decoration: underline;
} }
sup { sup {
@ -173,20 +161,15 @@ ol {
padding-bottom: 0; padding-bottom: 0;
} }
ol li a { ol li a {
text-decoration: none; text-decoration: underline;
} }
ol li a:hover { ol li a:hover {
text-decoration: none; text-decoration: none;
} }
a { a {
color: #000;
text-decoration: underline; text-decoration: underline;
} }
a:visited {
color: #000;
}
a:hover { a:hover {
color: #000;
background-color: #BCEAF6; background-color: #BCEAF6;
text-decoration: none; text-decoration: none;
} }
@ -196,13 +179,11 @@ span.preposition {
} }
.grampsid { .grampsid {
font:normal .8em/1.2em monospace; font:normal .8em/1.2em monospace;
color: #000;
} }
/* Menu Elements /* Menu Elements
================================================= */ ================================================= */
div#navigation ul, div#subnavigation ul { div#navigation ul, div#subnavigation ul {
font: normal .9em sans-serif;
background-color: #00029D; background-color: #00029D;
} }
div#navigation ul li, div#navigation ul li,
@ -211,7 +192,7 @@ div#subnavigation ul li {
} }
#navigation ul li:after, #subnavigation ul li:after, #navigation ul li:after, #subnavigation ul li:after,
#alphabet ul li:after { #alphabet ul li:after {
color: #139A26; color: #FFF;
} }
div#navigation ul li a, div#subnavigation ul li a { div#navigation ul li a, div#subnavigation ul li a {
color: #FFF; color: #FFF;
@ -222,9 +203,9 @@ div#subnavigation ul li a:hover {
} }
div#navigation ul li.CurrentSection a, div#navigation ul li.CurrentSection a,
div#subnavigation ul li.CurrentSection a { div#subnavigation ul li.CurrentSection a {
background-color: #BCEAF6; background-color: #FFF;
font: bold 14px sans; color: #00029D;
color: #000; font: bold .9em sans;
} }
div#navigation ul li.CurrentSection a:hover { div#navigation ul li.CurrentSection a:hover {
background-color: #BCEAF6; background-color: #BCEAF6;
@ -238,7 +219,7 @@ div#subnavigation ul li.CurrentSection a:hover {
/* Gramps Styled Notes /* Gramps Styled Notes
------------------------------------------------------- */ ------------------------------------------------------- */
div#grampsstylednote a { div#grampsstylednote a {
color: Navy; background-color: #BCEAF6;
text-decoration: underline; text-decoration: underline;
} }
@ -246,10 +227,14 @@ div#grampsstylednote a {
----------------------------------------------------- */ ----------------------------------------------------- */
div#header { div#header {
background-color: #00029D; background-color: #00029D;
border-bottom: solid 8px #13A926; border-bottom: solid 4px #13A926;
height: 65px;
width: 100%; width: 100%;
overflow: hidden; overflow: hidden;
color: #FFF;
}
div#header a {
text-decoration: underline;
color: #FFF;
} }
#SiteTitle { #SiteTitle {
margin:0; margin:0;
@ -280,7 +265,6 @@ div#footer {
clear: both; clear: both;
overflow: hidden; overflow: hidden;
width: 100%; width: 100%;
height: 70px;
font-size: 12px; font-size: 12px;
line-height: 130%; line-height: 130%;
color: #FFF; color: #FFF;
@ -288,14 +272,10 @@ div#footer {
background-color: #00029D; background-color: #00029D;
border-top: solid 8px #13A926; border-top: solid 8px #13A926;
} }
div#footer a, div#footer a:visited { div#footer a {
text-decoration: none; text-decoration: underline;
color: #FFF; color: #FFF;
} }
div#footer a:hover {
color: #000;
text-decoration: none;
}
div#footer img { div#footer img {
border: 0; border: 0;
margin: 0 auto; margin: 0 auto;
@ -310,18 +290,17 @@ div#footer p#createdate {
div#footer p#copyright { div#footer p#copyright {
float: right; float: right;
text-align: right; text-align: right;
color: #FFF;
margin: 10px 10px 0px 0px; margin: 10px 10px 0px 0px;
} }
div#footer p#copyright img { div#footer p#copyright img {
float: right; float: right;
margin-right: 10px; margin-right: 10px;
margin-bottom: 10px;
} }
#user_footer { #user_footer {
width: 70%; width: 70%;
float: left; float: left;
margin: 1em; margin: 1em;
color: #FFF;
} }
#user_footer p { #user_footer p {
font: normal 1em/1.2em serif; font: normal 1em/1.2em serif;
@ -335,35 +314,22 @@ table.infolist {
width: 100%; width: 100%;
margin: 0; margin: 0;
padding: 0; padding: 0;
font-size: 12px; font-size: .8em;
} }
table.infolist thead tr th { table.infolist thead tr th {
font: normal 1.1em/1.2em serif; color: #00029D;
color: #000; margin-left: 5px;
margin: 0; padding-left: 20px;
padding: .2em 10px;
background-color: #BCEAF6; background-color: #BCEAF6;
border: solid 1px #000; border: solid 1px #000;
} }
table.infolist thead tr th a {
color: #000;
}
table.infolist thead tr th a:hover {
background-color: #00029D;
color: #FFF;
}
table.infolist tr td { table.infolist tr td {
font: normal .9em serif; border-bottom: dashed 1px #000;
vertical-align: middle; vertical-align: middle;
padding: 6px 0 6px 10px; padding: 6px 0 6px 10px;
} }
table.infolist tr td a { table.infolist tr td a {
display: block; display: block;
text-decoration: none;
color: #000;
}
table.infolist tbody tr td {
border-bottom: dashed 1px #000;
} }
table.infolist tr.BeginLetter td, table.infolist tr.BeginSurname td { table.infolist tr.BeginLetter td, table.infolist tr.BeginSurname td {
border-top: solid 1px #000; border-top: solid 1px #000;
@ -375,31 +341,39 @@ table.infolist tr td.ColumnLetter {
table.infolist tbody tr td.ColumnDate { table.infolist tbody tr td.ColumnDate {
width: 12%; width: 12%;
} }
table.infolist tbody tr td.ColumnBirth { table.infolist tbody tr td.ColumnBirth,
font-size:.9em;
width: 10%;
}
table.infolist tbody tr td.ColumnDeath { table.infolist tbody tr td.ColumnDeath {
font-size:.9em; width: 12%;
width: 10%;
} }
table.infolist tbody tr td.ColumnRowLabel { table.infolist tbody tr td.ColumnRowLabel {
width: 2%; width: 2%;
padding-left: 20px; padding-left: 20px;
} }
table.infolist tbody tr td.ColumnRowLabel a { table.infolist tr td.ColumnRowLabel a {
background: none; background: none;
} }
table.infolist tbody tr td.ColumnType { table.infolist tr td.ColumnType {
width: 6%; width: 6%;
padding-left: 20px; padding-left: 20px;
} }
table.infolist tbody tr td.ColumnPartner { table.infolist tr td.ColumnAttribute {
font-size:.9em; width: 10%;
width: 20%;
} }
table.infolist tbody tr td.ColumnParents { table.infolist tr td.ColumnValue {
font-size: .9em; width: 40%;
}
table.infolist tr td.ColumnName {
width: 30%;
}
table.infolist tr td.ColumnName:first-letter {
color: #903;
font-weight: bold;
}
table.infolist tr td.ColumnPartner {
width: 30%;
}
table.infolist tr td.ColumnParents {
width: 30%;
} }
table.infolist tbody tr td.ColumnParents span.father, table.infolist tbody tr td.ColumnParents span.father,
table.infolist tbody tr td.ColumnParents span.mother { table.infolist tbody tr td.ColumnParents span.mother {
@ -421,14 +395,12 @@ div#Individuals table.individuallist {
div#Individuals table.individuallist tbody tr td.ColumnSurname a:hover, div#Individuals table.individuallist tbody tr td.ColumnSurname a:hover,
div#Individuals table.individuallist tbody tr td.ColumnSurname a:active { div#Individuals table.individuallist tbody tr td.ColumnSurname a:active {
cursor: default; cursor: default;
color: #000;
background: none; background: none;
} }
div#Individuals table.individuallist tbody tr td.ColumnName a { div#Individuals table.individuallist tbody tr td.ColumnName a {
vertical-align: middle; vertical-align: middle;
} }
div#Individuals div table.infolist tr td p { div#Individuals div table.infolist tr td p {
font:normal .9em/1.2em sans-serif;
vertical-align: top; vertical-align: top;
} }
div#Individuals div table.infolist tr td p a { div#Individuals div table.infolist tr td p a {
@ -439,11 +411,11 @@ div#IndividualDetail {
margin: 0; margin: 0;
} }
#IndividualDetail div#summaryarea table.infolist tr td { #IndividualDetail div#summaryarea table.infolist tr td {
font: normal .9em/1.2em sans-serif;
vertical-align: top; vertical-align: top;
border: none; border: none;
} }
div#IndividualDetail div#summaryarea table.infolist tr td a { div#IndividualDetail div#summaryarea table.infolist tr td a {
text-decoration: underline;
display: inline; display: inline;
} }
div#IndividualDetail table.infolist tr td a:hover { div#IndividualDetail table.infolist tr td a:hover {
@ -457,10 +429,6 @@ div#IndividualDetail div.subsection table tr td:first-child {
} }
#familymap a.familymap { #familymap a.familymap {
margin-left:20px; margin-left:20px;
text-decoration:none;
}
#familymap a.familymap:hover {
text-decoration:underline;
} }
/* Surnames /* Surnames
@ -917,22 +885,6 @@ div#Download table.download td.ColumnModified {
margin: 0; margin: 0;
padding: 0; padding: 0;
} }
div#Sources table.infolist tbody tr td {
border-bottom: dashed 1px #000;
}
div#Sources table.infolist tbody tr td.ColumnName {
padding:0;
}
div#Sources table.infolist tbody tr td.ColumnName a {
font-size:.9em;
padding:.1em 10px .3em 10px;
}
div#SourceDetail table.source tbody tr td.ColumnAttribute {
width: 40%;
}
div#SourceDetail table.source tbody td td.ColumnValue {
width: 40%;
}
div#SourceDetail div#references ol li { div#SourceDetail div#references ol li {
padding-bottom: .5em; padding-bottom: .5em;
} }

View File

@ -20,22 +20,14 @@
# Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA 02111-1307 USA # Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA 02111-1307 USA
# #
************************************************************************************************** ******************************************************
GRAMPS Cascading Style Sheet GRAMPS Cascading Style Sheet
Style Name: Web_Navigation-Horizontal.css Style Name: Web_Navigation-Horizontal.css
*************************************************************************************************** ******************************************************
# $Id: $ # $Id$
Body Element Navigation
----------------------------------------------------- */
body {
margin: 0 auto;
padding: 5px;
width: 969px;
}
/* Navigation
----------------------------------------------------- */ ----------------------------------------------------- */
div#navigation, div#subnavigation { div#navigation, div#subnavigation {
width: 100%; width: 100%;
@ -45,7 +37,6 @@ div#navigation, div#subnavigation {
div#navigation ul, div#subnavigation ul { div#navigation ul, div#subnavigation ul {
list-style: none; list-style: none;
min-width: 900px; min-width: 900px;
height: 24px;
margin: 0; margin: 0;
padding: 0px 0px 0px 18px; padding: 0px 0px 0px 18px;
border-bottom: solid 2px #000; border-bottom: solid 2px #000;
@ -57,18 +48,19 @@ div#navigation ul li a, div#subnavigation ul li a {
display: block; display: block;
padding: 4px 12px 7px 1px; padding: 4px 12px 7px 1px;
float: left; float: left;
font: .8em bold italic small-caps verdana, serif; font-size: .8em;
font-weight: bold;
font-family: Helvetica, Arial, sans;
text-decoration: none; text-decoration: none;
margin: 0; margin: 0;
} }
#navigation ul li.CurrentSection a, #subnavigation ul li.CurrentSection a { #navigation ul li.CurrentSection a, #subnavigation ul li.CurrentSection a {
padding: 3px 0px 3px 1px;
border-width: 0px 1px 1px 1px; border-width: 0px 1px 1px 1px;
border-style: solid; border-style: solid;
border-color: #000; border-color: purple;
} }
#subnavigation ul li.CurrentSection a { #subnavigation ul li.CurrentSection a {
border-width: 0 0 1px 0; border-width: 0px 0px 1px 0px;
} }
/* Alphabet Navigation /* Alphabet Navigation
@ -80,25 +72,27 @@ div#alphabet {
div#alphabet ul { div#alphabet ul {
list-style: none; list-style: none;
min-width: 770px; min-width: 770px;
height: 32px; height: 24px;
margin: 0; margin: 0;
padding: 0px 0px 0px 16px; padding: 0px 0px 0px 16px;
border-width: 2px 0px 4px 0px; border-width: 2px 0px 4px 0px;
border-style: solid; border-style: solid;
border-color: #000; border-color: #000;
} }
div#alphabet ul li:after {
content: " |";
}
div#alphabet ul li { div#alphabet ul li {
margin: 0; margin: 0;
float: left; float: left;
} }
div#alphabet ul li:after {
content: " |";
}
div#alphabet ul li a { div#alphabet ul li a {
display: block; display: block;
padding: 8px 8px 8px 8px; padding: 8px 8px 8px 8px;
float: left; float: left;
font: 1em bold sans; font-size: .8em;
font-weight: bold;
font-family: sans-serif;
margin: 0; margin: 0;
text-decoration: none; text-decoration: none;
} }