diff --git a/src/plugins/webstuff/css/Web_Basic-Ash.css b/src/plugins/webstuff/css/Web_Basic-Ash.css
index 27657942a..0297df7ce 100644
--- a/src/plugins/webstuff/css/Web_Basic-Ash.css
+++ b/src/plugins/webstuff/css/Web_Basic-Ash.css
@@ -20,6 +20,7 @@ Go to to learn more!
Copyright 2008 Jason M. Simanek
Copyright 2009 Stephane Charette
Copyright (C) 2008-2011 Rob G. Healey
+Copyright 2011 Michiel D. Nauta
This file is part of the GRAMPS program.
@@ -39,13 +40,16 @@ Color Palette
--------------------------------------------------------------------------------------------------
black #000
-gray dark #333
+gray dark #555
gray #999
gray light #CCC
gray very light #EEE
white #FFF
--------------------------------------------------------------------------------------------------
-
+Characteristic of this style is that it uses the full width of the browser
+window and that horizontal highlighting bars extend over the full width of
+the page.
+--------------------------------------------------------------------------------------------------
# $Id$
NarrativeWeb Styles
@@ -55,1212 +59,592 @@ white #FFF
----------------------------------------------------- */
body {
- font-family:sans-serif;
- color:#000;
- margin:0;
- padding:0;
- background-color:#FFF;
+ font-family: sans-serif;
+ font-size: 90%;
+ color: black;
+ margin: 0px;
+ background-color: #EEE;
}
-div {
- margin:0;
- padding:0;
-}
-img {
- border:none;
- margin:0;
-}
-.thumbnail a:hover {
- background:none;
+body > div {
+ clear: both;
}
.content {
- padding-top: 1cm;
- background-color:#FFF;
+ background-color: white;
+ border-top: solid 1px #999;
}
.content div.snapshot {
- float:right;
- margin:20px;
- padding:0;
- background:none;
-}
-.content div.snapshot div.thumbnail {
- margin:0;
- padding:0;
- background:none;
+ float: right;
+ margin: 2em;
}
.fullclear {
- width:100%;
- height:1px;
- margin:0;
- padding:0;
- clear:both;
+ clear: both;
}
/* General Text
----------------------------------------------------- */
h1 {
- font-size:1.4em;
- font-weight:bold;
- margin:0;
-}
-h2 {
- display:none;
+ font-size: x-large;
+ font-weight: bold;
+ padding-left: 15px;
}
h3 {
- font-size:1.2em;
- font-weight:bold;
- margin-left:12px;
- text-align:left;
- margin:0;
- padding:.5em 20px .2em 20px;
+ font-size: large;
+ padding-left: 15px;
}
h4 {
- font-size:.8em;
- color:#333;
- margin:0;
- padding:.2em 0 .2em 20px;
- background-color:#EEE;
- border-bottom:solid 1px #999;
-}
-h5, h6 {
- font-style:italic;
- margin:1.3em 0 .5em 1em;
-}
-p {
- font-size:14px;
- line-height:17px;
- margin:0;
+ font-size: medium;
+ background-color: #CCC;
+ padding-left: 15px;
+ margin-bottom: 0px;
+ border-bottom: solid 1px #999;
}
p#description {
- padding:0 15px 1em 15px;
+ padding-left: 15px;
}
-p a:link {
- text-decoration:underline;
+a {
+ color: black;
+ text-decoration: none;
}
-sup {
- line-height:0;
-}
-ol {
-}
-ol li a {
- text-decoration:none;
-}
-a:link {
- color:#000;
- text-decoration:underline;
-}
-a:hover, a:active {
- background-color:#EEE;
- color:#000;
- text-decoration:underline;
-}
-a:visited {
- color:#000;
- text-decoration:underline;
+a[href]:hover, a[href]:active {
+ text-decoration: underline;
}
.grampsid {
- font:normal .8em/1.2em monospace;
- color:#999;
+ font-family: monospace;
+ font-size: smaller;
+ color: #999;
}
/* Header
----------------------------------------------------- */
-#header {
- padding:15px 15px 2px 15px;
- margin:0;
- background-color:#EEE;
-}
#SiteTitle {
- color:#333;
- margin:0 0 3px 0;
+ color: #555;
}
-#header p {
- font-size:1em;
- font-weight:bold;
- color:#999;
- margin:0;
+#user_header, #user_footer {
+ padding-left: 15px;
}
/* Navigation
----------------------------------------------------- */
#navigation, #subnavigation {
- margin:0;
- padding:4px 0 0 0;
- background-color:#EEE;
+ border: solid 1px #EEE; /* needed by IE7 */
+}
+#subnavigation ul {
+ overflow: hidden;
}
#navigation ul, #subnavigation ul {
- list-style:none;
- min-width:770px;
- height:22px;
- margin:0;
- padding:0 0 0 12px;
- border-bottom:1px solid #999;
+ list-style: none;
+ margin: 0px;
+ padding-left: 15px;
+}
+#subnavigation ul {
+ border-bottom: solid 1px #999;
}
#navigation ul li, #subnavigation ul li {
- margin:0;
- padding:0;
- float:left;
+ float: left;
}
#navigation ul li a, #subnavigation ul li a {
- display:block;
- font-size:12px;
- line-height:100%;
- font-weight:bold;
- text-decoration:none;
- margin:0;
- padding:5px 5px;
- background-color:#EEE;
+ display: block;
+ font-size: smaller;
+ font-weight: bold;
+ padding: 5px;
+ border-bottom: solid 1px #EEE;
}
#navigation ul li a:hover, #subnavigation ul li a:hover {
- background-color:#CCC;
- border-bottom:solid 1px #000;
+ text-decoration: none;
+ background-color: #CCC;
+ border-bottom: solid 1px black;
}
-#navigation ul li.CurrentSection a, #subnavigation ul li.CurrentSection a {
- padding-bottom:4px;
- border-top:solid 1px #999;
- border-right:solid 1px #999;
- border-left:solid 1px #999;
- border-bottom:solid 1px #FFF;
- background-color:#FFF;
-}
-#navigation ul li.CurrentSection a:hover {
- background-color:#FFF;
+#navigation ul li.CurrentSection a {
+ position: relative;
+ top: 1px;
+ border: solid 1px #999;
+ border-bottom-style: none;
+ background-color: white;
}
#subnavigation ul li.CurrentSection a {
- border-width:0 0 1px 0;
+ background-color: white;
}
-
/* Alphabet Navigation
----------------------------------------------------- */
-div#alphabet {
- width: 100%;
- margin: 0;
+#alphabet {
background-color: #EEE;
}
-div#alphabet ul {
- list-style:none;
- min-width:770px;
- height:24px;
- margin:0;
- padding: 0px 0px 0px 16px;
+#alphabet ul {
+ list-style: none;
border-width: 2px 0px 4px 0px;
border-style: solid;
- border-color: #000;
+ border-color: black;
+ margin: 0px;
+ padding-left: 15px;
+ /* float container stretch, see www.quirksmode.org/css/clearing.html */
+ overflow: hidden;
}
-div#alphabet ul li:after {
- content:" |";
+#alphabet ul li {
+ float: left;
+ font-size: larger;
+ font-weight: bold;
}
-div#alphabet ul li {
- margin:0;
- float:left;
+#alphabet ul li:after {
+ content: " |";
}
-div#alphabet ul li a {
+#alphabet ul li a {
display: block;
- padding: 4px 8px 4px 8px;
- float:left;
- font:bold 16px/100% sans;
- margin:0;
- text-decoration:none;
- color: #000;
+ padding: 4px 8px;
+ line-height: 100%;
+ float: left;
}
-div#alphabet ul li a:hover {
- background-color: #000;
- color: #FFF;
+#alphabet ul li a:hover {
+ text-decoration: none;
+ background-color: black;
+ color: white;
}
/* Main Table
----------------------------------------------------- */
table {
- font-size:14px;
- margin:0 15px;
- padding:0;
- border:none;
- border-collapse:collapse;
+ border-collapse: collapse;
+ width: 100%;
+}
+div#summaryarea > table.infolist,
+div#parents > table.infolist,
+h3 + table.infolist {
+ width: auto;
}
table tr th {
- font-weight: bold;
text-align: left;
- margin:0;
- padding:.1em 10px;
- background-color:#CCC;
- border-top:solid 1px #999;
- border-bottom:solid 1px #999;
+ background-color: #EEE;
+ border-top: solid 1px #999;
+ border-bottom: solid 1px #999;
}
-table.infolist tr th:first-child {
- border-left:solid 1px #999;
+table tr th:first-child {
+ border-left: solid 1px #999;
}
-table.infolist tr th:last-child {
- border-right:solid 1px #999;
+table tr th:last-child {
+ border-right: solid 1px #999;
}
-table.infolist tr th a {
- text-decoration:none;
+table.primobjlist tr th {
+ background-color: #CCC;
}
-table tr td {
- vertical-align:middle;
- padding:.1em 10px;
+table td, table th {
+ vertical-align: top;
+ padding-left: 1ex;
}
-table.infolist tr td a {
- display:block;
- text-decoration:none;
+table.primobjlist td {
+ vertical-align: middle;
}
-table.infolist tr.BeginLetter td, table.infolist tr.BeginSurname td {
- border-top:solid 1px #CCC;
+table td:first-child, table th:first-child {
+ padding-left: 15px;
}
-table.infolist tr th.ColumnQuantity {
- width:30%;
+table.primobjlist tr a {
+ display: block; /* make whole td clickable */
}
-table.infolist tr td.ColumnLetter {
- font-weight:bold;
+table.primobjlist tr.BeginLetter td, table.primobjlist tr.BeginSurname td {
+ border-top: solid 1px #CCC;
}
-table.infolist tbody tr td.ColumnBirth {
- font-size:.9em;
- width:10%;
+td.ColumnLetter, td.ColumnRowLabel {
+ font-weight: bold;
}
-table.infolist tbody tr td.ColumnDeath {
- font-size:.9em;
- width:10%;
+td.ColumnBirth, td.ColumnDeath, td.ColumnPartner, td.ColumnParents {
+ font-size: 90%;
}
-table.infolist tbody tr td.ColumnRowLabel {
- font-weight:bold;
- width:2%;
+table.infolist tr td ol {
+ margin: 0px;
}
-table.infolist tbody tr td.ColumnType {
- width:6%;
- padding-left:20px;
+#summaryarea table.infolist td.ColumnAttribute,
+#parents table.infolist td.ColumnAttribute,
+#families table.infolist td.ColumnType,
+#families table.infolist td.ColumnAttribute {
+ color: #555;
}
-table.infolist tbody tr td.ColumnPartner {
- font-size:.9em;
+/* div summaryarea is missing for events, sources and repos! */
+h3 + table.infolist td.ColumnAttribute {
+ color: #555;
}
-table.infolist tbody tr td.ColumnParents {
- font-size:.9em;
-}
-table.infolist tbody tr td.ColumnParents span.father, table.infolist tbody tr td.ColumnParents span.mother {
- display:block;
-}
-table.infolist tbody tr td.ColumnParents span.mother:before {
- content:"+ ";
-}
-table.infolist tbody p.EventNote {
- border-top:dashed 1px #CCC;
- padding-top:1em;
- padding-bottom:1em;
+table.primobjlist td.ColumnParents span.mother:before {
+ content: "+ ";
}
/* Surnames
----------------------------------------------------- */
-#Surnames { }
-#SurnameDetail p#description { padding-top:0; }
-table.surnamelist tbody tr td.ColumnSurname {
- width:50%;
+table#SortByName td.ColumnSurname, table#SortByName th.ColumnSurname,
+table#SortByCount td.ColumnQuantity, table#SortByCount th.ColumnQuantity {
+ background-color: #EEE;
}
-table.surnamelist thead tr th.ColumnSurname {
- padding:0;
+table#SortByName thead th.ColumnSurname a:after,
+table#SortByCount thead th.ColumnQuantity a:after {
+ content: " \2193";
}
-table.surnamelist thead tr th.ColumnQuantity {
- width:40%;
- padding:0;
-}
-table.infolist thead tr th.ColumnSurname a, table.infolist thead tr th.ColumnQuantity a {
- display:block;
- padding:.1em 10px;
-}
-table#SortByName thead tr th.ColumnSurname a, table#SortByCount thead tr th.ColumnQuantity a {
- background-color:#EEE;
-}
-table#SortByName thead tr th.ColumnSurname a:after, table#SortByCount thead tr th.ColumnQuantity a:after {
- content:" ↓";
-}
-table.infolist tbody tr td.ColumnSurname {
- padding:0;
- background-color:#EEE;
-}
-table.infolist tbody tr td.ColumnSurname a {
- padding:.1em 10px;
-}
-table.infolist tbody tr td.ColumnSurname a:hover {
- padding:.1em 10px;
- background-color:#CCC;
-}
-table.surname {
- border-bottom:solid 1px #EEE;
-}
-table.surname tbody tr td {
- border-bottom:dashed 1px #CCC;
-}
-table.surname tbody tr td.ColumnName {
- width:20%;
- padding:0;
- background-color:#EEE;
-}
-table.surname tbody tr td.ColumnName a {
- display:block;
- padding:.6em 10px .6em 20px;
-}
-table.surname tbody tr td.ColumnName a:hover {
- background-color:#CCC;
-}
-table.surname tbody tr td.ColumnName a span.grampsid {
- display:none;
-}
-table.surname thead tr th.ColumnParents, table.surname tbody tr td.ColumnParents {
- width:25%;
+table.surname td.ColumnName {
+ background-color: #EEE;
}
/* Individuals
----------------------------------------------------- */
-#Individuals { }
-#Individuals table.individuallist {
- border-bottom:solid 1px #EEE;
-}
-#Individuals table.individuallist tbody tr td {
- border-bottom:dashed 1px #CCC;
-}
-#Individuals table.individuallist tbody tr td a:hover {
- text-decoration:none;
-}
-table.individuallist tbody tr td.ColumnSurname {
- background:none;
-}
-table.individuallist tbody tr td.ColumnSurname a:hover, table.individuallist tbody tr td.ColumnSurname a:active {
- cursor:default;
- color:black;
- background:none;
-}
-table.individuallist tbody tr td.ColumnName {
- padding:0;
- background-color:#EEE;
-}
-table.individuallist tbody tr td.ColumnName a {
- display:block;
- padding:.6em 10px;
- vertical-align:middle;
-}
-table.individuallist tbody tr td.ColumnName a:hover {
- background-color:#CCC;
-}
-#Individuals div table.infolist tr td p {
- vertical-align:top;
-}
-#Individuals div table.infolist tr td p a {
- display:inline;
-}
-
-/* IndividualDetail
------------------------------------------------------- */
-#IndividualDetail {
- background-color:#EEE;
-}
-#IndividualDetail div table.infolist tr td {
- font:normal .9em/1.2em sans-serif;
- vertical-align:top;
-}
-#IndividualDetail div table.infolist tr td a {
- display:inline;
-}
-#IndividualDetail table.infolist tr td a:hover {
- text-decoration:underline;
-}
-#IndividualDetail table.infolist tbody tr td.ColumnAttribute {
- width:10%;
- color:#696969;
-}
-#IndividualDetail div.subsection table tr td:first-child {
- padding-left:20px;
-}
-#familymap a.familymap {
- margin-left:20px;
-}
-
-/* Subsections : Attributes
------------------------------------------------------ */
-div#attributes {
- margin: 0;
- padding: 0;
-}
-table.attrlist {
- width: 100%;
-}
-table.attrlist thead tr th {
- background-color: #70B1ED;
- color: #000;
-}
-table.attrlist tbody tr td {
- border-bottom: dashed 1px #000;
-}
-table.attrlist tbody tr td.ColumnType {
- width: 15%;
-}
-table.attrlist tbody tr td.ColumnValue {
- width: 15%;
-}
-table.attrlist tbody tr td.ColumnNotes {
- width: 40%;
-}
-table.attrlist tbody tr td.ColumnSources {
- width: 10%;
-}
-
-/* Sources
------------------------------------------------------ */
-#Sources table.infolist tbody tr td.ColumnRowLabel {
- padding-bottom:0;
-}
-#Sources table.infolist tbody tr td.ColumnName {
- padding:0;
-}
-#Sources table.infolist tbody tr td.ColumnName a {
- padding:.1em 10px .3em 10px;
-}
-#SourceDetail div#references ol li {
- padding-bottom:.5em;
-}
-
-/* Relationships
-================================================= */
-div#Relationships {
- font: normal 1em sans-serif;
- margin: 0 auto;
- padding: 0;
-}
-table.relationships {
- width: 100%;
- margin: 0;
- padding: 0;
-}
-table.relationships thead tr th.ColumnMarriage,
-table.relationships thead tr th.ColumnDivorce {
- width: 10%;
-}
-table.relationships thead tr th.ColumnHyper {
- width: 15%;
-}
-table.relationships thead tr th.ColumnMedia {
- width: 15%;
-}
-table.relationships tbody tr#FirstLetter {
- border-bottom: solid 1px #000;
-}
-table.relationships tbody tr td {
- border-bottom: dashed 1px #000;
-}
-table.relationships tbody tr td.ColumnRowLabel a {
- background: none;
+table.IndividualList td.ColumnSurname {
+ background-color: #EEE;
}
/* Places
----------------------------------------------------- */
-#Places table.infolist tbody tr td.ColumnName {
- padding:0;
-}
-#Places table.infolist tbody tr td.ColumnName a {
- padding:.1em 10px .3em 10px;
+#Places table.infolist td.ColumnName {
+ background-color: #EEE;
}
/* Events
----------------------------------------------------- */
#EventList table.infolist tr.BeginType td {
- border-top:dashed 1px rgb(204, 204, 204);
+ border-top:dashed 1px #CCC;
}
#EventList table.infolist tr.BeginLetter td {
- border-top:solid 1px rgb(204, 204, 204);
+ border-top:solid 1px #CCC;
}
-#EventList table.infolist tr td a,
-#EventDetail table.infolist tr td a {
+#EventList table.infolist td.ColumnType {
+ background-color: #EEE;
+}
+#EventList td.ColumnPerson a {
display: inline;
}
-#EventList table.infolist tr td span.father,
-#EventList table.infolist tr td span.mother,
-#EventDetail table.infolist tr td span.father,
-#EventDetail table.infolist tr td span.mother {
- display: block;
-}
-#EventList table.infolist tr td span.person:after,
-#EventList table.infolist tr td span.father:after,
-#EventList table.infolist tr td span.mother:after,
-#EventDetail table.infolist tr td span.person:after,
-#EventDetail table.infolist tr td span.father:after,
-#EventDetail table.infolist tr td span.mother:after {
+#EventList td.ColumnPerson span.person:after,
+#EventList td.ColumnPerson span.father:after,
+#EventList td.ColumnPerson span.mother:after,
+#EventDetail td.ColumnPerson span.person:after,
+#EventDetail td.ColumnPerson span.father:after,
+#EventDetail td.ColumnPerson span.mother:after {
content: ", ";
}
-#EventList table.infolist tr td span.person:last-child:after,
-#EventList table.infolist tr td span.father:last-child:after,
-#EventList table.infolist tr td span.mother:last-child:after,
-#EventDetail table.infolist tr td span.person:last-child:after,
-#EventDetail table.infolist tr td span.father:last-child:after,
-#EventDetail table.infolist tr td span.mother:last-child:after {
+#EventList td.ColumnPerson span.fatherNmother:after,
+#EventDetail td.ColumnPerson span.fatherNmother:after {
+ content: " + ";
+}
+#EventList td.ColumnPerson span.person:last-child:after,
+#EventList td.ColumnPerson span.father:last-child:after,
+#EventList td.ColumnPerson span.mother:last-child:after,
+#EventDetail td.ColumnPerson span.person:last-child:after,
+#EventDetail td.ColumnPerson span.father:last-child:after,
+#EventDetail td.ColumnPerson span.mother:last-child:after {
content: "";
}
/* Gallery
----------------------------------------------------- */
-#Gallery table.infolist tbody tr td.ColumnRowLabel, #Gallery table.infolist tbody tr td.ColumnDate {
- padding-bottom:0;
-}
-#Gallery table.infolist tbody tr td.ColumnName {
- padding:0;
-}
-#Gallery table.infolist tbody tr td.ColumnName a {
- padding:.1em 10px .3em 10px;
-}
-#Gallery table.infolist tbody tr td.ColumnName a:hover {
- background-color:#EEE;
-}
#GalleryNav {
- font-size:.8em;
- margin:1em 0 0 0;
- padding:1.2em 0 0 0;
- text-align:center;
+ text-align: center;
+ margin: 2em 0px;
}
#GalleryNav a {
- font-weight:bold;
- text-decoration:none;
- background-color:#EEE;
- border:solid 1px #999;
-}
-#GalleryNav a:hover {
- background-color:#CCC;
+ font-weight: bold;
+ background-color: #EEE;
+ border: solid 1px #999;
+ margin: 1em;
}
#GalleryNav a#Previous {
- padding:.4em .7em .3em .7em;
+ padding: .4em .7em .3em .7em;
}
#GalleryNav a#Next {
- padding:.4em 1.9em .3em 1.9em;
-}
-#GalleryPages {
- margin:0 1em;
+ padding: .4em 1.9em .3em 1.9em;
}
#GalleryCurrent {
- font-size:1.2em;
- font-weight:bold;
+ font-size: larger;
}
#GalleryTotal {
- font-weight:normal;
+ font-weight: normal;
}
#GalleryDisplay {
- margin:0 auto;
- padding:0;
- position:relative;
- overflow:hidden;
- text-align:center;
- border:solid 1px #999;
+ margin: 0px auto;
+ position: relative;
}
#GalleryDisplay img {
- margin:0 auto;
+ margin: 0px auto;
+ display: block;
+ border: solid 1px #999;
}
-#GalleryDetail div#summaryarea{
- margin:0;
- padding:1.4em 0 0 0;
-}
-#GalleryDetail div#summaryarea h3 {
- text-align:center;
-}
-#GalleryDetail div h4 {
- margin-top:0;
-}
-#GalleryDetail div#summaryarea table.gallery {
- width:100%;
- margin-top:1.5em;
- margin-bottom:0;
- padding-bottom:0;
- background-color:#EEE;
- border-style:solid;
- border-width:8px 0 0 0;
- border-color:#CCC;
-}
-
-/* Thumbnail Preview Reference Section
-------------------------------------------------- */
-body#ThumbnailPreview div#references {
- background-color: #FFF;
- color: #00029D;
- margin: 0 auto;
- padding: 0;
- width: 100%;
-}
-body#ThumbnailPreview div#references table.infolist tbody tr {
- border-bottom: dashed 1px #000;
-}
-body#ThumbnailPreview div#references table.infolist tbody tr td.ColumnRowLabel a {
- background: none;
- width: 2%;
-}
-body#ThumbnailPreview div#references table.infolist tbody tr td.ColumnName {
- width: 90%;
+#GalleryDetail h3 {
+ text-align: center;
}
/* Contact
----------------------------------------------------- */
+#Contact {
+ overflow: hidden;
+}
#Contact #summaryarea {
- width:600px;
- margin:2em auto;
- padding:3em;
- background-color:#EEE;
- border:solid 1px #999;
+ width: 50em;
+ margin: 2em auto;
+ padding: 3em;
+ background-color: #EEE;
+ border: solid 1px #999;
}
-#Contact #summaryarea img {
- float:right;
- margin:0;
- padding:0;
- border:solid 1px #999;
+#Contact img {
+ float: right;
+ border: solid 1px #999;
}
-#researcher {
- margin-top:.3em;
+#Contact #researcher, #Contact #researcher h3 {
+ font-size: larger;
+ padding-left: 0px;
}
-#researcher h3 {
- padding:0;
-}
-#researcher span {
- display:block;
- float:left;
- margin-right:.4em;
-}
-#streetaddress {
- width: 100%;
-}
-#locality, .locality {
+#Contact #streetaddress, #Contact #locality, #Contact #email {
display: block;
- width: 100%;
}
-#city:after {
- content:",";
-}
-#country {
- clear:left;
-}
-#email {
- clear:left;
-}
-#email a {
- text-decoration:none;
-}
-#email a:hover {
- text-decoration:underline;
+#Contact #city:after {
+ content: ",";
}
-/* Download
+/* Download
----------------------------------------------------- */
-#Download {
- padding:1cm;
- height:396px;
-}
-table.download {
- border:solid 2px #000;
- width:100%;
-}
-table.download img {
- float:center;
-}
-table.download thead tr th {
- text-align:center;
- border:solid 2px #000;
- color: #000;
- text-transform:uppercase;
-}
-table.download tbody tr#Row02 {
- border-bottom:solid 2px #000;
-}
-table.download thead tr th, table.download tbody tr td {
- padding-left:10px;
- padding-top:20px;
- border-style:solid;
- border-color:#000;
- border-width:0 2px 2px 2px;
- text-align:left;
-}
-table.download td.Description {
- width: 50%;
-}
-table.download td.License {
- width:8%;
-}
-table.download td.Filename {
- width:30%;
-}
-table.download td.Filename a {
- font-weight:bold;
- font-style: italic;
- text-decoration:none;
-}
-table.download td.Filename a:hover {
- text-decoration:underline;
-}
-table.download td.Modified {
- width:12%;
- font-weight:bold;
+#Download table.download a {
+ display: block;
}
-/* Subsections
+/* Subsection
----------------------------------------------------- */
-#Home, #Introduction, #Contact {
- padding:1.5em 0 3em 0;
+#Home, #Introduction {
+ overflow: hidden;
}
-#Home p, #Introduction p, #Contact p {
- margin:0 20px 1em 20px;
+#Home img, #Introduction img {
+ float: right;
+ margin: 1em;
+ max-width: 950px;
}
-#Home img, #Introduction img, #Contact img {
- float:right;
- margin:0;
- padding:0 20px 3em 20px;
+#Home p, #Introduction p {
+ padding-left: 15px;
}
-#Home a, #Introduction a, #Contact a {
- color: #000;
- text-decoration: none;
+.subsection {
+ clear: both;
+ overflow: hidden;
}
-div.subsection{
- padding-bottom:.5em;
- background-color:#FFF;
-}
-div.subsection h4 {
- margin-bottom:.5em;
-}
-div.subsection table, div.subsection ol, div.subsection p, div.subsection > a {
- font-size:.9em;
-}
-div.subsection a {
- text-decoration:none;
-}
-div.subsection a:hover {
- text-decoration:underline;
- background:none;
-}
-div.subsection table.infolist {
- width:100%;
- margin:0;
-}
-#IndividualDetail div.subsection table tr td:first-child {
- padding-left:20px;
+.subsection p {
+ margin: 0px;
}
-/* Subsections : Summary Area
+/* Subsection : Families
----------------------------------------------------- */
-div#summaryarea {
- min-height:100px;
- background:none;
-}
-div#summaryarea table.infolist {
- margin:0;
- padding:0;
- background:#FFF;
- border-bottom:solid .7em #FFF;
-}
-div#summaryarea table.infolist tr td, div#summaryarea table.infolist tr td p {
- vertical-align:top;
-}
-div#summaryarea table.infolist tr td a, div#summaryarea table.infolist tr td p a {
- display:inline;
-}
-div#summaryarea table.infolist tbody tr td.ColumnAttribute {
- width:14%;
- padding-left:20px;
-}
-
-/* Subsections : Events
------------------------------------------------------ */
-div#events {
- padding-bottom:0;
-}
-div#events h4 {
- margin-bottom:0;
-}
-div#events table.infolist {
- border-bottom:solid 1px #FFF;
-}
-div#events table.infolist tbody tr td {
- padding-top:.2em;
- padding-bottom:.2em;
-}
-#IndividualDetail div#events table.infolist thead tr th:first-child {
- padding-left:20px;
-}
-div#events table.infolist tbody tr td.ColumnAttribute {
- border-bottom:dashed 1px #CCC;
-}
-div#events table.infolist tbody tr td.ColumnValue {
- border-bottom:dashed 1px #CCC;
-}
-div#events table.infolist tbody tr td.ColumnValue p {
- margin:.1em 2em;
-}
-
-/* Subsections : Parents
------------------------------------------------------ */
-div#parents table.infolist tbody tr td.ColumnValue ol {
- margin:0;
- padding-top:0;
-}
-div#parents table.infolist tbody tr td.ColumnValue ol li {
- padding-bottom:.2em;
-}
-
-/* Subsections : Families
------------------------------------------------------ */
-div#families table.infolist tbody tr td.ColumnValue p {
- margin-top:0;
-}
-div#families table.infolist tbody tr td.ColumnValue ol {
- margin:0;
- padding-top:0;
-}
-div#families table.infolist tbody tr td.ColumnValue ol li {
- padding-bottom:.2em;
-}
div#families table.fixed_subtables table.eventlist {
- table-layout:fixed;
+ table-layout: fixed;
}
div#families table.fixed_subtables table.eventlist th:first-child {
- width:9em;
+ width: 9em;
}
div#families table.fixed_subtables table.eventlist th:last-child {
- width:5em;
+ width: 5em;
+}
+div#families table.attrlist td.ColumnType {
+ color: black;
}
-/* Subsections : Addresses
+/* Subsection : Gallery
----------------------------------------------------- */
-div#addresses {
- padding-bottom:0;
-}
-div#addresses h4 {
- margin-bottom:0;
-}
-div#addresses table.infolist {
- border-bottom:solid 1px #FFF;
-}
-div#addresses table.infolist tbody tr td {
- padding-top:.2em;
- padding-bottom:.2em;
-}
-div#addresses table.infolist tbody tr td.ColumnAttribute {
- width:30%;
- border-bottom:dashed 1px #CCC;
-}
-div#addresses table.infolist tbody tr td.ColumnValue {
- border-bottom:dashed 1px #CCC;
-}
-div#Addresses table.infolist tr td a, div#Addresses table.infolist tr td p a {
- display: inline;
-}
-
-/* Subsections : Attributes
------------------------------------------------------ */
-
-/* Subsections : Gallery
------------------------------------------------------ */
-#indivgallery h4 {
- margin-bottom:1em;
-}
#indivgallery .thumbnail {
- margin:0;
- float:left;
- width:130px;
- height:150px;
- text-align:center;
+ float: left;
+ max-width: 130px;
+ max-height: 150px;
+ font-size: smaller;
+ text-align: center;
+ margin: 0.8em 0.5em;
}
-#indivgallery .thumbnail a {
- display:block;
- margin:0;
- padding:0;
- background:none;
+#indivgallery h4 + .thumbnail {
+ margin-left: 15px;
+ /* Problem: if there are more thumnails then fit on a single row, the
+ * first thumnail on each next row should also have a margin-left
+ * of 15 px. */
}
-#indivgallery .thumbnail a img {
- margin:0;
- padding:0;
- border:solid 1px #999;
+#indivgallery img {
+ border: solid 1px #999;
}
-#indivgallery div.thumbnail span {
-/* ## remove this line and the comment markers from the line below to hide the description in Individual Gallery
+#indivgallery span {
+/* ## remove this line and the comment markers from the line below to hide description in Indivifual Gallery
display: none; */
-
- font-size:.6em;
- text-align:center;
- width:80%;
- margin:0 auto;
- padding:0;
}
-/* Subsections : Narrative
+/* Subsection : Narrative
----------------------------------------------------- */
-div.narrative {
- padding-bottom:0;
+h4 + div.grampsstylednote, a.familymap {
+ margin: 1em 15px;
}
-.narrative p {
- margin-top:.5em;
- margin-bottom:0;
- padding:0 20px 1em 20px;
+i + div.grampsstylednote p {
+ margin: 0px;
}
-/* Subsections : References
+/* Subsection : Family Map
----------------------------------------------------- */
-#references ol {
- margin-top:0;
- margin-bottom:0;
+a.familymap {
+ display: block;
}
-/* Subsections : Source References
+/* Subsection : Source References
----------------------------------------------------- */
-div#sourcerefs ol {
- list-style-type:decimal;
-}
-div#sourcerefs ol li ol {
- list-style-type:lower-alpha;
+#sourcerefs ol li ol {
+ list-style-type: lower-alpha;
}
-/* Subsections : Weblinks
------------------------------------------------------ */
-
-/* Subsections : Pedigree
+/* Subsection : Pedigree
----------------------------------------------------- */
.pedigreegen {
- font-size:.9em;
- list-style:none;
- margin:.5em 0 0 0;
- padding:0 0 .7em 20px;
+ list-style-type: none;
+ padding-left: 15px;
}
.pedigreegen li ol {
- list-style:none;
- margin-left:.5em;
-}
-.pedigreegen li ol li {
- padding-bottom:.2em;
+ list-style-type: none;
}
.pedigreegen li ol li ol {
- list-style:decimal;
- margin-left:1.6em;
+ list-style-type: decimal;
}
-.pedigreegen li ol li ol li ol.spouselist {
- font-size:1em;
- list-style:none;
- margin-left:0;
+.pedigreegen ol.spouselist {
+ list-style-type: none;
}
-.spouselist li.spouse ol {
- font-size:1em;
- list-style:decimal;
- margin-left:1.6em;
-}
-.spouse a {
- font-weight:normal;
+.pedigreegen ol.spouselist li.spouse ol {
+ list-style-type: decimal;
}
.spouse:before {
content: "+ ";
}
.thisperson {
- font-weight:bold;
+ font-weight: bold;
+}
+.thisperson > ol {
+ font-weight: normal;
}
/* Footer
----------------------------------------------------- */
#footer {
- clear:both;
- width:100%;
- font-size:12px;
- line-height:130%;
- color:#333;
- margin:0;
- padding:15px 0 0 0;
- background-color:#CCC;
- border-top:solid 1px #333;
+ clear: both;
+ padding-top: 1em;
+ background-color: #CCC;
+ border-top: solid 1px #555;
}
-#footer a, #footer a:visited {
- text-decoration:none;
- color:#333;
-}
-#footer a:hover {
- text-decoration:underline;
-}
-#footer img {
- border:0;
- margin:0 auto;
- vertical-align:middle;
+#footer > * {
+ background-color: #EEE;
}
#footer p#createdate {
- float:left;
- width:40%;
- text-align:left;
- margin-left:10px;
+ float: left;
+ width: 50%;
+ text-align: left;
+ padding-left: 15px;
+ margin-top: 1em;
}
#footer p#copyright {
- float:right;
- width:40%;
- text-align:right;
- margin-right:10px;
+ float: right;
+ width: 40%;
+ text-align: right;
+ padding-right: 15px;
}
-#footer p#copyright img {
- margin-right:10px;
-}
-#user_footer {
- width:70%;
- float:left;
- margin:1em;
-}
-#user_footer p {
- font:normal 1em/1.2em serif;
- margin:0;
- padding:0;
+
+/* Overwritten
+----------------------------------------------------- */
+body#FamilyMap {
+ background-color: #EEE ! important;
}
/* Calendar Styles
--------------------------------------------------------------------------------------------- */
-/* Calendar : General */
-body#WebCal {
- padding:0 14px;
- background-color:#333;
+===================================================== */
+table.calendar {
+ table-layout: fixed;
+ empty-cells: show;
}
-.calendar {
- empty-cells:show;
- width:100%;
- font-size:1em;
- font-weight:normal;
- margin:0;
- padding:0;
- border:none;
- border-collapse:collapse;
+.calendar thead th {
+ text-align: center;
+ border-top-style: none;
}
-.calendar thead tr th {
- width:14%;
- font-weight:bold;
- font-size:14px;
- line-height:14px;
- text-align:center;
- text-transform:uppercase;
- padding:2px 0;
+.calendar thead th.monthName {
+ font-size: xx-large;
+ font-weight: normal;
+ background-color: white;
+ border-bottom-style: none;
+ padding-top: 1em;
}
-.calendar thead tr th.monthName {
- width:100%;
- font-weight:normal;
- font-size:2em;
- line-height:100%;
- text-transform:none;
- color:#333;
- padding:.3em 0 .2em 0;
- background-color:#FFF;
- border-bottom-width:0;
+.calendar thead th abbr {
+ border-bottom-style: none;
}
-body#WebCal #CreatorInfo {
- float:right;
- font-size:12px;
- margin:-24px 10px 0 0;
-}
-.calendar thead tr th.weekend,
-.calendar thead tr th.weekday {
- color:#333;
- background-color:#EEE;
- border-style:solid;
- border-width:0 0 1px 0;
- border-color:#999;
-}
-.calendar thead tr th.saturday,
-.calendar thead tr th.sunday { }
-.calendar tfoot tr td {
- padding:.7em 5% 1em 5%;
- border-top:solid 4px #999;
+#CreatorInfo {
+ float: right;
+ margin: -1em 15px 0px 0px;
+ font-weight: bold;
+ color: #999;
}
.calendar tfoot tr td {
- vertical-align:middle;
- color:#333;
- background-color:#EEE;
+ border-top: solid 4px #999;
+ vertical-align: middle;
}
/* Calendar : Date Numeral */
-.calendar tbody tr td div.date {
- float:right;
- display:block;
- width:1.8em;
- font-weight:bold;
- font-size:1em;
- line-height:100%;
- text-align:center;
- color:#333;
- margin:0 0 0 .5em;
- padding:.2em 0;
- background-color:#CCC;
+.calendar div.date {
+ float: right;
+ width: 1.8em;
+ font-size: large;
+ text-align: center;
+ background-color: #CCC;
+ color: #555;
}
/* Calendar : Date Container */
-.calendar tbody tr td {
- vertical-align:top;
- height:10em;
- padding:0;
- border-width:1px 0 0 1px;
- border-style:solid;
- border-color:#CCC;
+.calendar td {
+ padding: 0px 0px 0px 1ex;
+ border-width: 1px 0px 0px 1px;
+ border-style: solid;
+ border-color: #CCC;
+ background-color: #EEE;
}
-.calendar tbody tr td.weekday {
- background-color:#FFF;
-}
-.calendar tbody tr td.weekend {
- background-color:#EEE;
-}
-.calendar tbody tr td.saturday {
-
- }
-.calendar tbody tr td:first-child {
- border-left:none;
+.calendar td:first-child {
+ border-left-style: none;
+ padding: 0px 0px 0px 1ex;
}
.calendar tbody tr:first-child td {
- border-top:none;
+ border-top-style: none;
}
/* Calendar : Date Detail */
-.calendar tbody tr td ul {
- list-style:none;
- font-family:sans-serif;
- font-size:.8em;
- margin:2.3em 0 .3em 0;
- padding:0;
+.calendar td ul {
+ font-size: smaller;
+ list-style: none;
+ padding: 0px;
}
-.calendar tbody tr td ul li {
- display:block;
- width:92%;
- margin:0 4%;
- padding:.2em 0 .3em 0;
- border-top:dashed 1px #C1B398;
+.calendar td ul li {
+ border-top: dashed 1px #CCC;
+ padding-top: 0.5em;
+ padding-bottom: 0.5em;
}
-.calendar tbody tr td ul li:first-child {
- border:none;
+.calendar td ul li:first-child {
+ border-style: none;
}
/* Calendar : Birthday, Anniversary, Highlight */
-.calendar tbody tr td ul li em {
- font-style:normal;
- color:#0A65B5;
+.calendar td.highlight {
+ background-color: white;
}
-.calendar tbody tr td ul li span.yearsmarried em {
- color:#453619;
-}
-.calendar tbody tr td.highlight {
- background-color:#E5F2FE;
-}
-.calendar tbody tr td.highlight div.date {
- color:#0A65B5;
- background-color:#C2E1FE;
+.calendar td.highlight div.date {
+ color: black;
+ background-color: #CCC;
}
/* Calendar : Previous-Next Month */
-.calendar tbody tr td.previous,
-.calendar tbody tr td.next,
-.calendar tbody tr td.previous div.date,
-.calendar tbody tr td.next div.date {
- color:#CCC;
- background-color:#EEE;
+.calendar td.previous,
+.calendar td.next,
+.calendar td.previous div.date,
+.calendar td.next div.date {
+ color: #CCC;
+ background-color: #EEE;
}
/* Calendar : Full Year */
body#fullyearlinked div.content {
- width:963px;
- margin:0 auto;
- padding:15px 0 2px 2px;
+ overflow: hidden;
}
body#fullyearlinked table.calendar {
- float:left;
- width:320px;
- height:18em;
- border:solid 1px #7D5925;
+ float: left;
+ width: 33.3%;
+ height: 18em;
+ border: solid 1px black;
}
-body#fullyearlinked table.calendar thead tr th {
- height:2em;
+body#fullyearlinked table.calendar thead th {
+ height: 2em;
}
-body#fullyearlinked table.calendar thead tr th.monthName {
- font-size:1.2em;
- padding:2px 0;
+body#fullyearlinked table.calendar thead th.monthName {
+ font-size: large;
+ padding: 2px 0px;
}
-body#fullyearlinked table.calendar tbody tr td {
- height:3em;
+body#fullyearlinked table.calendar tbody td {
+ height: 3em;
+}
+body#OneDay div.content {
+ overflow: hidden;
}
diff --git a/src/plugins/webstuff/css/Web_Basic-Cypress.css b/src/plugins/webstuff/css/Web_Basic-Cypress.css
index cb30d13a8..bf3ac02ad 100644
--- a/src/plugins/webstuff/css/Web_Basic-Cypress.css
+++ b/src/plugins/webstuff/css/Web_Basic-Cypress.css
@@ -10,6 +10,7 @@ Note: Adapted from GRAMPS original Modern Style stylesheet with colors from the
This website was created with GRAMPS
--------------------------------------------------------------------------------------------------
GRAMPS is a Free Software Project for Genealogy, offering a professional
+
genealogy program, and a wiki open to all. It is a community project, created,
developed and governed by genealogists.
@@ -19,6 +20,7 @@ Go to to learn more!
Copyright 2008 Jason M. Simanek
Copyright 2009 Stephane Charette
Copyright (C) 2008-2011 Rob G. Healey
+Copyright 2011 Michiel D. Nauta
This file is part of the GRAMPS program.
@@ -36,6 +38,7 @@ GRAMPS. If not, see .
Color Palette
--------------------------------------------------------------------------------------------------
+
black #000
slate dark #454
slate #7C8F7C
@@ -43,1191 +46,655 @@ slate light #9DBF9D
slate very light #E0E6E0
white #FFF
--------------------------------------------------------------------------------------------------
-
+Characteristic of this style is that it uses the full width of the browser
+window and that horizontal highlighting bars extend over the full width of
+the page.
+--------------------------------------------------------------------------------------------------
# $Id$
+ NarrativeWeb Styles
+------------------------------------------------------------------------------------------------
+
General Elements
----------------------------------------------------- */
body {
- font-family:sans-serif;
- color:#000;
- margin:0;
- padding:0;
- background-color:#FFF;
+ font-family: sans-serif;
+ font-size: 90%;
+ color: black;
+ margin: 0px;
+ background-color: #454;
}
-div {
- margin:0;
- padding:0;
-}
-img {
- border:none;
- margin:0;
-}
-.thumbnail a:hover {
- background:none;
+body > div {
+ clear: both;
}
.content {
- padding-top: 1cm;
- background-color:#FFF;
+ background-color: white;
+ border-top: solid 1px #7C8F7C;
}
.content div.snapshot {
- float:right;
- margin:20px;
- padding:0;
- background:none;
-}
-.content div.snapshot div.thumbnail {
- margin:0;
- padding:0;
- background:none;
+ float: right;
+ margin: 2em;
}
.fullclear {
- width:100%;
- height:1px;
- margin:0;
- padding:0;
- clear:both;
+ clear: both;
}
/* General Text
----------------------------------------------------- */
h1 {
- font-size:1.4em;
- font-weight:bold;
-}
-h2 {
- display:none;
+ font-size: x-large;
+ font-weight: bold;
+ padding-left: 15px;
}
h3 {
- font-size:1.2em;
- font-weight:bold;
- margin-left:12px;
- text-align:left;
- margin:0;
- padding:.5em 20px .2em 20px;
+ font-size: large;
+ padding-left: 15px;
}
h4 {
- font-size:.8em;
- color:#454;
- margin:0;
- padding:.2em 0 .2em 20px;
- background-color:#E0E6E0;
- border-bottom:solid 1px #7C8F7C;
-}
-h5, h6 {
- font-style:italic;
- margin:1.3em 0 .5em 1em;
-}
-p {
- font-size:14px;
- line-height:17px;
+ font-size: medium;
+ background-color: #9DBF9D;
+ padding-left: 15px;
+ margin-bottom: 0px;
+ border-bottom: solid 1px #7C8F7C;
}
p#description {
- padding:0 15px 1em 15px;
+ padding-left: 15px;
}
-p a:link {
- text-decoration:underline;
+a {
+ color: black;
+ text-decoration: none;
}
-sup {
- line-height:0;
-}
-ol {
-}
-ol li a {
- text-decoration:none;
-}
-a:link {
- color:#000;
- text-decoration:underline;
-}
-a:hover, a:active {
- color:#000;
- text-decoration:underline;
- background-color:#E0E6E0;
-}
-a:visited {
- color:#000;
- text-decoration:underline;
+a[href]:hover, a[href]:active {
+ background-color: #9DBF9D;
}
.grampsid {
- font:normal .8em/1.2em monospace;
- color:#7C8F7C;
+ font-family: monospace;
+ font-size: smaller;
+ color: #7C8F7C;
}
/* Header
----------------------------------------------------- */
#header {
- padding:15px 15px 15px 15px;
- margin:0;
- background-color:#454;
- height: 1cm;
+ color: #E0E6E0;
}
-#SiteTitle {
- color:#E0E6E0;
- margin:0 0 3px 0;
-}
-#header p {
- font-size:1em;
- font-weight:bold;
- color:#E0E6E0;
- margin:0;
+#user_header, #user_footer {
+ padding-left: 15px;
}
/* Navigation
----------------------------------------------------- */
#navigation, #subnavigation {
- margin:0;
- padding:4px 0 0 0;
- background-color:#454;
+ border: solid 1px #454; /* needed by IE7 */
+}
+#subnavigation ul {
+ overflow: hidden;
}
#navigation ul, #subnavigation ul {
- list-style:none;
- min-width:770px;
- height:22px;
- margin:0;
- padding:0 0 0 12px;
- border-bottom:1px solid #7C8F7C;
+ list-style: none;
+ margin: 0px;
+ padding-left: 15px;
+}
+#subnavigation ul {
+ border-bottom: solid 1px #7C8F7C;
}
#navigation ul li, #subnavigation ul li {
- margin:0;
- padding:0;
- float:left;
+ float: left;
}
#navigation ul li a, #subnavigation ul li a {
- display:block;
- font-size:12px;
- line-height:100%;
- font-weight:bold;
- text-decoration:none;
- color:#E0E6E0;
- margin:0;
- padding:5px 5px;
- background-color:#454;
+ display: block;
+ font-size: smaller;
+ font-weight: bold;
+ color: #E0E6E0;
+ padding: 5px;
+ border-bottom: solid 1px #454;
}
#navigation ul li a:hover, #subnavigation ul li a:hover {
- color:#FFF;
- padding-top:4px;
- background-color:#9DBF9D;
- border-top:solid 1px #454;
- border-bottom:solid 1px #000;
+ text-decoration: none;
+ background-color: #9DBF9D;
+ border-bottom: solid 1px black;
}
-#navigation ul li.CurrentSection a, #subnavigation ul li.CurrentSection a {
- color:#454;
- padding-bottom:4px;
- border-top:solid 1px #7C8F7C;
- border-right:solid 1px #7C8F7C;
- border-left:solid 1px #7C8F7C;
- border-bottom:solid 1px #FFF;
- background-color:#FFF;
+#navigation ul li.CurrentSection a {
+ position: relative;
+ top: 1px;
+ color: #454;
+ border: solid 1px #7C8F7C;
+ border-bottom-style: none;
+ background-color: white;
}
-#navigation ul li.CurrentSection a:hover, #subnavigation ul li.CurrentSection a:hover {
- padding-top:5px;
- background-color:#FFF;
+#subnavigation ul li.CurrentSection a {
+ color: #454;
+ background-color: white;
}
-
/* Alphabet Navigation
----------------------------------------------------- */
-div#alphabet {
- width: 100%;
- margin: 0;
- background-color: #454;
+#alphabet {
+ background-color: #454
}
-div#alphabet ul {
- list-style:none;
- min-width:770px;
- height:24px;
- margin:0;
- padding: 0px 0px 0px 16px;
+#alphabet ul {
+ list-style: none;
border-width: 2px 0px 4px 0px;
border-style: solid;
- border-color: #FFF;
+ border-color: black;
+ margin: 0px;
+ padding-left: 15px;
+ /* float container stretch, see www.quirksmode.org/css/clearing.html */
+ overflow: hidden;
}
-div#alphabet ul li:after {
- content:" |";
+#alphabet ul li {
+ float: left;
+ font-size: larger;
+ font-weight: bold;
}
-div#alphabet ul li {
- margin:0;
- float:left;
+#alphabet ul li:after {
+ content: " |";
}
-div#alphabet ul li a {
- display:block;
- padding: 4px 8px 4px 8px;
- float:left;
- font:bold 16px/100% sans;
- margin:0;
- text-decoration:none;
- color: #FFF;
+#alphabet ul li a {
+ display: block;
+ padding: 4px 8px;
+ line-height: 100%;
+ float: left;
+ color: white;
}
-div#alphabet ul li a:hover {
- background-color: #000;
- color: #FFF;
+#alphabet ul li a:hover {
+ text-decoration: none;
+ background-color: black;
+ color: white;
}
/* Main Table
----------------------------------------------------- */
table {
- font-size:14px;
- margin:0 15px;
- padding:0;
- border:none;
- border-collapse:collapse;
+ border-collapse: collapse;
+ width: 100%;
+}
+div#summaryarea > table.infolist,
+div#parents > table.infolist,
+h3 + table.infolist {
+ width: auto;
}
table tr th {
- font-weight: bold;
text-align: left;
- margin:0;
- padding:.1em 10px;
- background-color:#9DBF9D;
- border-top:solid 1px #7C8F7C;
- border-bottom:solid 1px #7C8F7C;
+ background-color: #E0E6E0;
+ border-top: solid 1px #7C8F7C;
+ border-bottom: solid 1px #7C8F7C;
}
-table.infolist tr th:first-child {
- border-left:solid 1px #7C8F7C;
+table tr th:first-child {
+ border-left: solid 1px #7C8F7C;
}
-table.infolist tr th:last-child {
- border-right:solid 1px #7C8F7C;
+table tr th:last-child {
+ border-right: solid 1px #7C8F7C;
}
-table.infolist tr th a {
- text-decoration:none;
+table.primobjlist tr th {
+ background-color: #9DBF9D;
}
-table tr td {
- vertical-align:middle;
- padding:.1em 10px;
+table td, table th {
+ vertical-align: top;
+ padding-left: 1ex;
}
-table.infolist tr td a {
- display:block;
- text-decoration:none;
+table.primobjlist td {
+ vertical-align: middle;
}
-table.infolist tr.BeginLetter td, table.infolist tr.BeginSurname td {
- border-top:solid 1px #9DBF9D;
+table td:first-child, table th:first-child {
+ padding-left: 15px;
}
-table.infolist tr th.ColumnQuantity {
- width:30%;
+table.primobjlist tr a {
+ display: block; /* make whole td clickable */
}
-table.infolist tr td.ColumnLetter {
- font-weight:bold;
+table.primobjlist tr.BeginLetter td, table.primobjlist tr.BeginSurname td {
+ border-top: solid 1px #9DBF9D;
}
-table.infolist tbody tr td.ColumnBirth {
- font-size:.9em;
- width:10%;
+td.ColumnLetter, td.ColumnRowLabel {
+ font-weight: bold;
}
-table.infolist tbody tr td.ColumnDeath {
- font-size:.9em;
- width:10%;
+td.ColumnBirth, td.ColumnDeath, td.ColumnPartner, td.ColumnParents {
+ font-size: 90%;
}
-table.infolist tbody tr td.ColumnRowLabel {
- font-weight:bold;
- width:2%;
+table.infolist tr td ol {
+ margin: 0px;
}
-table.infolist tbody tr td.ColumnType {
- width:6%;
- padding-left:20px;
+#summaryarea table.infolist td.ColumnAttribute,
+#parents table.infolist td.ColumnAttribute,
+#families table.infolist td.ColumnType,
+#families table.infolist td.ColumnAttribute {
+ color: #454;
}
-table.infolist tbody tr td.ColumnPartner {
- font-size:.9em;
+/* div summaryarea is missing for events, sources and repos! */
+h3 + table.infolist td.ColumnAttribute {
+ color: #454;
}
-table.infolist tbody tr td.ColumnParents {
- font-size:.9em;
-}
-table.infolist tbody tr td.ColumnParents span.father, table.infolist tbody tr td.ColumnParents span.mother {
- display:block;
-}
-table.infolist tbody tr td.ColumnParents span.mother:before {
- content:"+ ";
-}
-table.infolist tbody p.EventNote {
- border-top:dashed 1px #9DBF9D;
- padding-top:1em;
- padding-bottom:1em;
+table.primobjlist td.ColumnParents span.mother:before {
+ content: "+ ";
}
/* Surnames
----------------------------------------------------- */
-#Surnames { }
-#SurnameDetail p#description { padding-top:0; }
-table.surnamelist tbody tr td.ColumnSurname {
- width:50%;
+table#SortByName td.ColumnSurname, table#SortByName th.ColumnSurname,
+table#SortByCount td.ColumnQuantity, table#SortByCount th.ColumnQuantity {
+ background-color: #E0E6E0;
}
-table.surnamelist thead tr th.ColumnSurname {
- padding:0;
+/* make the whole cell light up on hover not just the a. */
+table#SortByName td.ColumnSurname,
+table#SortByName th.ColumnSurname,
+table#SortByName th.ColumnQuantity {
+ padding-left: 0px;
}
-table.surnamelist thead tr th.ColumnQuantity {
- width:40%;
- padding:0;
+table#SortByName td.ColumnSurname > a,
+table#SortByName th.ColumnSurname > a,
+table#SortByName th.ColumnQuantity > a {
+ padding-left: 1ex;
}
-table.infolist thead tr th.ColumnSurname a, table.infolist thead tr th.ColumnQuantity a {
- display:block;
- padding:.1em 10px;
+table#SortByName thead th.ColumnSurname a:after,
+table#SortByCount thead th.ColumnQuantity a:after {
+ content: " \2193";
}
-table#SortByName thead tr th.ColumnSurname a, table#SortByCount thead tr th.ColumnQuantity a {
- background-color:#E0E6E0;
+table#SortByName th.ColumnSurname a:hover,
+table#SortByName th.ColumnQuantity a:hover,
+table#SortByCount th.ColumnSurname a:hover,
+table#SortByCount th.ColumnQuantity a:hover {
+ background-color: #E0E6E0;
}
-table#SortByName thead tr th.ColumnSurname a:after, table#SortByCount thead tr th.ColumnQuantity a:after {
- content:" ↓";
+table.surname td.ColumnName {
+ background-color: #E0E6E0;
}
-table.infolist tbody tr td.ColumnSurname {
- padding:0;
- background-color:#E0E6E0;
+/* make the whole cell light up on hover not just the a. */
+table.surname td.ColumnName {
+ padding-left: 0px;
}
-table.infolist tbody tr td.ColumnSurname a {
- padding:.1em 10px;
-}
-table.infolist tbody tr td.ColumnSurname a:hover {
- padding:.1em 10px;
- background-color:#9DBF9D;
-}
-table.surname {
- border-bottom:solid 1px #E0E6E0;
-}
-table.surname tbody tr td {
- border-bottom:dashed 1px #9DBF9D;
-}
-table.surname tbody tr td.ColumnName {
- width:20%;
- padding:0;
- background-color:#E0E6E0;
-}
-table.surname tbody tr td.ColumnName a {
- display:block;
- padding:.6em 10px .6em 20px;
-}
-table.surname tbody tr td.ColumnName a:hover {
- background-color:#9DBF9D;
-}
-table.surname tbody tr td.ColumnName a span.grampsid {
- display:none;
-}
-table.surname thead tr th.ColumnParents, table.surname tbody tr td.ColumnParents {
- width:25%;
+table.surname td.ColumnName > a {
+ padding-left: 15px;
}
/* Individuals
----------------------------------------------------- */
-#Individuals { }
-#Individuals table.individuallist {
- border-bottom:solid 1px #E0E6E0;
-}
-#Individuals table.individuallist tbody tr td {
- border-bottom:dashed 1px #9DBF9D;
-}
-#Individuals table.individuallist tbody tr td a:hover {
- text-decoration:none;
-}
-table.individuallist tbody tr td.ColumnSurname {
- background:none;
-}
-table.individuallist tbody tr td.ColumnSurname a:hover, table.individuallist tbody tr td.ColumnSurname a:active {
- cursor:default;
- color:black;
- background:none;
-}
-table.individuallist tbody tr td.ColumnName {
- padding:0;
- background-color:#E0E6E0;
-}
-table.individuallist tbody tr td.ColumnName a {
- display:block;
- padding:.6em 10px;
- vertical-align:middle;
-}
-table.individuallist tbody tr td.ColumnName a:hover {
- background-color:#9DBF9D;
-}
-#Individuals div table.infolist tr td p {
- vertical-align:top;
-}
-#Individuals div table.infolist tr td p a {
- display:inline;
-}
-
-/* IndividualDetail
------------------------------------------------------- */
-#IndividualDetail {
- background-color:#454;
-}
-#IndividualDetail div table.infolist tr td {
- font:normal .9em/1.2em sans-serif;
- vertical-align:top;
-}
-#IndividualDetail div table.infolist tr td a {
- display:inline;
-}
-#IndividualDetail table.infolist tr td a:hover {
- text-decoration:underline;
-}
-#IndividualDetail table.infolist tbody tr td.ColumnAttribute {
- width:10%;
- color:#696969;
-}
-#IndividualDetail div.subsection table tr td:first-child {
- padding-left:20px;
-}
-#familymap a.familymap {
- margin-left:20px;
-}
-
-/* Subsections : Attributes
------------------------------------------------------ */
-div#attributes {
- margin: 0;
- padding: 0;
-}
-table.attrlist {
- width: 100%;
-}
-table.attrlist thead tr th {
- background-color: #70B1ED;
- color: #000;
-}
-table.attrlist tbody tr td {
- border-bottom: dashed 1px #000;
-}
-table.attrlist tbody tr td.ColumnType {
- width: 15%;
-}
-table.attrlist tbody tr td.ColumnValue {
- width: 15%;
-}
-table.attrlist tbody tr td.ColumnNotes {
- width: 40%;
-}
-table.attrlist tbody tr td.ColumnSources {
- width: 10%;
-}
-
-/* Sources
------------------------------------------------------ */
-#Sources table.infolist tbody tr td.ColumnRowLabel {
- padding-bottom:0;
-}
-#Sources table.infolist tbody tr td.ColumnName {
- padding:0;
-}
-#Sources table.infolist tbody tr td.ColumnName a {
- padding:.1em 10px .3em 10px;
-}
-#SourceDetail div#references ol li {
- padding-bottom:.5em;
-}
-
-/* Relationships
-================================================= */
-table.relationships thead tr th.ColumnMarriage,
-table.relationships thead tr th.ColumnDivorce {
- width: 13%;
-}
-table.relationships thead tr th.ColumnHyper {
- width: 15%;
-}
-table.relationships thead tr th.ColumnMedia {
- width: 15%;
-}
-table.relationships tbody tr td.ColumnRowLabel a {
- background: none;
-}
-table.relationships tbody tr td.columnPartner {
- font-size: 100%;
+table.IndividualList td.ColumnSurname {
+ background-color: #E0E6E0;
}
/* Places
----------------------------------------------------- */
-#Places table.infolist tbody tr td.ColumnName {
- padding:0;
+#Places table.infolist td.ColumnName {
+ background-color: #E0E6E0;
}
-#Places table.infolist tbody tr td.ColumnName a {
- padding:.1em 10px .3em 10px;
+/* make the whole cell light up on hover not just the a. */
+#Places table.infolist td.ColumnName {
+ padding-left: 0px;
+}
+#Places table.infolist td.ColumnName > a {
+ padding-left: 1ex;
}
/* Events
----------------------------------------------------- */
#EventList table.infolist tr.BeginType td {
- border-top: dashed 1px #9DBF9D;
+ border-top:dashed 1px #9DBF9D;
}
#EventList table.infolist tr.BeginLetter td {
- border-top: solid 1px #9DBF9D;
+ border-top:solid 1px #9DBF9D;
}
-#EventList table.infolist tr td a,
-#EventDetail table.infolist tr td a {
+#EventList table.infolist td.ColumnType {
+ background-color: #E0E6E0;
+}
+#EventList td.ColumnPerson a {
display: inline;
}
-#EventList table.infolist tr td span.father,
-#EventList table.infolist tr td span.mother,
-#EventDetail table.infolist tr td span.father,
-#EventDetail table.infolist tr td span.mother {
- display: block;
-}
-#EventList table.infolist tr td span.person:after,
-#EventList table.infolist tr td span.father:after,
-#EventList table.infolist tr td span.mother:after,
-#EventDetail table.infolist tr td span.person:after,
-#EventDetail table.infolist tr td span.father:after,
-#EventDetail table.infolist tr td span.mother:after {
+#EventList td.ColumnPerson span.person:after,
+#EventList td.ColumnPerson span.father:after,
+#EventList td.ColumnPerson span.mother:after,
+#EventDetail td.ColumnPerson span.person:after,
+#EventDetail td.ColumnPerson span.father:after,
+#EventDetail td.ColumnPerson span.mother:after {
content: ", ";
}
-#EventList table.infolist tr td span.person:last-child:after,
-#EventList table.infolist tr td span.father:last-child:after,
-#EventList table.infolist tr td span.mother:last-child:after,
-#EventDetail table.infolist tr td span.person:last-child:after,
-#EventDetail table.infolist tr td span.father:last-child:after,
-#EventDetail table.infolist tr td span.mother:last-child:after {
+#EventList td.ColumnPerson span.fatherNmother:after,
+#EventDetail td.ColumnPerson span.fatherNmother:after {
+ content: " + ";
+}
+#EventList td.ColumnPerson span.person:last-child:after,
+#EventList td.ColumnPerson span.father:last-child:after,
+#EventList td.ColumnPerson span.mother:last-child:after,
+#EventDetail td.ColumnPerson span.person:last-child:after,
+#EventDetail td.ColumnPerson span.father:last-child:after,
+#EventDetail td.ColumnPerson span.mother:last-child:after {
content: "";
}
/* Gallery
----------------------------------------------------- */
-#Gallery table.infolist tbody tr td.ColumnRowLabel, #Gallery table.infolist tbody tr td.ColumnDate {
- padding-bottom:0;
-}
-#Gallery table.infolist tbody tr td.ColumnName {
- padding:0;
-}
-#Gallery table.infolist tbody tr td.ColumnName a {
- padding:.1em 10px .3em 10px;
-}
-#Gallery table.infolist tbody tr td.ColumnName a:hover {
- background-color:#E0E6E0;
-}
#GalleryNav {
- font-size:.8em;
- margin:1em 0 0 0;
- padding:1.2em 0 0 0;
- text-align:center;
+ text-align: center;
+ margin: 2em 0px;
}
#GalleryNav a {
- font-weight:bold;
- text-decoration:none;
- background-color:#E0E6E0;
- border:solid 1px #7C8F7C;
+ font-weight: bold;
+ background-color: #E0E6E0;
+ border: solid 1px #7C8F7C;
+ margin: 1em;
}
#GalleryNav a:hover {
- background-color:#9DBF9D;
+ background-color: #9DBF9D;
}
#GalleryNav a#Previous {
- padding:.4em .7em .3em .7em;
+ padding: .4em .7em .3em .7em;
}
#GalleryNav a#Next {
- padding:.4em 1.9em .3em 1.9em;
-}
-#GalleryPages {
- margin:0 1em;
+ padding: .4em 1.9em .3em 1.9em;
}
#GalleryCurrent {
- font-size:1.2em;
- font-weight:bold;
+ font-size: larger;
}
#GalleryTotal {
- font-weight:normal;
+ font-weight: normal;
}
#GalleryDisplay {
- margin:0 auto;
- padding:0;
- position:relative;
- overflow:hidden;
- text-align:center;
- border:solid 1px #7C8F7C;
+ margin: 0px auto;
+ position: relative;
}
#GalleryDisplay img {
- margin:0 auto;
+ margin: 0px auto;
+ display: block;
+ border: solid 1px #7C8F7C;
}
-#GalleryDetail div#summaryarea{
- margin:0;
- padding:1.4em 0 0 0;
-}
-#GalleryDetail div#summaryarea h3 {
- text-align:center;
-}
-#GalleryDetail div h4 {
- margin-top:0;
-}
-#GalleryDetail div#summaryarea table.gallery {
- width:100%;
- margin-top:1.5em;
- margin-bottom:0;
- padding-bottom:0;
- background-color:#E0E6E0;
- border-style:solid;
- border-width:8px 0 0 0;
- border-color:#9DBF9D;
-}
-
-/* Thumbnail Preview Reference Section
-------------------------------------------------- */
-body#ThumbnailPreview div#references {
- background-color: #FFF;
- color: #00029D;
- margin: 0 auto;
- padding: 0;
- width: 100%;
-}
-body#ThumbnailPreview div#references table.infolist tbody tr {
- border-bottom: dashed 1px #000;
-}
-body#ThumbnailPreview div#references table.infolist tbody tr td.ColumnRowLabel a {
- background: none;
- width: 2%;
-}
-body#ThumbnailPreview div#references table.infolist tbody tr td.ColumnName {
- width: 90%;
+#GalleryDetail h3 {
+ text-align: center;
}
/* Contact
----------------------------------------------------- */
+#Contact {
+ overflow: hidden;
+}
#Contact #summaryarea {
- width:500px;
- margin:2em auto;
- padding:3em;
- background-color:#E0E6E0;
- border:solid 1px #7C8F7C;
+ width: 40em;
+ margin: 2em auto;
+ padding: 3em;
+ background-color: #E0E6E0;
+ border: solid 1px #7C8F7C;
}
-#Contact #summaryarea img {
- float:right;
- margin:0;
- padding:0;
- border:solid 1px #7C8F7C;
+#Contact img {
+ float: right;
+ border: solid 1px #7C8F7C;
}
-#researcher {
- margin-top:.3em;
+#Contact #researcher, #Contact #researcher h3 {
+ font-size: larger;
+ padding-left: 0px;
}
-#researcher h3 {
- padding:0;
-}
-#researcher span {
- display:block;
- float:left;
- margin-right:.4em;
-}
-#streetaddress {
- width:85%;
-}
-#locality, .locality {
+#Contact #streetaddress, #Contact #locality, #Contact #email {
display: block;
- width: 100%;
}
-#city:after {
- content:",";
+#Contact #locality, #Contact #city, #Contact #state, #Contact #postalcode,
+#Contact #country {
+ white-space: nowrap;
}
-#country {
- clear:left;
-}
-#email {
- clear:left;
-}
-#email a {
- text-decoration:none;
-}
-#email a:hover {
- text-decoration:underline;
+#Contact #city:after {
+ content: ",";
}
-/* Download
+/* Download
----------------------------------------------------- */
-#Download {
- padding:1cm;
- height:396px;
-}
-table.download {
- border:solid 2px #000;
- width:100%;
-}
-table.download img {
- float:center;
-}
-table.download thead tr th {
- text-align:center;
- border:solid 2px #000;
- color: #000;
- text-transform:uppercase;
-}
-table.download tbody tr#Row02 {
- border-bottom:solid 2px #000;
-}
-table.download thead tr th, table.download tbody tr td {
- padding-left:10px;
- padding-top:20px;
- border-style:solid;
- border-color:#000;
- border-width:0 2px 2px 2px;
- text-align:left;
-}
-table.download td.Description {
- width: 50%;
-}
-table.download td.License {
- width:8%;
-}
-table.download td.Filename {
- width:30%;
-}
-table.download td.Filename a {
- font-weight:bold;
- font-style: italic;
- text-decoration:none;
-}
-table.download td.Filename a:hover {
- text-decoration:underline;
-}
-table.download td.Modified {
- width:12%;
- font-weight:bold;
+#Download table.download a {
+ display: block;
}
-/* Subsections
+/* Subsection
----------------------------------------------------- */
-#Home, #Introduction, {
- padding:1.5em 0 3em 0;
+#Home, #Introduction {
+ overflow: hidden;
}
-#Home p, #Introduction p, #Contact p {
- margin:0 20px 1em 20px;
+#Home img, #Introduction img {
+ float: right;
+ margin: 1em;
+ max-width: 950px;
}
-#Home img, #Introduction img, #Contact img {
- float:right;
- margin:0;
- padding:0 20px 3em 20px;
+#Home p, #Introduction p {
+ padding-left: 15px;
}
-#Home a, #Introduction a, #Contact a {
- color: #000;
- text-decoration: none;
+.subsection {
+ clear: both;
+ overflow: hidden;
}
-div.subsection{
- padding-bottom:.5em;
- background-color:#FFF;
-}
-div.subsection h4 {
- margin-bottom:.5em;
-}
-div.subsection table, div.subsection ol, div.subsection p, div.subsection > a {
- font-size:.9em;
-}
-div.subsection a {
- text-decoration:none;
-}
-div.subsection a:hover {
- text-decoration:underline;
- background:none;
-}
-div.subsection table.infolist {
- width:100%;
- margin:0;
-}
-#IndividualDetail div.subsection table tr td:first-child {
- padding-left:20px;
+.subsection p {
+ margin: 0px;
}
-/* Subsections : Summary Area
+/* Subsection : Families
----------------------------------------------------- */
-div#summaryarea {
- min-height:100px;
- background:none;
-}
-div#summaryarea table.infolist {
- margin:0;
- padding:0;
- background:#FFF;
- border-bottom:solid .7em #FFF;
-}
-div#summaryarea table.infolist tr td, div#summaryarea table.infolist tr td p {
- vertical-align:top;
-}
-div#summaryarea table.infolist tr td a, div#summaryarea table.infolist tr td p a {
- display:inline;
-}
-div#summaryarea table.infolist tbody tr td.ColumnAttribute {
- width:14%;
- padding-left:20px;
-}
-
-/* Subsections : Events
------------------------------------------------------ */
-div#events {
- padding-bottom:0;
-}
-div#events h4 {
- margin-bottom:0;
-}
-div#events table.infolist {
- border-bottom:solid 1px #FFF;
-}
-div#events table.infolist tbody tr td {
- padding-top:.2em;
- padding-bottom:.2em;
-}
-#IndividualDetail div#events table.infolist thead tr th:first-child {
- padding-left:20px;
-}
-div#events table.infolist tbody tr td.ColumnAttribute {
- border-bottom:dashed 1px #9DBF9D;
-}
-div#events table.infolist tbody tr td.ColumnValue {
- border-bottom:dashed 1px #9DBF9D;
-}
-div#events table.infolist tbody tr td.ColumnValue p {
- margin:.1em 2em;
-}
-
-/* Subsections : Parents
------------------------------------------------------ */
-div#parents table.infolist tbody tr td.ColumnValue ol {
- margin:0;
- padding-top:0;
-}
-div#parents table.infolist tbody tr td.ColumnValue ol li {
- padding-bottom:.2em;
-}
-
-/* Subsections : Families
------------------------------------------------------ */
-div#families table.infolist tbody tr td.ColumnValue p {
- margin-top:0;
-}
-div#families table.infolist tbody tr td.ColumnValue ol {
- margin:0;
- padding-top:0;
-}
-div#families table.infolist tbody tr td.ColumnValue ol li {
- padding-bottom:.2em;
-}
div#families table.fixed_subtables table.eventlist {
- table-layout:fixed;
+ table-layout: fixed;
}
div#families table.fixed_subtables table.eventlist th:first-child {
- width:9em;
+ width: 9em;
}
div#families table.fixed_subtables table.eventlist th:last-child {
- width:5em;
+ width: 5em;
+}
+div#families table.attrlist td.ColumnType {
+ color: black;
}
-/* Subsections : Addresses
+/* Subsection : Gallery
----------------------------------------------------- */
-div#addresses {
- padding-bottom:0;
-}
-div#addresses h4 {
- margin-bottom:0;
-}
-div#addresses table.infolist {
- border-bottom:solid 1px #FFF;
-}
-div#addresses table.infolist tbody tr td {
- padding-top:.2em;
- padding-bottom:.2em;
-}
-div#addresses table.infolist tbody tr td.ColumnAttribute {
- width:30%;
- border-bottom:dashed 1px #9DBF9D;
-}
-div#addresses table.infolist tbody tr td.ColumnValue {
- border-bottom:dashed 1px #9DBF9D;
-}
-div#Addresses table.infolist tr td a, div#Addresses table.infolist tr td p a {
- display: inline;
-}
-
-/* Subsections : Attributes
------------------------------------------------------ */
-
-/* Subsections : Gallery
------------------------------------------------------ */
-#indivgallery h4 {
- margin-bottom:1em;
-}
#indivgallery .thumbnail {
- margin:0;
- float:left;
- width:130px;
- height:150px;
- text-align:center;
+ float: left;
+ max-width: 130px;
+ max-height: 150px;
+ font-size: smaller;
+ text-align: center;
+ margin: 0.8em 0.5em;
}
-#indivgallery .thumbnail a {
- display:block;
- margin:0;
- padding:0;
- background:none;
+#indivgallery h4 + .thumbnail {
+ margin-left: 15px;
+ /* Problem: if there are more thumnails then fit on a single row, the
+ * first thumnail on each next row should also have a margin-left
+ * of 15 px. */
}
-#indivgallery .thumbnail a img {
- margin:0;
- padding:0;
- border:solid 1px #7C8F7C;
+#indivgallery img {
+ border: solid 1px #7C8F7C;
}
-#indivgallery div.thumbnail span {
-/* ## remove this line and the comment markers from the line below to hide the description in Individual Gallery
+#indivgallery span {
+/* ## remove this line and the comment markers from the line below to hide description in Indivifual Gallery
display: none; */
-
- font-size:.6em;
- text-align:center;
- width:80%;
- margin:0 auto;
- padding:0;
}
-/* Subsections : Narrative
+/* Subsection : Narrative
----------------------------------------------------- */
-div.narrative {
- padding-bottom:0;
+h4 + div.grampsstylednote, a.familymap {
+ margin: 1em 15px;
}
-.narrative p {
- margin-top:.5em;
- margin-bottom:0;
- padding:0 20px 1em 20px;
+i + div.grampsstylednote p {
+ margin: 0px;
}
-/* Subsections : References
+/* Subsection : Family Map
----------------------------------------------------- */
-#references ol {
- margin-top:0;
- margin-bottom:0;
+a.familymap {
+ display: block;
}
-/* Subsections : Source References
+/* Subsection : Source References
----------------------------------------------------- */
-div#sourcerefs ol {
- list-style-type:decimal;
-}
-div#sourcerefs ol li ol {
- list-style-type:lower-alpha;
+#sourcerefs ol li ol {
+ list-style-type: lower-alpha;
}
-/* Subsections : Weblinks
------------------------------------------------------ */
-
-/* Subsections : Pedigree
+/* Subsection : Pedigree
----------------------------------------------------- */
.pedigreegen {
- font-size:.9em;
- list-style:none;
- margin:.5em 0 0 0;
- padding:0 0 .7em 20px;
+ list-style-type: none;
+ padding-left: 15px;
}
.pedigreegen li ol {
- list-style:none;
- margin-left:.5em;
-}
-.pedigreegen li ol li {
- padding-bottom:.2em;
+ list-style-type: none;
}
.pedigreegen li ol li ol {
- list-style:decimal;
- margin-left:1.6em;
+ list-style-type: decimal;
}
-.pedigreegen li ol li ol li ol.spouselist {
- font-size:1em;
- list-style:none;
- margin-left:0;
+.pedigreegen ol.spouselist {
+ list-style-type: none;
}
-.spouselist li.spouse ol {
- font-size:1em;
- list-style:decimal;
- margin-left:1.6em;
-}
-.spouse a {
- font-weight:normal;
+.pedigreegen ol.spouselist li.spouse ol {
+ list-style-type: decimal;
}
.spouse:before {
content: "+ ";
}
.thisperson {
- font-weight:bold;
+ font-weight: bold;
+}
+.thisperson > ol {
+ font-weight: normal;
}
/* Footer
----------------------------------------------------- */
#footer {
- clear:both;
- width:100%;
- font-size:12px;
- line-height:130%;
- color:#E0E6E0;
- margin:0;
- padding:0;
- background-color:#454;
- border-top:solid 1px #454;
+ clear: both;
+ color: #E0E6E0;
+ padding-top: 1em;
+ background-color: #9DBF9D;
+ border-top: solid 1px #454;
}
-#footer a, #footer a:visited {
- text-decoration:none;
- color:#E0E6E0;
+#footer a {
+ color: #E0E6E0;
}
-#footer a:hover {
- text-decoration:underline;
- background:none;
-}
-#footer img {
- border:0;
- margin:0 auto;
- vertical-align:middle;
+#footer > * {
+ background-color: #454;
}
#footer p#createdate {
- float:left;
- width:40%;
- text-align:left;
- margin-left:10px;
+ float: left;
+ width: 50%;
+ text-align: left;
+ padding-left: 15px;
+ margin-top: 1em;
}
#footer p#copyright {
- float:right;
- width:40%;
- text-align:right;
- margin-right:10px;
+ float: right;
+ width: 40%;
+ text-align: right;
+ padding-right: 15px;
}
-#footer p#copyright img {
- margin-right:10px;
-}
-#user_footer {
- width:70%;
- float:left;
- margin:1em;
-}
-#user_footer p {
- font:normal 1em/1.2em serif;
- margin:0;
- padding:0;
+
+/* Overwritten
+----------------------------------------------------- */
+body#FamilyMap {
+ background-color: #E0E6E0 ! important;
}
/* Calendar Styles
--------------------------------------------------------------------------------------------- */
-/* Calendar : General */
-body#WebCal {
- padding:0 14px;
- background-color:#454;
+===================================================== */
+table.calendar {
+ table-layout: fixed;
+ empty-cells: show;
}
-.calendar {
- empty-cells:show;
- width:100%;
- font-size:1em;
- font-weight:normal;
- margin:0;
- padding:0;
- border:none;
- border-collapse:collapse;
+.calendar thead th {
+ text-align: center;
+ border-top-style: none;
}
-.calendar thead tr th {
- width:14%;
- font-weight:bold;
- font-size:14px;
- line-height:14px;
- text-align:center;
- text-transform:uppercase;
- padding:2px 0;
+.calendar thead th.monthName {
+ font-size: xx-large;
+ font-weight: normal;
+ background-color: white;
+ border-bottom-style: none;
+ padding-top: 1em;
}
-.calendar thead tr th.monthName {
- width:100%;
- font-weight:normal;
- font-size:2em;
- line-height:100%;
- text-transform:none;
- color:#454;
- padding:.3em 0 .2em 0;
- background-color:#FFF;
- border-bottom-width:0;
+.calendar thead th abbr {
+ border-bottom-style: none;
}
-body#WebCal #CreatorInfo {
- float:right;
- font-size:12px;
- margin:-24px 10px 0 0;
+#CreatorInfo {
+ float: right;
+ margin: -1em 15px 0px 0px;
+ font-weight: bold;
+ color: #7C8F7C;
}
-body#WebCal #CreatorInfo a, body#WebCal #CreatorInfo a:hover {
- color:#E0E6E0;
- background:none;
-}
-.calendar thead tr th.weekend,
-.calendar thead tr th.weekday {
- color:#FFF;
- background-color:#7C8F7C;
- border-style:solid;
- border-width:0 0 1px 0;
- border-color:#9DBF9D;
-}
-.calendar thead tr th.saturday,
-.calendar thead tr th.sunday { }
.calendar tfoot tr td {
- padding:.7em 5% 1em 5%;
- border-top:solid 4px #9DBF9D;
-}
-.calendar tfoot tr td.note {
- height:1cm;
- vertical-align:middle;
- color:#454;
- background-color:#E0E6E0;
+ border-top: solid 4px #7C8F7C;
+ vertical-align: middle;
}
/* Calendar : Date Numeral */
-.calendar tbody tr td div.date {
- float:right;
- display:block;
- width:1.8em;
- font-weight:bold;
- font-size:1em;
- line-height:100%;
- text-align:center;
- color:#454;
- margin:0 0 0 .5em;
- padding:.2em 0;
- background-color:#9DBF9D;
+.calendar div.date {
+ float: right;
+ width: 1.8em;
+ font-size: large;
+ text-align: center;
+ background-color: #9DBF9D;
+ color: #454;
}
/* Calendar : Date Container */
-.calendar tbody tr td {
- vertical-align:top;
- height:10em;
- padding:0;
- border-width:1px 0 0 1px;
- border-style:solid;
- border-color:#9DBF9D;
+.calendar td {
+ padding: 0px 0px 0px 1ex;
+ border-width: 1px 0px 0px 1px;
+ border-style: solid;
+ border-color: #9DBF9D;
+ background-color: white;
}
-.calendar tbody tr td.weekday {
- background-color:#FFF;
-}
-.calendar tbody tr td.weekend {
- background-color:#E0E6E0;
-}
-.calendar tbody tr td.saturday {
-
- }
-.calendar tbody tr td.sunday {
- border-left:none;
+.calendar td:first-child {
+ border-left-style: none;
+ padding: 0px 0px 0px 1ex;
}
.calendar tbody tr:first-child td {
- border-top:none;
+ border-top-style: none;
}
/* Calendar : Date Detail */
-.calendar tbody tr td ul {
- list-style:none;
- font-family:sans-serif;
- font-size:.8em;
- margin:2.3em 0 .3em 0;
- padding:0;
+.calendar td ul {
+ font-size: smaller;
+ list-style: none;
+ padding: 0px;
}
-.calendar tbody tr td ul li {
- display:block;
- width:92%;
- margin:0 4%;
- padding:.2em 0 .3em 0;
- border-top:dashed 1px #C1B398;
+.calendar td ul li {
+ border-top: dashed 1px #9DBF9D;
+ padding-top: 0.5em;
+ padding-bottom: 0.5em;
}
-.calendar tbody tr td ul li:first-child {
- border:none;
+.calendar td ul li:first-child {
+ border-style: none;
}
/* Calendar : Birthday, Anniversary, Highlight */
-.calendar tbody tr td ul li em {
- font-style:normal;
- color:#0A65B5;
+.calendar td ul li em {
+ font-style: normal;
+ color: #7C8F7C;
}
-.calendar tbody tr td ul li span.yearsmarried em {
- color:#453619;
+.calendar td.highlight {
+ background-color: #E0E6E0;
}
-.calendar tbody tr td.highlight {
- background-color:#E5F2FE;
-}
-.calendar tbody tr td.highlight div.date {
- color:#0A65B5;
- background-color:#C2E1FE;
+.calendar td.highlight div.date {
+ color: black;
+ background-color: #9DBF9D;
}
/* Calendar : Previous-Next Month */
-.calendar tbody tr td.previous,
-.calendar tbody tr td.next,
-.calendar tbody tr td.previous div.date,
-.calendar tbody tr td.next div.date {
- color:#9DBF9D;
- background-color:#E0E6E0;
+.calendar td.previous,
+.calendar td.next,
+.calendar td.previous div.date,
+.calendar td.next div.date {
+ color: #9DBF9D;
+ background-color: white;
+}
+
+/* Calendar : Full Year */
+body#fullyearlinked div.content {
+ overflow: hidden;
+}
+body#fullyearlinked table.calendar {
+ float: left;
+ width: 33.3%;
+ height: 18em;
+ border: solid 1px black;
+}
+body#fullyearlinked table.calendar thead th {
+ height: 2em;
+}
+body#fullyearlinked table.calendar thead th.monthName {
+ font-size: large;
+ padding: 2px 0px;
+}
+body#fullyearlinked table.calendar tbody td {
+ height: 3em;
+}
+body#OneDay div.content {
+ overflow: hidden;
}
diff --git a/src/plugins/webstuff/css/Web_Basic-Lilac.css b/src/plugins/webstuff/css/Web_Basic-Lilac.css
index 16cded625..88b12303f 100644
--- a/src/plugins/webstuff/css/Web_Basic-Lilac.css
+++ b/src/plugins/webstuff/css/Web_Basic-Lilac.css
@@ -10,6 +10,7 @@ Note: Adapted from GRAMPS original Modern Style stylesheet with colors from the
This website was created with GRAMPS
--------------------------------------------------------------------------------------------------
GRAMPS is a Free Software Project for Genealogy, offering a professional
+
genealogy program, and a wiki open to all. It is a community project, created,
developed and governed by genealogists.
@@ -19,6 +20,7 @@ Go to to learn more!
Copyright 2008 Jason M. Simanek
Copyright 2009 Stephane Charette
Copyright (C) 2008-2011 Rob G. Healey
+Copyright 2011 Michiel D. Nauta
This file is part of the GRAMPS program.
@@ -36,1216 +38,669 @@ GRAMPS. If not, see .
Color Palette
--------------------------------------------------------------------------------------------------
+
black #000
lilac dark #2E2E61
lilac #669
lilac light #B4B4CB
lilac very light #E0E0E9
white #FAFAFF
--------------------------------------------------------------------------------------------
-
+--------------------------------------------------------------------------------------------------
+Characteristic of this style is that it uses the full width of the browser
+window and that horizontal highlighting bars extend over the full width of
+the page.
+--------------------------------------------------------------------------------------------------
# $Id$
NarrativeWeb Styles
---------------------------------------------------------------------------------------------
+------------------------------------------------------------------------------------------------
General Elements
----------------------------------------------------- */
body {
- font-family:sans-serif;
- color:#000;
- margin:0;
- padding:0;
- background-color:#FAFAFF;
+ font-family: sans-serif;
+ font-size: 90%;
+ color: black;
+ margin: 0px;
+ background-color: #E0E0E9;
}
-div {
- margin:0;
- padding:0;
-}
-img {
- border:none;
- margin:0;
-}
-.thumbnail a:hover {
- background:none;
+body > div {
+ clear: both;
}
.content {
- padding-top: 1cm;
- background-color:#FAFAFF;
+ background-color: #FAFAFF;
+ border-top: solid 1px #669;
}
.content div.snapshot {
- float:right;
- margin:20px;
- padding:0;
- background:none;
-}
-.content div.snapshot div.thumbnail {
- margin:0;
- padding:0;
- background:none;
+ float: right;
+ margin: 2em;
}
.fullclear {
- width:100%;
- height:1px;
- margin:0;
- padding:0;
- clear:both;
+ clear: both;
}
/* General Text
----------------------------------------------------- */
h1 {
- font-size:1.4em;
- font-weight:bold;
- margin:0;
-}
-h2 {
- display:none;
+ font-size: x-large;
+ font-weight: bold;
+ padding-left: 15px;
}
h3 {
- font-size:1.2em;
- font-weight:bold;
- margin-left:12px;
- text-align:left;
- margin:0;
- padding:.5em 20px .2em 20px;
+ font-size: large;
+ padding-left: 15px;
}
h4 {
- font-size:.8em;
- color:#2E2E61;
- margin:0;
- padding:.2em 0 .2em 20px;
- background-color:#E0E0E9;
- border-bottom:solid 1px #669;
-}
-h5, h6 {
- font-style:italic;
- margin:1.3em 0 .5em 1em;
-}
-p {
- font-size:14px;
- line-height:17px;
- margin:0;
+ font-size: medium;
+ color: #2E2E61;
+ background-color: #B4B4CB;
+ padding-left: 15px;
+ margin-bottom: 0px;
+ border-bottom: solid 1px #669;
}
p#description {
- padding:0 15px 1em 15px;
+ padding-left: 15px;
}
-p a:link {
- text-decoration:underline;
+a {
+ color: black;
+ text-decoration: none;
}
-sup {
- line-height:0;
-}
-ol {
-}
-ol li a {
- text-decoration:none;
-}
-a:link {
- color:#000;
- text-decoration:underline;
-}
-a:hover, a:active {
- background-color:#E0E0E9;
- color:#000;
- text-decoration:underline;
-}
-a:visited {
- color:#000;
- text-decoration:underline;
+a[href]:hover, a[href]:active {
+ background-color: #E0E0E9
}
.grampsid {
- font:normal .8em/1.2em monospace;
- color:#669;
+ font-family: monospace;
+ font-size: smaller;
+ color: #669;
}
/* Header
----------------------------------------------------- */
-#header {
- padding:15px 15px 2px 15px;
- margin:0;
- background-color:#E0E0E9;
-}
#SiteTitle {
- color:#2E2E61;
- margin:0 0 3px 0;
+ color: #2E2E61;
}
-#header p {
- font-size:1em;
- font-weight:bold;
- color:#669;
- margin:0;
+#user_header, #user_footer {
+ padding-left: 15px;
}
/* Navigation
----------------------------------------------------- */
#navigation, #subnavigation {
- margin:0;
- padding:4px 0 0 0;
- background-color:#E0E0E9;
+ border: solid 1px #E0E0E9; /* needed by IE7 */
+}
+#subnavigation ul {
+ overflow: hidden;
}
#navigation ul, #subnavigation ul {
- list-style:none;
- min-width:770px;
- height:22px;
- margin:0;
- padding:0 0 0 12px;
- border-bottom:1px solid #669;
+ list-style: none;
+ margin: 0px;
+ padding-left: 15px;
+}
+#subnavigation ul {
+ border-bottom: solid 1px #669;
}
#navigation ul li, #subnavigation ul li {
- margin:0;
- padding:0;
- float:left;
+ float: left;
}
#navigation ul li a, #subnavigation ul li a {
- display:block;
- font-size:12px;
- line-height:100%;
- font-weight:bold;
- text-decoration:none;
- margin:0;
- padding:5px 5px;
- background-color:#E0E0E9;
+ display: block;
+ font-size: smaller;
+ font-weight: bold;
+ padding: 5px;
+ border-bottom: solid 1px #E0E0E9;
}
#navigation ul li a:hover, #subnavigation ul li a:hover {
- background-color:#B4B4CB;
- border-bottom:solid 1px #000;
+ text-decoration: none;
+ background-color: #B4B4CB;
+ border-bottom: solid 1px black;
}
-#navigation ul li.CurrentSection a, #subnavigation ul li.CurrentSection a {
- padding-bottom:4px;
- border-top:solid 1px #669;
- border-right:solid 1px #669;
- border-left:solid 1px #669;
- border-bottom:solid 1px #FAFAFF;
- background-color:#FAFAFF;
-}
-#navigation ul li.CurrentSection a:hover {
- background-color:#FAFAFF;
+#navigation ul li.CurrentSection a {
+ position: relative;
+ top: 1px;
+ border: solid 1px #669;
+ border-bottom-style: none;
+ background-color: #FAFAFF;
}
#subnavigation ul li.CurrentSection a {
- border-width:0 0 1px 0;
+ background-color: #FAFAFF;
}
/* Alphabet Navigation
----------------------------------------------------- */
-div#alphabet {
- width: 100%;
- margin: 0;
+#alphabet {
background-color: #E0E0E9;
}
-div#alphabet ul {
- list-style:none;
- min-width:770px;
- height:24px;
- margin:0;
- padding: 0px 0px 0px 16px;
+#alphabet ul {
+ list-style: none;
border-width: 2px 0px 4px 0px;
border-style: solid;
- border-color: #000;
+ border-color: black;
+ margin: 0px;
+ padding-left: 15px;
+ /* float container stretch, see www.quirksmode.org/css/clearing.html */
+ overflow: hidden;
}
-div#alphabet ul li:after {
- content:" |";
+#alphabet ul li {
+ float: left;
+ font-size: larger;
+ font-weight: bold;
}
-div#alphabet ul li {
- margin:0;
- float:left;
+#alphabet ul li:after {
+ content: " |";
}
-div#alphabet ul li a {
- display:block;
- padding: 4px 8px 4px 8px;
- float:left;
- font:bold 16px/100% sans;
- margin:0;
- text-decoration:none;
- color: #000;
+#alphabet ul li a {
+ display: block;
+ padding: 4px 8px;
+ line-height: 100%;
+ float: left;
}
-div#alphabet ul li a:hover {
- background-color: #000;
- color: #FFF;
+#alphabet ul li a:hover {
+ text-decoration: none;
+ background-color: black;
+ color: #FAFAFF;
}
/* Main Table
----------------------------------------------------- */
table {
- font-size:14px;
- margin:0 15px;
- padding:0;
- border:none;
- border-collapse:collapse;
+ border-collapse: collapse;
+ width: 100%;
+}
+div#summaryarea > table.infolist,
+div#parents > table.infolist,
+h3 + table.infolist {
+ width: auto;
}
table tr th {
- font-weight: bold;
text-align: left;
- margin:0;
- padding:.1em 10px;
- background-color:#B4B4CB;
- border-top:solid 1px #669;
- border-bottom:solid 1px #669;
+ background-color: #E0E0E9;
+ border-top: solid 1px #669;
+ border-bottom: solid 1px #669;
}
-table.infolist tr th:first-child {
- border-left:solid 1px #669;
+table tr th:first-child {
+ border-left: solid 1px #669;
}
-table.infolist tr th:last-child {
- border-right:solid 1px #669;
+table tr th:last-child {
+ border-right: solid 1px #669;
}
-table.infolist tr th a {
- text-decoration:none;
+table.primobjlist tr th {
+ background-color: #B4B4CB;
}
-table tr td {
- vertical-align:middle;
- padding:.1em 10px;
+table td, table th {
+ vertical-align: top;
+ padding-left: 1ex;
}
-table.infolist tr td a {
- display:block;
- text-decoration:none;
+table.primobjlist td {
+ vertical-align: middle;
}
-table.infolist tr.BeginLetter td, table.infolist tr.BeginSurname td {
- border-top:solid 1px #B4B4CB;
+table td:first-child, table th:first-child {
+ padding-left: 15px;
}
-table.infolist tr th.ColumnQuantity {
- width:30%;
+table.primobjlist tr a {
+ display: block; /* make whole td clickable */
}
-table.infolist tr td.ColumnLetter {
- font-weight:bold;
+table.primobjlist tr.BeginLetter td, table.primobjlist tr.BeginSurname td {
+ border-top: solid 1px #B4B4CB;
}
-table.infolist tbody tr td.ColumnBirth {
- font-size:.9em;
- width:10%;
+td.ColumnLetter, td.ColumnRowLabel {
+ font-weight: bold;
}
-table.infolist tbody tr td.ColumnDeath {
- font-size:.9em;
- width:10%;
+td.ColumnBirth, td.ColumnDeath, td.ColumnPartner, td.ColumnParents {
+ font-size: 90%;
}
-table.infolist tbody tr td.ColumnRowLabel {
- font-weight:bold;
- width:2%;
+table.infolist tr td ol {
+ margin: 0px;
}
-table.infolist tbody tr td.ColumnType {
- width:6%;
- padding-left:20px;
+#summaryarea table.infolist td.ColumnAttribute,
+#parents table.infolist td.ColumnAttribute,
+#families table.infolist td.ColumnType,
+#families table.infolist td.ColumnAttribute {
+ color: #2E2E61;
}
-table.infolist tbody tr td.ColumnPartner {
- font-size:.9em;
+/* div summaryarea is missing for events, sources and repos! */
+h3 + table.infolist td.ColumnAttribute {
+ color: #2E2E61;
}
-table.infolist tbody tr td.ColumnParents {
- font-size:.9em;
-}
-table.infolist tbody tr td.ColumnParents span.father, table.infolist tbody tr td.ColumnParents span.mother {
- display:block;
-}
-table.infolist tbody tr td.ColumnParents span.mother:before {
- content:"+ ";
-}
-table.infolist tbody p.EventNote {
- border-top:dashed 1px #B4B4CB;
- padding-top:1em;
- padding-bottom:1em;
+table.primobjlist td.ColumnParents span.mother:before {
+ content: "+ ";
}
/* Surnames
----------------------------------------------------- */
-#Surnames { }
-#SurnameDetail p#description { padding-top:0; }
-table.surnamelist tbody tr td.ColumnSurname {
- width:50%;
+table#SortByName td.ColumnSurname, table#SortByName th.ColumnSurname,
+table#SortByCount td.ColumnQuantity, table#SortByCount th.ColumnQuantity {
+ background-color: #E0E0E9;
}
-table.surnamelist thead tr th.ColumnSurname {
- padding:0;
+table#SortByName td.ColumnSurname a[href]:hover {
+ background-color: #B4B4CB;
}
-table.surnamelist thead tr th.ColumnQuantity {
- width:40%;
- padding:0;
+/* make the whole cell light up on hover not just the a. */
+table#SortByName td.ColumnSurname,
+table#SortByName th.ColumnSurname,
+table#SortByName th.ColumnQuantity {
+ padding-left: 0px;
}
-table.infolist thead tr th.ColumnSurname a, table.infolist thead tr th.ColumnQuantity a {
- display:block;
- padding:.1em 10px;
+table#SortByName td.ColumnSurname > a,
+table#SortByName th.ColumnSurname > a,
+table#SortByName th.ColumnQuantity > a {
+ padding-left: 1ex;
}
-table#SortByName thead tr th.ColumnSurname a, table#SortByCount thead tr th.ColumnQuantity a {
- background-color:#E0E0E9;
+table#SortByName thead th.ColumnSurname a:after,
+table#SortByCount thead th.ColumnQuantity a:after {
+ content: " \2193";
}
-table#SortByName thead tr th.ColumnSurname a:after, table#SortByCount thead tr th.ColumnQuantity a:after {
- content:" ↓";
+table.surname td.ColumnName {
+ background-color: #E0E0E9;
}
-table.infolist tbody tr td.ColumnSurname {
- padding:0;
- background-color:#E0E0E9;
+table.surname td.ColumnName a[href]:hover {
+ background-color: #B4B4CB;
}
-table.infolist tbody tr td.ColumnSurname a {
- padding:.1em 10px;
+/* make the whole cell light up on hover not just the a. */
+table.surname td.ColumnName {
+ padding-left: 0px;
}
-table.infolist tbody tr td.ColumnSurname a:hover {
- padding:.1em 10px;
- background-color:#B4B4CB;
-}
-table.surname {
- border-bottom:solid 1px #E0E0E9;
-}
-table.surname tbody tr td {
- border-bottom:dashed 1px #B4B4CB;
-}
-table.surname tbody tr td.ColumnName {
- width:20%;
- padding:0;
- background-color:#E0E0E9;
-}
-table.surname tbody tr td.ColumnName a {
- display:block;
- padding:.6em 10px .6em 20px;
-}
-table.surname tbody tr td.ColumnName a:hover {
- background-color:#B4B4CB;
-}
-table.surname tbody tr td.ColumnName a span.grampsid {
- display:none;
-}
-table.surname thead tr th.ColumnParents, table.surname tbody tr td.ColumnParents {
- width:25%;
+table.surname td.ColumnName > a {
+ padding-left: 15px;
}
/* Individuals
----------------------------------------------------- */
-#Individuals { }
-#Individuals table.individuallist {
- border-bottom:solid 1px #E0E0E9;
-}
-#Individuals table.individuallist tbody tr td {
- border-bottom:dashed 1px #B4B4CB;
-}
-#Individuals table.individuallist tbody tr td a:hover {
- text-decoration:none;
-}
-table.individuallist tbody tr td.ColumnSurname {
- background:none;
-}
-table.individuallist tbody tr td.ColumnSurname a:hover, table.individuallist tbody tr td.ColumnSurname a:active {
- cursor:default;
- color:black;
- background:none;
-}
-table.individuallist tbody tr td.ColumnName {
- padding:0;
- background-color:#E0E0E9;
-}
-table.individuallist tbody tr td.ColumnName a {
- display:block;
- padding:.6em 10px;
- vertical-align:middle;
-}
-table.individuallist tbody tr td.ColumnName a:hover {
- background-color:#B4B4CB;
-}
-#Individuals div table.infolist tr td p {
- vertical-align:top;
-}
-#Individuals div table.infolist tr td p a {
- display:inline;
-}
-
-/* IndividualDetail
------------------------------------------------------- */
-#IndividualDetail {
- background-color:#E0E0E9;
-}
-#IndividualDetail div table.infolist tr td {
- font:normal .9em/1.2em sans-serif;
- vertical-align:top;
-}
-#IndividualDetail div table.infolist tr td a {
- display:inline;
-}
-#IndividualDetail table.infolist tr td a:hover {
- text-decoration:underline;
-}
-#IndividualDetail table.infolist tbody tr td.ColumnAttribute {
- width:10%;
- color:#696969;
-}
-#IndividualDetail div.subsection table tr td:first-child {
- padding-left:20px;
-}
-#familymap a.familymap {
- margin-left:20px;
-}
-
-/* Subsections : Attributes
------------------------------------------------------ */
-div#attributes {
- margin: 0;
- padding: 0;
-}
-table.attrlist {
- width: 100%;
-}
-table.attrlist thead tr th {
- background-color: #70B1ED;
- color: #000;
-}
-table.attrlist tbody tr td {
- border-bottom: dashed 1px #000;
-}
-table.attrlist tbody tr td.ColumnType {
- width: 15%;
-}
-table.attrlist tbody tr td.ColumnValue {
- width: 15%;
-}
-table.attrlist tbody tr td.ColumnNotes {
- width: 40%;
-}
-table.attrlist tbody tr td.ColumnSources {
- width: 10%;
-}
-
-/* Sources
------------------------------------------------------ */
-#Sources table.infolist tbody tr td.ColumnRowLabel {
- padding-bottom:0;
-}
-#Sources table.infolist tbody tr td.ColumnName {
- padding:0;
-}
-#Sources table.infolist tbody tr td.ColumnName a {
- padding:.1em 10px .3em 10px;
-}
-#SourceDetail div#references ol li {
- padding-bottom:.5em;
-}
-
-/* Relationships
-================================================= */
-table.relationships thead tr th.ColumnMarriage,
-table.relationships thead tr th.ColumnDivorce {
- width: 13%;
-}
-table.relationships thead tr th.ColumnHyper {
- width: 15%;
-}
-table.relationships thead tr th.ColumnMedia {
- width: 15%;
-}
-table.relationships tbody tr td.ColumnRowLabel a {
- background: none;
-}
-table.relationships tbody tr td.ColumnPartner {
- font-size: 100%;
+table.IndividualList td.ColumnSurname {
+ background-color: #E0E0E9;
}
/* Places
----------------------------------------------------- */
-#Places table.infolist tbody tr td.ColumnName {
- padding:0;
+#Places table.infolist td.ColumnName {
+ background-color: #E0E0E9;
}
-#Places table.infolist tbody tr td.ColumnName a {
- padding:.1em 10px .3em 10px;
+#Places table.infolist td.ColumnName a[href]:hover {
+ background-color: #B4B4CB;
+}
+/* make the whole cell light up on hover not just the a. */
+#Places table.infolist td.ColumnName {
+ padding-left: 0px;
+}
+#Places table.infolist td.ColumnName > a {
+ padding-left: 1ex;
}
/* Events
----------------------------------------------------- */
#EventList table.infolist tr.BeginType td {
- border-top: dashed 1px #B4B4CB;
+ border-top:dashed 1px #B4B4CB;
}
#EventList table.infolist tr.BeginLetter td {
- border-top: solid 1px #B4B4CB;
+ border-top:solid 1px #B4B4CB;
}
-#EventList table.infolist tr td a,
-#EventDetail table.infolist tr td a {
+#EventList table.infolist td.ColumnType {
+ background-color: #E0E0E9;
+}
+#EventList td.ColumnPerson a {
display: inline;
}
-#EventList table.infolist tr td span.father,
-#EventList table.infolist tr td span.mother,
-#EventDetail table.infolist tr td span.father,
-#EventDetail table.infolist tr td span.mother {
- display: block;
-}
-#EventList table.infolist tr td span.person:after,
-#EventList table.infolist tr td span.father:after,
-#EventList table.infolist tr td span.mother:after,
-#EventDetail table.infolist tr td span.person:after,
-#EventDetail table.infolist tr td span.father:after,
-#EventDetail table.infolist tr td span.mother:after {
+#EventList td.ColumnPerson span.person:after,
+#EventList td.ColumnPerson span.father:after,
+#EventList td.ColumnPerson span.mother:after,
+#EventDetail td.ColumnPerson span.person:after,
+#EventDetail td.ColumnPerson span.father:after,
+#EventDetail td.ColumnPerson span.mother:after {
content: ", ";
}
-#EventList table.infolist tr td span.person:last-child:after,
-#EventList table.infolist tr td span.father:last-child:after,
-#EventList table.infolist tr td span.mother:last-child:after,
-#EventDetail table.infolist tr td span.person:last-child:after,
-#EventDetail table.infolist tr td span.father:last-child:after,
-#EventDetail table.infolist tr td span.mother:last-child:after {
+#EventList td.ColumnPerson span.fatherNmother:after,
+#EventDetail td.ColumnPerson span.fatherNmother:after {
+ content: " + ";
+}
+#EventList td.ColumnPerson span.person:last-child:after,
+#EventList td.ColumnPerson span.father:last-child:after,
+#EventList td.ColumnPerson span.mother:last-child:after,
+#EventDetail td.ColumnPerson span.person:last-child:after,
+#EventDetail td.ColumnPerson span.father:last-child:after,
+#EventDetail td.ColumnPerson span.mother:last-child:after {
content: "";
}
/* Gallery
----------------------------------------------------- */
-#Gallery table.infolist tbody tr td.ColumnRowLabel, #Gallery table.infolist tbody tr td.ColumnDate {
- padding-bottom:0;
-}
-#Gallery table.infolist tbody tr td.ColumnName {
- padding:0;
-}
-#Gallery table.infolist tbody tr td.ColumnName a {
- padding:.1em 10px .3em 10px;
-}
-#Gallery table.infolist tbody tr td.ColumnName a:hover {
- background-color:#E0E0E9;
-}
#GalleryNav {
- font-size:.8em;
- margin:1em 0 0 0;
- padding:1.2em 0 0 0;
- text-align:center;
+ text-align: center;
+ margin: 2em 0px;
}
#GalleryNav a {
- font-weight:bold;
- text-decoration:none;
- background-color:#E0E0E9;
- border:solid 1px #669;
+ font-weight: bold;
+ background-color: #E0E0E9;
+ border: solid 1px #669;
+ margin: 1em;
}
#GalleryNav a:hover {
- background-color:#B4B4CB;
+ background-color: #B4B4CB;
}
#GalleryNav a#Previous {
- padding:.4em .7em .3em .7em;
+ padding: .4em .7em .3em .7em;
}
#GalleryNav a#Next {
- padding:.4em 1.9em .3em 1.9em;
-}
-#GalleryPages {
- margin:0 1em;
+ padding: .4em 1.9em .3em 1.9em;
}
#GalleryCurrent {
- font-size:1.2em;
- font-weight:bold;
+ font-size: larger;
}
#GalleryTotal {
- font-weight:normal;
+ font-weight: normal;
}
#GalleryDisplay {
- margin:0 auto;
- padding:0;
- position:relative;
- overflow:hidden;
- text-align:center;
- border:solid 1px #669;
+ margin: 0px auto;
+ position: relative;
}
#GalleryDisplay img {
- margin:0 auto;
+ margin: 0px auto;
+ display: block;
+ border: solid 1px #669;
}
-#GalleryDetail div#summaryarea{
- margin:0;
- padding:1.4em 0 0 0;
-}
-#GalleryDetail div#summaryarea h3 {
- text-align:center;
-}
-#GalleryDetail div h4 {
- margin-top:0;
-}
-#GalleryDetail div#summaryarea table.gallery {
- width:100%;
- margin-top:1.5em;
- margin-bottom:0;
- padding-bottom:0;
- background-color:#E0E0E9;
- border-style:solid;
- border-width:8px 0 0 0;
- border-color:#B4B4CB;
-}
-
-/* Thumbnail Preview Reference Section
-------------------------------------------------- */
-body#ThumbnailPreview div#references {
- background-color: #FFF;
- color: #00029D;
- margin: 0 auto;
- padding: 0;
- width: 100%;
-}
-body#ThumbnailPreview div#references table.infolist tbody tr {
- border-bottom: dashed 1px #000;
-}
-body#ThumbnailPreview div#references table.infolist tbody tr td.ColumnRowLabel a {
- background: none;
- width: 2%;
-}
-body#ThumbnailPreview div#references table.infolist tbody tr td.ColumnName {
- width: 90%;
+#GalleryDetail h3 {
+ text-align: center;
}
/* Contact
----------------------------------------------------- */
+#Contact {
+ overflow: hidden;
+}
#Contact #summaryarea {
- width:500px;
- margin:2em auto;
- padding:3em;
- background-color:#E0E0E9;
- border:solid 1px #669;
+ width: 40em;
+ margin: 2em auto;
+ padding: 3em;
+ background-color: #E0E0E9;
+ border: solid 1px #669;
}
-#Contact #summaryarea img {
- float:right;
- margin:0;
- padding:0;
- border:solid 1px #669;
+#Contact img {
+ float: right;
+ border: solid 1px #669;
}
-#researcher {
- margin-top:.3em;
+#Contact #researcher, #Contact #researcher h3 {
+ font-size: larger;
+ padding-left: 0px;
}
-#researcher h3 {
- padding:0;
-}
-#researcher span {
- display:block;
- float:left;
- margin-right:.4em;
-}
-#streetaddress {
- width:85%;
-}
-#locality, .locality {
+#Contact #streetaddress, #Contact #locality, #Contact #email {
display: block;
- width: 100%;
}
-#city:after {
- content:",";
+#Contact #locality, #Contact #city, #Contact #state, #Contact #postalcode,
+#Contact #country {
+ white-space: nowrap;
}
-#country {
- clear:left;
-}
-#email {
- clear:left;
-}
-#email a {
- text-decoration:none;
-}
-#email a:hover {
- text-decoration:underline;
+#Contact #city:after {
+ content: ",";
}
-/* Download
+/* Download
----------------------------------------------------- */
-#Download {
- padding:1cm;
- height:396px;
-}
-table.download {
- border:solid 2px #000;
- width:100%;
-}
-table.download img {
- float:center;
-}
-table.download thead tr th {
- text-align:center;
- border:solid 2px #000;
- color: #000;
- text-transform:uppercase;
-}
-table.download tbody tr#Row02 {
- border-bottom:solid 2px #000;
-}
-table.download thead tr th, table.download tbody tr td {
- padding-left:10px;
- padding-top:20px;
- border-style:solid;
- border-color:#000;
- border-width:0 2px 2px 2px;
- text-align:left;
-}
-table.download td.Description {
- width: 50%;
-}
-table.download td.License {
- width:8%;
-}
-table.download td.Filename {
- width:30%;
-}
-table.download td.Filename a {
- font-weight:bold;
- font-style: italic;
- text-decoration:none;
-}
-table.download td.Filename a:hover {
- text-decoration:underline;
-}
-table.download td.Modified {
- width:12%;
- font-weight:bold;
+#Download table.download a {
+ display: block;
}
-/* Subsections
+/* Subsection
----------------------------------------------------- */
-#Home, #Introduction, #Contact {
- padding:1.5em 0 3em 0;
+#Home, #Introduction {
+ overflow: hidden;
}
-#Home p, #Introduction p, #Contact p {
- margin:0 20px 1em 20px;
+#Home img, #Introduction img {
+ float: right;
+ margin: 1em;
+ max-width: 950px;
}
-#Home img, #Introduction img, #Contact img {
- float:right;
- margin:0;
- padding:0 20px 3em 20px;
+#Home p, #Introduction p {
+ padding-left: 15px;
}
-#Home a, #Introduction a, #Contact a {
- color: #000;
- text-decoration: none;
+.subsection {
+ clear: both;
+ overflow: hidden;
}
-div.subsection{
- padding-bottom:.5em;
- background-color:#FAFAFF;
-}
-div.subsection h4 {
- margin-bottom:.5em;
-}
-div.subsection table, div.subsection ol, div.subsection p, div.subsection > a {
- font-size:.9em;
-}
-div.subsection a {
- text-decoration:none;
-}
-div.subsection a:hover {
- text-decoration:underline;
- background:none;
-}
-div.subsection table.infolist {
- width:100%;
- margin:0;
-}
-#IndividualDetail div.subsection table tr td:first-child {
- padding-left:20px;
+.subsection p {
+ margin: 0px;
}
-/* Subsections : Summary Area
+/* Subsection : Families
----------------------------------------------------- */
-div#summaryarea {
- min-height:100px;
- background:none;
-}
-div#summaryarea table.infolist {
- margin:0;
- padding:0;
- background:#FAFAFF;
- border-bottom:solid .7em #FAFAFF;
-}
-div#summaryarea table.infolist tr td, div#summaryarea table.infolist tr td p {
- vertical-align:top;
-}
-div#summaryarea table.infolist tr td a, div#summaryarea table.infolist tr td p a {
- display:inline;
-}
-div#summaryarea table.infolist tbody tr td.ColumnAttribute {
- width:14%;
- padding-left:20px;
-}
-
-/* Subsections : Events
------------------------------------------------------ */
-div#events {
- padding-bottom:0;
-}
-div#events h4 {
- margin-bottom:0;
-}
-div#events table.infolist {
- border-bottom:solid 1px #FAFAFF;
-}
-div#events table.infolist tbody tr td {
- padding-top:.2em;
- padding-bottom:.2em;
-}
-#IndividualDetail div#events table.infolist thead tr th:first-child {
- padding-left:20px;
-}
-div#events table.infolist tbody tr td.ColumnAttribute {
- border-bottom:dashed 1px #B4B4CB;
-}
-div#events table.infolist tbody tr td.ColumnValue {
- border-bottom:dashed 1px #B4B4CB;
-}
-div#events table.infolist tbody tr td.ColumnValue p {
- margin:.1em 2em;
-}
-
-/* Subsections : Parents
------------------------------------------------------ */
-div#parents table.infolist tbody tr td.ColumnValue ol {
- margin:0;
- padding-top:0;
-}
-div#parents table.infolist tbody tr td.ColumnValue ol li {
- padding-bottom:.2em;
-}
-
-/* Subsections : Families
------------------------------------------------------ */
-div#families table.infolist tbody tr td.ColumnValue p {
- margin-top:0;
-}
-div#families table.infolist tbody tr td.ColumnValue ol {
- margin:0;
- padding-top:0;
-}
-div#families table.infolist tbody tr td.ColumnValue ol li {
- padding-bottom:.2em;
-}
div#families table.fixed_subtables table.eventlist {
- table-layout:fixed;
+ table-layout: fixed;
}
div#families table.fixed_subtables table.eventlist th:first-child {
- width:9em;
+ width: 9em;
}
div#families table.fixed_subtables table.eventlist th:last-child {
- width:5em;
+ width: 5em;
+}
+div#families table.attrlist td.ColumnType {
+ color: black;
}
-/* Subsections : Addresses
+/* Subsection : Gallery
----------------------------------------------------- */
-div#addresses {
- padding-bottom:0;
-}
-div#addresses h4 {
- margin-bottom:0;
-}
-div#addresses table.infolist {
- border-bottom:solid 1px #FAFAFF;
-}
-div#addresses table.infolist tbody tr td {
- padding-top:.2em;
- padding-bottom:.2em;
-}
-div#addresses table.infolist tbody tr td.ColumnAttribute {
- width:30%;
- border-bottom:dashed 1px #B4B4CB;
-}
-div#addresses table.infolist tbody tr td.ColumnValue {
- border-bottom:dashed 1px #B4B4CB;
-}
-div#Addresses table.infolist tr td a, div#Addresses table.infolist tr td p a{
- display: inline;
-}
-
-/* Subsections : Attributes
------------------------------------------------------ */
-
-/* Subsections : Gallery
------------------------------------------------------ */
-#indivgallery h4 {
- margin-bottom:1em;
-}
#indivgallery .thumbnail {
- margin:0;
- float:left;
- width:130px;
- height:150px;
- text-align:center;
+ float: left;
+ max-width: 130px;
+ max-height: 150px;
+ font-size: smaller;
+ text-align: center;
+ margin: 0.8em 0.5em;
}
-#indivgallery .thumbnail a {
- display:block;
- margin:0;
- padding:0;
- background:none;
+#indivgallery h4 + .thumbnail {
+ margin-left: 15px;
+ /* Problem: if there are more thumnails then fit on a single row, the
+ * first thumnail on each next row should also have a margin-left
+ * of 15 px. */
}
-#indivgallery .thumbnail a img {
- margin:0;
- padding:0;
- border:solid 1px #669;
+#indivgallery img {
+ border: solid 1px #669;
}
-#indivgallery div.thumbnail span {
-/* ## remove this line and the comment markers from the line below to hide the description in Individual Gallery
+#indivgallery span {
+/* ## remove this line and the comment markers from the line below to hide description in Indivifual Gallery
display: none; */
-
- font-size:.6em;
- text-align:center;
- width:80%;
- margin:0 auto;
- padding:0;
}
-/* Subsections : Narrative
+/* Subsection : Narrative
----------------------------------------------------- */
-div.narrative {
- padding-bottom:0;
+h4 + div.grampsstylednote, a.familymap {
+ margin: 1em 15px;
}
-.narrative p {
- margin-top:.5em;
- margin-bottom:0;
- padding:0 20px 1em 20px;
+i + div.grampsstylednote p {
+ margin: 0px;
}
-/* Subsections : References
+/* Subsection : Family Map
----------------------------------------------------- */
-#references ol {
- margin-top:0;
- margin-bottom:0;
+a.familymap {
+ display: block;
}
-/* Subsections : Source References
+/* Subsection : Source References
----------------------------------------------------- */
-div#sourcerefs ol {
- list-style-type:decimal;
-}
-div#sourcerefs ol li ol {
- list-style-type:lower-alpha;
+#sourcerefs ol li ol {
+ list-style-type: lower-alpha;
}
-/* Subsections : Weblinks
------------------------------------------------------ */
-
-/* Subsections : Pedigree
+/* Subsection : Pedigree
----------------------------------------------------- */
.pedigreegen {
- font-size:.9em;
- list-style:none;
- margin:.5em 0 0 0;
- padding:0 0 .7em 20px;
+ list-style-type: none;
+ padding-left: 15px;
}
.pedigreegen li ol {
- list-style:none;
- margin-left:.5em;
-}
-.pedigreegen li ol li {
- padding-bottom:.2em;
+ list-style-type: none;
}
.pedigreegen li ol li ol {
- list-style:decimal;
- margin-left:1.6em;
+ list-style-type: decimal;
}
-.pedigreegen li ol li ol li ol.spouselist {
- font-size:1em;
- list-style:none;
- margin-left:0;
+.pedigreegen ol.spouselist {
+ list-style-type: none;
}
-.spouselist li.spouse ol {
- font-size:1em;
- list-style:decimal;
- margin-left:1.6em;
-}
-.spouse a {
- font-weight:normal;
+.pedigreegen ol.spouselist li.spouse ol {
+ list-style-type: decimal;
}
.spouse:before {
content: "+ ";
}
.thisperson {
- font-weight:bold;
+ font-weight: bold;
+}
+.thisperson > ol {
+ font-weight: normal;
}
/* Footer
----------------------------------------------------- */
#footer {
- clear:both;
- width:100%;
- font-size:12px;
- line-height:130%;
- color:#2E2E61;
- margin:0;
- padding:15px 0 0 0;
- background-color:#B4B4CB;
- border-top:solid 1px #2E2E61;
+ clear: both;
+ padding-top: 1em;
+ background-color: #B4B4CB;
+ border-top: solid 1px #2E2E61;
}
-#footer a, #footer a:visited {
- text-decoration:none;
- color:#2E2E61;
-}
-#footer a:hover {
- text-decoration:underline;
-}
-#footer img {
- border:0;
- margin:0;
- vertical-align:middle;
+#footer > * {
+ background-color: #E0E0E9;
}
#footer p#createdate {
- float:left;
- width:40%;
- text-align:left;
- margin-left:10px;
+ float: left;
+ width: 50%;
+ text-align: left;
+ padding-left: 15px;
+ margin-top: 1em;
}
#footer p#copyright {
- float:right;
- width:40%;
- text-align:right;
- margin-right:10px;
+ float: right;
+ width: 40%;
+ text-align: right;
+ padding-right: 15px;
}
-#footer p#copyright img {
- margin-right:10px;
+#footer a[href]:hover {
+ background-color: #B4B4CB;
}
-#user_footer {
- width:70%;
- float:left;
- margin:1em;
-}
-#user_footer p {
- font:normal 1em/1.2em serif;
- margin:0;
- padding:0;
+
+/* Overwritten
+----------------------------------------------------- */
+body#FamilyMap {
+ background-color: #E0E0E9 ! important;
}
/* Calendar Styles
--------------------------------------------------------------------------------------------- */
-/* Calendar : General */
-body#WebCal {
- padding:0 14px;
- background-color:#2E2E61;
+===================================================== */
+table.calendar {
+ table-layout: fixed;
+ empty-cells: show;
}
-.calendar {
- empty-cells:show;
- width:100%;
- font-size:1em;
- font-weight:normal;
- margin:0;
- padding:0;
- border:none;
- border-collapse:collapse;
+.calendar thead th {
+ text-align: center;
+ border-top-style: none;
}
-.calendar thead tr th {
- width:14%;
- font-weight:bold;
- font-size:14px;
- line-height:14px;
- text-align:center;
- text-transform:uppercase;
- padding:2px 0;
+.calendar thead th.monthName {
+ font-size: xx-large;
+ font-weight: normal;
+ background-color: #FAFAFF;
+ border-bottom-style: none;
+ padding-top: 1em;
}
-.calendar thead tr th.monthName {
- width:100%;
- font-weight:normal;
- font-size:2em;
- line-height:100%;
- text-transform:none;
- color:#2E2E61;
- padding:.3em 0 .2em 0;
- background-color:#FFF;
- border-bottom-width:0;
+.calendar thead th abbr {
+ border-bottom-style: none;
}
-body#WebCal #CreatorInfo {
- float:right;
- font-size:12px;
- margin:-24px 10px 0 0;
+#CreatorInfo {
+ float: right;
+ margin: -1em 15px 0px 0px;
+ font-weight: bold;
+ color: #669;
}
-.calendar thead tr th.weekend,
-.calendar thead tr th.weekday {
- color:#2E2E61;
- background-color:#EEE;
- border-style:solid;
- border-width:0 0 1px 0;
- border-color:#B4B4CB;
-}
-.calendar thead tr th.saturday,
-.calendar thead tr th.sunday { }
-.calendar tfoot tr td {
- padding:.7em 5% 1em 5%;
- border-top:solid 4px #B4B4CB;
+#CreatorInfo a[href]:hover {
+ background-color: #B4B4CB;
}
.calendar tfoot tr td {
- vertical-align:middle;
- color:#2E2E61;
- background-color:#EEE;
+ border-top: solid 4px #669;
+ vertical-align: middle;
}
/* Calendar : Date Numeral */
-.calendar tbody tr td div.date {
- float:right;
- display:block;
- width:1.8em;
- font-weight:bold;
- font-size:1em;
- line-height:100%;
- text-align:center;
- color:#2E2E61;
- margin:0 0 0 .5em;
- padding:.2em 0;
- background-color:#B4B4CB;
+.calendar div.date {
+ float: right;
+ width: 1.8em;
+ font-size: large;
+ text-align: center;
+ background-color: #B4B4CB;
+ color: #2E2E61;
}
/* Calendar : Date Container */
-.calendar tbody tr td {
- vertical-align:top;
- height:10em;
- padding:0;
- border-width:1px 0 0 1px;
- border-style:solid;
- border-color:#B4B4CB;
+.calendar td {
+ padding: 0px 0px 0px 1ex;
+ border-width: 1px 0px 0px 1px;
+ border-style: solid;
+ border-color: #B4B4CB;
+ background-color: #FAFAFF;
}
-.calendar tbody tr td.weekday {
- background-color:#FFF;
-}
-.calendar tbody tr td.weekend {
- background-color:#E0E0E9;
-}
-.calendar tbody tr td.saturday {
-
- }
-.calendar tbody tr td:first-child {
- border-left:none;
+.calendar td:first-child {
+ border-left-style: none;
+ padding: 0px 0px 0px 1ex;
}
.calendar tbody tr:first-child td {
- border-top:none;
+ border-top-style: none;
}
/* Calendar : Date Detail */
-.calendar tbody tr td ul {
- list-style:none;
- font-family:sans-serif;
- font-size:.8em;
- margin:2.3em 0 .3em 0;
- padding:0;
+.calendar td ul {
+ font-size: smaller;
+ list-style: none;
+ padding: 0px;
}
-.calendar tbody tr td ul li {
- display:block;
- width:92%;
- margin:0 4%;
- padding:.2em 0 .3em 0;
- border-top:dashed 1px #C1B398;
+.calendar td ul li {
+ border-top: dashed 1px #B4B4CB;
+ padding-top: 0.5em;
+ padding-bottom: 0.5em;
}
-.calendar tbody tr td ul li:first-child {
- border:none;
+.calendar td ul li:first-child {
+ border-style: none;
+}
+.calendar td ul a[href]:hover {
+ background-color: #B4B4CB;
}
/* Calendar : Birthday, Anniversary, Highlight */
-.calendar tbody tr td ul li em {
- font-style:normal;
- color:#2E2E61;
+.calendar td ul li em {
+ font-style: normal;
+ color: #669;
}
-.calendar tbody tr td ul li span.yearsmarried em {
- color:#2E2E61;
+.calendar td.highlight {
+ background-color: #E0E0E9;
}
-.calendar tbody tr td.highlight {
- background-color:#FFEBC2;
-}
-.calendar tbody tr td.highlight div.date {
- color:#FF7C27;
- background-color:#FFCF6C;
+.calendar td.highlight div.date {
+ color: black;
+ background-color: #B4B4CB;
}
/* Calendar : Previous-Next Month */
-.calendar tbody tr td.previous,
-.calendar tbody tr td.next,
-.calendar tbody tr td.previous div.date,
-.calendar tbody tr td.next div.date {
- color:#B4B4CB;
- background-color:#E0E0E9;
+.calendar td.previous,
+.calendar td.next,
+.calendar td.previous div.date,
+.calendar td.next div.date {
+ color: #B4B4CB;
+ background-color: #FAFAFF;
}
/* Calendar : Full Year */
body#fullyearlinked div.content {
- width:963px;
- margin:0 auto;
- padding:15px 0 2px 2px;
+ overflow: hidden;
}
body#fullyearlinked table.calendar {
- float:left;
- width:320px;
- height:18em;
- border:solid 1px #7D5925;
+ float: left;
+ width: 33.3%;
+ height: 18em;
+ border: solid 1px black;
}
-body#fullyearlinked table.calendar thead tr th {
- height:2em;
+body#fullyearlinked table.calendar thead th {
+ height: 2em;
}
-body#fullyearlinked table.calendar thead tr th.monthName {
- font-size:1.2em;
- padding:2px 0;
+body#fullyearlinked table.calendar thead th.monthName {
+ font-size: large;
+ padding: 2px 0px;
}
-body#fullyearlinked table.calendar tbody tr td {
- height:3em;
+body#fullyearlinked table.calendar tbody td {
+ height: 3em;
+}
+body#OneDay div.content {
+ overflow: hidden;
}
diff --git a/src/plugins/webstuff/css/Web_Basic-Peach.css b/src/plugins/webstuff/css/Web_Basic-Peach.css
index 4022afb26..e584084fd 100644
--- a/src/plugins/webstuff/css/Web_Basic-Peach.css
+++ b/src/plugins/webstuff/css/Web_Basic-Peach.css
@@ -6,11 +6,11 @@ GRAMPS Cascading Style Sheet
Style Name: Basic-Peach Stylesheet
Style Author: Jason M. Simanek (2008)
Note: Adapted from GRAMPS original Modern Style stylesheet with a new orange color scheme.
-
**************************************************************************************************
This website was created with GRAMPS
--------------------------------------------------------------------------------------------------
GRAMPS is a Free Software Project for Genealogy, offering a professional
+
genealogy program, and a wiki open to all. It is a community project, created,
developed and governed by genealogists.
@@ -20,6 +20,7 @@ Go to to learn more!
Copyright 2008 Jason M. Simanek
Copyright 2009 Stephane Charette
Copyright (C) 2008-2011 Rob G. Healey
+Copyright 2011 Michiel D. Nauta
This file is part of the GRAMPS program.
@@ -37,1216 +38,679 @@ GRAMPS. If not, see .
Color Palette
--------------------------------------------------------------------------------------------------
+
black #36220B
brown #8C581C
orange dark #EA8414
orange #FFC35E
orange light #FFE09F
yellow light #FFFBE7
----------------------------------------------------------------------------------------------------
-
+--------------------------------------------------------------------------------------------------
+Characteristic of this style is that it uses the full width of the browser
+window and that horizontal highlighting bars extend over the full width of
+the page.
+--------------------------------------------------------------------------------------------------
# $Id$
NarrativeWeb Styles
---------------------------------------------------------------------------------------------
+------------------------------------------------------------------------------------------------
General Elements
----------------------------------------------------- */
body {
- font-family:sans-serif;
- color:#36220B;
- margin:0;
- padding:0;
- background-color:#FFFBE7;
+ font-family: sans-serif;
+ font-size: 90%;
+ color: #36220B;
+ margin: 0px;
+ background-color: #FFE09F;
}
-div {
- margin:0;
- padding:0;
-}
-img {
- border:none;
- margin:0;
-}
-.thumbnail a:hover {
- background:none;
+body > div {
+ clear: both;
}
.content {
- padding-top: 1cm;
- background-color:#FFFBE7;
+ background-color: #FFFBE7;
+ border-top: solid 1px #8C581C;
}
.content div.snapshot {
- float:right;
- margin:20px;
- padding:0;
- background:none;
-}
-.content div.snapshot div.thumbnail {
- margin:0;
- padding:0;
- background:none;
+ float: right;
+ margin: 2em;
}
.fullclear {
- width:100%;
- height:1px;
- margin:0;
- padding:0;
- clear:both;
+ clear: both;
}
/* General Text
----------------------------------------------------- */
h1 {
- font-size:1.4em;
- font-weight:bold;
- margin:0;
-}
-h2 {
- display:none;
+ font-size: x-large;
+ font-weight: bold;
+ padding-left: 15px;
}
h3 {
- font-size:1.2em;
- font-weight:bold;
- margin-left:12px;
- text-align:left;
- margin:0;
- padding:.5em 20px .2em 20px;
+ font-size: large;
+ padding-left: 15px;
}
h4 {
- font-size:.8em;
- color:#EA8414;
- margin:0;
- padding:.2em 0 .2em 20px;
- background-color:#FFE09F;
- border-bottom:solid 1px #8C581C;
-}
-h5, h6 {
- font-style:italic;
- margin:1.3em 0 .5em 1em;
-}
-p {
- font-size:14px;
- line-height:17px;
- margin:0;
+ font-size: medium;
+ color: #EA8414;
+ background-color: #FFC35E;
+ padding-left: 15px;
+ margin-bottom: 0px;
+ border-bottom: solid 1px #8C581C;
}
p#description {
- padding:0 15px 1em 15px;
+ padding-left: 15px;
}
-p a:link {
- text-decoration:underline;
+a {
+ color: #36220B;
+ text-decoration: none;
}
-sup {
- line-height:0;
-}
-ol {
-}
-ol li a {
- text-decoration:none;
-}
-a:link {
- color:#36220B;
- text-decoration:underline;
-}
-a:hover, a:active {
- background-color:#FFE09F;
- color:#36220B;
- text-decoration:underline;
-}
-a:visited {
- color:#36220B;
- text-decoration:underline;
+a[href]:hover, a[href]:active {
+ background-color: #FFE09F
}
.grampsid {
- font:normal .8em/1.2em monospace;
- color:#8C581C;
+ font-family: monospace;
+ font-size: smaller;
+ color: #8C581C;
}
/* Header
----------------------------------------------------- */
-#header {
- padding:15px 15px 2px 15px;
- margin:0;
- background-color:#FFE09F;
-}
#SiteTitle {
- color:#EA8414;
- margin:0 0 3px 0;
+ color: #EA8414;
}
-#header p {
- font-size:1em;
- font-weight:bold;
- color:#8C581C;
- margin:0;
+#user_header, #user_footer {
+ padding-left: 15px;
}
/* Navigation
----------------------------------------------------- */
#navigation, #subnavigation {
- margin:0;
- padding:4px 0 0 0;
- background-color:#FFE09F;
+ border: solid 1px #FFE09F; /* needed by IE7 */
+}
+#subnavigation ul {
+ overflow: hidden;
}
#navigation ul, #subnavigation ul {
- list-style:none;
- min-width:770px;
- height:22px;
- margin:0;
- padding:0 0 0 12px;
- border-bottom:1px solid #8C581C;
+ list-style: none;
+ margin: 0px;
+ padding-left: 15px;
+}
+#subnavigation ul {
+ border-bottom: solid 1px #8C581C;
}
#navigation ul li, #subnavigation ul li {
- margin:0;
- padding:0;
- float:left;
+ float: left;
}
#navigation ul li a, #subnavigation ul li a {
- display:block;
- font-size:12px;
- line-height:100%;
- font-weight:bold;
- text-decoration:none;
- margin:0;
- padding:5px 5px;
- background-color:#FFE09F;
+ display: block;
+ font-size: smaller;
+ font-weight: bold;
+ padding: 5px;
+ border-bottom: solid 1px #FFE09F;
}
#navigation ul li a:hover, #subnavigation ul li a:hover {
- background-color:#FFC35E;
- border-bottom:solid 1px #36220B;
+ text-decoration: none;
+ background-color: #FFC35E;
+ border-bottom: solid 1px #36220B;
}
-#navigation ul li.CurrentSection a, #subnavigation ul li.CurrentSection a {
- padding-bottom:4px;
- border-top:solid 1px #8C581C;
- border-right:solid 1px #8C581C;
- border-left:solid 1px #8C581C;
- border-bottom:solid 1px #FFFBE7;
- background-color:#FFFBE7;
-}
-#navigation ul li.CurrentSection a:hover {
- background-color:#FFFBE7;
+#navigation ul li.CurrentSection a {
+ position: relative;
+ top: 1px;
+ border: solid 1px #8C581C;
+ border-bottom-style: none;
+ background-color: #FFFBE7;
}
#subnavigation ul li.CurrentSection a {
- border-width:0 0 1px 0;
+ background-color: #FFFBE7;
}
/* Alphabet Navigation
----------------------------------------------------- */
-div#alphabet {
- width: 100%;
- margin: 0;
+#alphabet {
background-color: #FFE09F;
}
-div#alphabet ul {
- list-style:none;
- min-width:770px;
- height:24px;
- margin:0;
- padding: 0px 0px 0px 16px;
+#alphabet ul {
+ list-style: none;
border-width: 2px 0px 4px 0px;
border-style: solid;
- border-color: #000;
+ border-color: #36220B;
+ margin: 0px;
+ padding-left: 15px;
+ /* float container stretch, see www.quirksmode.org/css/clearing.html */
+ overflow: hidden;
}
-div#alphabet ul li:after {
- content:" |";
+#alphabet ul li {
+ float: left;
+ font-size: larger;
+ font-weight: bold;
}
-div#alphabet ul li {
- margin:0;
- float:left;
+#alphabet ul li:after {
+ content: " |";
}
-div#alphabet ul li a {
- display:block;
- padding: 4px 8px 4px 8px;
- float:left;
- font:bold 16px/100% sans;
- margin:0;
- text-decoration:none;
- color: #000;
+#alphabet ul li a {
+ display: block;
+ padding: 4px 8px;
+ line-height: 100%;
+ float: left;
}
-div#alphabet ul li a:hover {
- background-color: #000;
- color: #FFF;
+#alphabet ul li a:hover {
+ text-decoration: none;
+ background-color: #36220B;
+ color: #FFFBE7;
}
/* Main Table
----------------------------------------------------- */
table {
- font-size:14px;
- margin:0 15px;
- padding:0;
- border:none;
- border-collapse:collapse;
+ border-collapse: collapse;
+ width: 100%;
+}
+div#summaryarea > table.infolist,
+div#parents > table.infolist,
+h3 + table.infolist {
+ width: auto;
}
table tr th {
- font-weight: bold;
text-align: left;
- margin:0;
- padding:.1em 10px;
- background-color:#FFC35E;
- border-top:solid 1px #8C581C;
- border-bottom:solid 1px #8C581C;
+ background-color: #FFE09F;
+ border-top: solid 1px #8C581C;
+ border-bottom: solid 1px #8C581C;
}
-table.infolist tr th:first-child {
- border-left:solid 1px #8C581C;
+table tr th:first-child {
+ border-left: solid 1px #EA8414;
}
-table.infolist tr th:last-child {
- border-right:solid 1px #8C581C;
+table tr th:last-child {
+ border-right: solid 1px #EA8414;
}
-table.infolist tr th a {
- text-decoration:none;
+table.primobjlist tr th {
+ background-color: #FFC35E;
}
-table tr td {
- vertical-align:middle;
- padding:.1em 10px;
+table td, table th {
+ vertical-align: top;
+ padding-left: 1ex;
}
-table.infolist tr td a {
- display:block;
- text-decoration:none;
+table.primobjlist td {
+ vertical-align: middle;
}
-table.infolist tr.BeginLetter td, table.infolist tr.BeginSurname td {
- border-top:solid 1px #FFC35E;
+table td:first-child, table th:first-child {
+ padding-left: 15px;
}
-table.infolist tr th.ColumnQuantity {
- width:30%;
+table.primobjlist tr a {
+ display: block; /* make whole td clickable */
}
-table.infolist tr td.ColumnLetter {
- font-weight:bold;
+table.primobjlist tr.BeginLetter td, table.primobjlist tr.BeginSurname td {
+ border-top: solid 1px #FFC35E;
}
-table.infolist tbody tr td.ColumnBirth {
- font-size:.9em;
- width:10%;
+td.ColumnLetter, td.ColumnRowLabel {
+ font-weight: bold;
}
-table.infolist tbody tr td.ColumnDeath {
- font-size:.9em;
- width:10%;
+td.ColumnBirth, td.ColumnDeath, td.ColumnPartner, td.ColumnParents {
+ font-size: 90%;
}
-table.infolist tbody tr td.ColumnRowLabel {
- font-weight:bold;
- width:2%;
+table.infolist tr td ol {
+ margin: 0px;
}
-table.infolist tbody tr td.ColumnType {
- width:6%;
- padding-left:20px;
+#summaryarea table.infolist td.ColumnAttribute,
+#parents table.infolist td.ColumnAttribute,
+#families table.infolist td.ColumnType,
+#families table.infolist td.ColumnAttribute {
+ color: #8C581C;
}
-table.infolist tbody tr td.ColumnPartner {
- font-size:.9em;
+/* div summaryarea is missing for events, sources and repos! */
+h3 + table.infolist td.ColumnAttribute {
+ color: #8C581C;
}
-table.infolist tbody tr td.ColumnParents {
- font-size:.9em;
-}
-table.infolist tbody tr td.ColumnParents span.father, table.infolist tbody tr td.ColumnParents span.mother {
- display:block;
-}
-table.infolist tbody tr td.ColumnParents span.mother:before {
- content:"+ ";
-}
-table.infolist tbody p.EventNote {
- border-top:dashed 1px #FFC35E;
- padding-top:1em;
- padding-bottom:1em;
+table.primobjlist td.ColumnParents span.mother:before {
+ content: "+ ";
}
/* Surnames
----------------------------------------------------- */
-#Surnames { }
-#SurnameDetail p#description { padding-top:0; }
-table.surnamelist tbody tr td.ColumnSurname {
- width:50%;
+table#SortByName td.ColumnSurname, table#SortByName th.ColumnSurname,
+table#SortByCount td.ColumnQuantity, table#SortByCount th.ColumnQuantity {
+ background-color: #FFE09F;
}
-table.surnamelist thead tr th.ColumnSurname {
- padding:0;
+table#SortByName td.ColumnSurname a[href]:hover {
+ background-color: #FFC35E;
}
-table.surnamelist thead tr th.ColumnQuantity {
- width:40%;
- padding:0;
+/* make the whole cell light up on hover not just the a. */
+table#SortByName td.ColumnSurname,
+table#SortByName th.ColumnSurname,
+table#SortByName th.ColumnQuantity {
+ padding-left: 0px;
}
-table.infolist thead tr th.ColumnSurname a, table.infolist thead tr th.ColumnQuantity a {
- display:block;
- padding:.1em 10px;
+table#SortByName td.ColumnSurname > a,
+table#SortByName th.ColumnSurname > a,
+table#SortByName th.ColumnQuantity > a {
+ padding-left: 1ex;
}
-table#SortByName thead tr th.ColumnSurname a, table#SortByCount thead tr th.ColumnQuantity a {
- background-color:#FFE09F;
+table#SortByName thead th.ColumnSurname a:after,
+table#SortByCount thead th.ColumnQuantity a:after {
+ content: " \2193";
}
-table#SortByName thead tr th.ColumnSurname a:after, table#SortByCount thead tr th.ColumnQuantity a:after {
- content:" ↓";
+table.surname td.ColumnName {
+ background-color: #FFE09F;
}
-table.infolist tbody tr td.ColumnSurname {
- padding:0;
- background-color:#FFE09F;
+table.surname td.ColumnName a[href]:hover {
+ background-color: #FFC35E;
}
-table.infolist tbody tr td.ColumnSurname a {
- padding:.1em 10px;
+/* make the whole cell light up on hover not just the a. */
+table.surname td.ColumnName {
+ padding-left: 0px;
}
-table.infolist tbody tr td.ColumnSurname a:hover {
- padding:.1em 10px;
- background-color:#FFC35E;
-}
-table.surname {
- border-bottom:solid 1px #FFE09F;
-}
-table.surname tbody tr td {
- border-bottom:dashed 1px #FFC35E;
-}
-table.surname tbody tr td.ColumnName {
- width:20%;
- padding:0;
- background-color:#FFE09F;
-}
-table.surname tbody tr td.ColumnName a {
- display:block;
- padding:.6em 10px .6em 20px;
-}
-table.surname tbody tr td.ColumnName a:hover {
- background-color:#FFC35E;
-}
-table.surname tbody tr td.ColumnName a span.grampsid {
- display:none;
-}
-table.surname thead tr th.ColumnParents, table.surname tbody tr td.ColumnParents {
- width:25%;
+table.surname td.ColumnName > a {
+ padding-left: 15px;
}
/* Individuals
----------------------------------------------------- */
-#Individuals { }
-#Individuals table.individuallist {
- border-bottom:solid 1px #FFE09F;
-}
-#Individuals table.individuallist tbody tr td {
- border-bottom:dashed 1px #FFC35E;
-}
-#Individuals table.individuallist tbody tr td a:hover {
- text-decoration:none;
-}
-table.individuallist tbody tr td.ColumnSurname {
- background:none;
-}
-table.individuallist tbody tr td.ColumnSurname a:hover, table.individuallist tbody tr td.ColumnSurname a:active {
- cursor:default;
- color:black;
- background:none;
-}
-table.individuallist tbody tr td.ColumnName {
- padding:0;
- background-color:#FFE09F;
-}
-table.individuallist tbody tr td.ColumnName a {
- display:block;
- padding:.6em 10px;
- vertical-align:middle;
-}
-table.individuallist tbody tr td.ColumnName a:hover {
- background-color:#FFC35E;
-}
-#Individuals div table.infolist tr td p {
- vertical-align:top;
-}
-#Individuals div table.infolist tr td p a {
- display:inline;
-}
-
-/* IndividualDetail
------------------------------------------------------- */
-#IndividualDetail {
- background-color:#FFE09F;
-}
-#IndividualDetail div table.infolist tr td {
- font:normal .9em/1.2em sans-serif;
- vertical-align:top;
-}
-#IndividualDetail div table.infolist tr td a {
- display:inline;
-}
-#IndividualDetail table.infolist tr td a:hover {
- text-decoration:underline;
-}
-#IndividualDetail table.infolist tbody tr td.ColumnAttribute {
- width:10%;
- color:#696969;
-}
-#IndividualDetail div.subsection table tr td:first-child {
- padding-left:20px;
-}
-#familymap a.familymap {
- margin-left:20px;
-}
-
-/* Subsections : Attributes
------------------------------------------------------ */
-div#attributes {
- margin: 0;
- padding: 0;
-}
-table.attrlist {
- width: 100%;
-}
-table.attrlist thead tr th {
- background-color: #70B1ED;
- color: #000;
-}
-table.attrlist tbody tr td {
- border-bottom: dashed 1px #000;
-}
-table.attrlist tbody tr td.ColumnType {
- width: 15%;
-}
-table.attrlist tbody tr td.ColumnValue {
- width: 15%;
-}
-table.attrlist tbody tr td.ColumnNotes {
- width: 40%;
-}
-table.attrlist tbody tr td.ColumnSources {
- width: 10%;
-}
-
-/* Sources
------------------------------------------------------ */
-#Sources table.infolist tbody tr td.ColumnRowLabel {
- padding-bottom:0;
-}
-#Sources table.infolist tbody tr td.ColumnName {
- padding:0;
-}
-#Sources table.infolist tbody tr td.ColumnName a {
- padding:.1em 10px .3em 10px;
-}
-#SourceDetail div#references ol li {
- padding-bottom:.5em;
-}
-
-/* Relationships
-================================================= */
-table.relationships thead tr th.ColumnMarriage,
-table.relationships thead tr th.ColumnDivorce {
- width: 13%;
-}
-table.relationships thead tr th.ColumnHyper {
- width: 15%;
-}
-table.relationships thead tr th.ColumnMedia {
- width: 15%;
-}
-table.relationships tbody tr td.ColumnRowLabel a {
- background: none;
-}
-table.relationships tbody tr td.ColumnPartner {
- font-size: 100%;
+table.IndividualList td.ColumnSurname {
+ background-color: #FFE09F;
}
/* Places
----------------------------------------------------- */
-#Places table.infolist tbody tr td.ColumnName {
- padding:0;
+#Places table.infolist td.ColumnName {
+ background-color: #FFE09F;
}
-#Places table.infolist tbody tr td.ColumnName a {
- padding:.1em 10px .3em 10px;
+#Places table.infolist td.ColumnName a[href]:hover {
+ background-color: #FFC35E;
+}
+/* make the whole cell light up on hover not just the a. */
+#Places table.infolist td.ColumnName {
+ padding-left: 0px;
+}
+#Places table.infolist td.ColumnName > a {
+ padding-left: 1ex;
}
/* Events
----------------------------------------------------- */
#EventList table.infolist tr.BeginType td {
- border-top: dashed 1px #FFC35E;
+ border-top:dashed 1px #FFC35E;
}
#EventList table.infolist tr.BeginLetter td {
- border-top: solid 1px #FFC35E;
+ border-top:solid 1px #FFC35E;
}
-#EventList table.infolist tr td a,
-#EventDetail table.infolist tr td a {
+#EventList table.infolist td.ColumnType {
+ background-color: #FFE09F;
+}
+#EventList td.ColumnPerson a {
display: inline;
}
-#EventList table.infolist tr td span.father,
-#EventList table.infolist tr td span.mother,
-#EventDetail table.infolist tr td span.father,
-#EventDetail table.infolist tr td span.mother {
- display: block;
-}
-#EventList table.infolist tr td span.person:after,
-#EventList table.infolist tr td span.father:after,
-#EventList table.infolist tr td span.mother:after,
-#EventDetail table.infolist tr td span.person:after,
-#EventDetail table.infolist tr td span.father:after,
-#EventDetail table.infolist tr td span.mother:after {
+#EventList td.ColumnPerson span.person:after,
+#EventList td.ColumnPerson span.father:after,
+#EventList td.ColumnPerson span.mother:after,
+#EventDetail td.ColumnPerson span.person:after,
+#EventDetail td.ColumnPerson span.father:after,
+#EventDetail td.ColumnPerson span.mother:after {
content: ", ";
}
-#EventList table.infolist tr td span.person:last-child:after,
-#EventList table.infolist tr td span.father:last-child:after,
-#EventList table.infolist tr td span.mother:last-child:after,
-#EventDetail table.infolist tr td span.person:last-child:after,
-#EventDetail table.infolist tr td span.father:last-child:after,
-#EventDetail table.infolist tr td span.mother:last-child:after {
+#EventList td.ColumnPerson span.fatherNmother:after,
+#EventDetail td.ColumnPerson span.fatherNmother:after {
+ content: " + ";
+}
+#EventList td.ColumnPerson span.person:last-child:after,
+#EventList td.ColumnPerson span.father:last-child:after,
+#EventList td.ColumnPerson span.mother:last-child:after,
+#EventDetail td.ColumnPerson span.person:last-child:after,
+#EventDetail td.ColumnPerson span.father:last-child:after,
+#EventDetail td.ColumnPerson span.mother:last-child:after {
content: "";
}
/* Gallery
----------------------------------------------------- */
-#Gallery table.infolist tbody tr td.ColumnRowLabel, #Gallery table.infolist tbody tr td.ColumnDate {
- padding-bottom:0;
-}
-#Gallery table.infolist tbody tr td.ColumnName {
- padding:0;
-}
-#Gallery table.infolist tbody tr td.ColumnName a {
- padding:.1em 10px .3em 10px;
-}
-#Gallery table.infolist tbody tr td.ColumnName a:hover {
- background-color:#FFE09F;
-}
#GalleryNav {
- font-size:.8em;
- margin:1em 0 0 0;
- padding:1.2em 0 0 0;
- text-align:center;
+ text-align: center;
+ margin: 2em 0px;
}
#GalleryNav a {
- font-weight:bold;
- text-decoration:none;
- background-color:#FFE09F;
- border:solid 1px #8C581C;
+ font-weight: bold;
+ background-color: #FFE09F;
+ border: solid 1px #EA8414;
+ margin: 1em;
}
#GalleryNav a:hover {
- background-color:#FFC35E;
+ background-color: #FFC35E;
}
#GalleryNav a#Previous {
- padding:.4em .7em .3em .7em;
+ padding: .4em .7em .3em .7em;
}
#GalleryNav a#Next {
- padding:.4em 1.9em .3em 1.9em;
-}
-#GalleryPages {
- margin:0 1em;
+ padding: .4em 1.9em .3em 1.9em;
}
#GalleryCurrent {
- font-size:1.2em;
- font-weight:bold;
+ font-size: larger;
}
#GalleryTotal {
- font-weight:normal;
+ font-weight: normal;
}
#GalleryDisplay {
- margin:0 auto;
- padding:0;
- position:relative;
- overflow:hidden;
- text-align:center;
- border:solid 1px #8C581C;
+ margin: 0px auto;
+ position: relative;
}
#GalleryDisplay img {
- margin:0 auto;
+ margin: 0px auto;
+ display: block;
+ border: solid 1px #EA8414;
}
-#GalleryDetail div#summaryarea{
- margin:0;
- padding:1.4em 0 0 0;
-}
-#GalleryDetail div#summaryarea h3 {
- text-align:center;
-}
-#GalleryDetail div h4 {
- margin-top:0;
-}
-#GalleryDetail div#summaryarea table.gallery {
- width:100%;
- margin-top:1.5em;
- margin-bottom:0;
- padding-bottom:0;
- background-color:#FFE09F;
- border-style:solid;
- border-width:8px 0 0 0;
- border-color:#FFC35E;
-}
-
-/* Thumbnail Preview Reference Section
-------------------------------------------------- */
-body#ThumbnailPreview div#references {
- background-color: #FFF;
- color: #00029D;
- margin: 0 auto;
- padding: 0;
- width: 100%;
-}
-body#ThumbnailPreview div#references table.infolist tbody tr {
- border-bottom: dashed 1px #000;
-}
-body#ThumbnailPreview div#references table.infolist tbody tr td.ColumnRowLabel a {
- background: none;
- width: 2%;
-}
-body#ThumbnailPreview div#references table.infolist tbody tr td.ColumnName {
- width: 90%;
+#GalleryDetail h3 {
+ text-align: center;
}
/* Contact
----------------------------------------------------- */
+#Contact {
+ overflow: hidden;
+}
#Contact #summaryarea {
- width:500px;
- margin:2em auto;
- padding:3em;
- background-color:#FFE09F;
- border:solid 1px #8C581C;
+ width: 40em;
+ margin: 2em auto;
+ padding: 3em;
+ background-color: #FFE09F;
+ border: solid 1px #EA8414;
}
-#Contact #summaryarea img {
- float:right;
- margin:0;
- padding:0;
- border:solid 1px #8C581C;
+#Contact img {
+ float: right;
+ border: solid 1px #EA8414;
}
-#researcher {
- margin-top:.3em;
+#Contact #researcher, #Contact #researcher h3 {
+ font-size: larger;
+ padding-left: 0px;
}
-#researcher h3 {
- padding:0;
-}
-#researcher span {
- display:block;
- float:left;
- margin-right:.4em;
-}
-#streetaddress {
- width:85%;
-}
-#locality, .locality {
+#Contact #streetaddress, #Contact #locality, #Contact #email {
display: block;
- width: 100%;
}
-#city:after {
- content:",";
+#Contact #locality, #Contact #city, #Contact #state, #Contact #postalcode,
+#Contact #country {
+ white-space: nowrap;
}
-#country {
- clear:left;
-}
-#email {
- clear:left;
-}
-#email a {
- text-decoration:none;
-}
-#email a:hover {
- text-decoration:underline;
+#Contact #city:after {
+ content: ",";
}
-/* Download
+/* Download
----------------------------------------------------- */
-#Download {
- padding:1cm;
- height:396px;
-}
-table.download {
- border:solid 2px #000;
- width:100%;
-}
-table.download img {
- float:center;
-}
-table.download thead tr th {
- text-align:center;
- border:solid 2px #000;
- color: #000;
- text-transform:uppercase;
-}
-table.download tbody tr#Row02 {
- border-bottom:solid 2px #000;
-}
-table.download thead tr th, table.download tbody tr td {
- padding-left:10px;
- padding-top:20px;
- border-style:solid;
- border-color:#000;
- border-width:0 2px 2px 2px;
- text-align:left;
-}
-table.download td.Description {
- width: 50%;
-}
-table.download td.License {
- width:8%;
-}
-table.download td.Filename {
- width:30%;
-}
-table.download td.Filename a {
- font-weight:bold;
- font-style: italic;
- text-decoration:none;
-}
-table.download td.Filename a:hover {
- text-decoration:underline;
-}
-table.download td.Modified {
- width:12%;
- font-weight:bold;
+#Download table.download a {
+ display: block;
}
-/* Subsections
+/* Subsection
----------------------------------------------------- */
-#Home, #Introduction, #Contact {
- padding:1.5em 0 3em 0;
+#Home, #Introduction {
+ overflow: hidden;
}
-#Home p, #Introduction p, #Contact p {
- margin:0 20px 1em 20px;
+#Home img, #Introduction img {
+ float: right;
+ margin: 1em;
+ max-width: 950px;
}
-#Home img, #Introduction img, #Contact img {
- float:right;
- margin:0;
- padding:0 20px 3em 20px;
+#Home p, #Introduction p {
+ padding-left: 15px;
}
-#Home a, #Introduction a, #Contact a {
- color: #000;
- text-decoration: none;
+.subsection {
+ clear: both;
+ overflow: hidden;
}
-div.subsection{
- padding-bottom:.5em;
- background-color:#FFFBE7;
-}
-div.subsection h4 {
- margin-bottom:.5em;
-}
-div.subsection table, div.subsection ol, div.subsection p, div.subsection > a {
- font-size:.9em;
-}
-div.subsection a {
- text-decoration:none;
-}
-div.subsection a:hover {
- text-decoration:underline;
- background:none;
-}
-div.subsection table.infolist {
- width:100%;
- margin:0;
-}
-#IndividualDetail div.subsection table tr td:first-child {
- padding-left:20px;
+.subsection p {
+ margin: 0px;
}
-/* Subsections : Summary Area
+/* Subsection : Families
----------------------------------------------------- */
-div#summaryarea {
- min-height:100px;
- background:none;
-}
-div#summaryarea table.infolist {
- margin:0;
- padding:0;
- background:#FFFBE7;
- border-bottom:solid .7em #FFFBE7;
-}
-div#summaryarea table.infolist tr td, div#summaryarea table.infolist tr td p {
- vertical-align:top;
-}
-div#summaryarea table.infolist tr td a, div#summaryarea table.infolist tr td p a {
- display:inline;
-}
-div#summaryarea table.infolist tbody tr td.ColumnAttribute {
- width:14%;
- padding-left:20px;
-}
-
-/* Subsections : Events
------------------------------------------------------ */
-div#events {
- padding-bottom:0;
-}
-div#events h4 {
- margin-bottom:0;
-}
-div#events table.infolist {
- border-bottom:solid 1px #FFFBE7;
-}
-div#events table.infolist tbody tr td {
- padding-top:.2em;
- padding-bottom:.2em;
-}
-#IndividualDetail div#events table.infolist thead tr th:first-child {
- padding-left:20px;
-}
-div#events table.infolist tbody tr td.ColumnAttribute {
- border-bottom:dashed 1px #FFC35E;
-}
-div#events table.infolist tbody tr td.ColumnValue {
- border-bottom:dashed 1px #FFC35E;
-}
-div#events table.infolist tbody tr td.ColumnValue p {
- margin:.1em 2em;
-}
-
-/* Subsections : Parents
------------------------------------------------------ */
-div#parents table.infolist tbody tr td.ColumnValue ol {
- margin:0;
- padding-top:0;
-}
-div#parents table.infolist tbody tr td.ColumnValue ol li {
- padding-bottom:.2em;
-}
-
-/* Subsections : Families
------------------------------------------------------ */
-div#families table.infolist tbody tr td.ColumnValue p {
- margin-top:0;
-}
-div#families table.infolist tbody tr td.ColumnValue ol {
- margin:0;
- padding-top:0;
-}
-div#families table.infolist tbody tr td.ColumnValue ol li {
- padding-bottom:.2em;
-}
div#families table.fixed_subtables table.eventlist {
- table-layout:fixed;
+ table-layout: fixed;
}
div#families table.fixed_subtables table.eventlist th:first-child {
- width:9em;
+ width: 9em;
}
div#families table.fixed_subtables table.eventlist th:last-child {
- width:5em;
+ width: 5em;
+}
+div#families table.attrlist td.ColumnType {
+ color: #36220B;
}
-/* Subsections : Addresses
+/* Subsection : Gallery
----------------------------------------------------- */
-div#addresses {
- padding-bottom:0;
-}
-div#addresses h4 {
- margin-bottom:0;
-}
-div#addresses table.infolist {
- border-bottom:solid 1px #FFFBE7;
-}
-div#addresses table.infolist tbody tr td {
- padding-top:.2em;
- padding-bottom:.2em;
-}
-div#addresses table.infolist tbody tr td.ColumnAttribute {
- width:30%;
- border-bottom:dashed 1px #FFC35E;
-}
-div#addresses table.infolist tbody tr td.ColumnValue {
- border-bottom:dashed 1px #FFC35E;
-}
-div#Addresses table.infolist tr td a, div#Addresses table.infolist tr td p a {
- display: inline;
-}
-
-/* Subsections : Attributes
------------------------------------------------------ */
-
-/* Subsections : Gallery
------------------------------------------------------ */
-#indivgallery h4 {
- margin-bottom:1em;
-}
#indivgallery .thumbnail {
- margin:0;
- float:left;
- width:130px;
- height:150px;
- text-align:center;
+ float: left;
+ max-width: 130px;
+ max-height: 150px;
+ font-size: smaller;
+ text-align: center;
+ margin: 0.8em 0.5em;
}
-#indivgallery .thumbnail a {
- display:block;
- margin:0;
- padding:0;
- background:none;
+#indivgallery h4 + .thumbnail {
+ margin-left: 15px;
+ /* Problem: if there are more thumnails then fit on a single row, the
+ * first thumnail on each next row should also have a margin-left
+ * of 15 px. */
}
-#indivgallery .thumbnail a img {
- margin:0;
- padding:0;
- border:solid 1px #8C581C;
+#indivgallery img {
+ border: solid 1px #8C581C;
}
-#indivgallery div.thumbnail span {
-/* ## remove this line and the comment markers from the line below to hide the description in Individual Gallery
+#indivgallery span {
+/* ## remove this line and the comment markers from the line below to hide description in Indivifual Gallery
display: none; */
-
- font-size:.6em;
- text-align:center;
- width:80%;
- margin:0 auto;
- padding:0;
}
-/* Subsections : Narrative
+/* Subsection : Narrative
----------------------------------------------------- */
-div.narrative {
- padding-bottom:0;
+h4 + div.grampsstylednote, a.familymap {
+ margin: 1em 15px;
}
-.narrative p {
- margin-top:.5em;
- margin-bottom:0;
- padding:0 20px 1em 20px;
+i + div.grampsstylednote p {
+ margin: 0px;
}
-/* Subsections : References
+/* Subsection : Family Map
----------------------------------------------------- */
-#references ol {
- margin-top:0;
- margin-bottom:0;
+a.familymap {
+ display: block;
}
-/* Subsections : Source References
+/* Subsection : Source References
----------------------------------------------------- */
-div#sourcerefs ol {
- list-style-type:decimal;
-}
-div#sourcerefs ol li ol {
- list-style-type:lower-alpha;
+#sourcerefs ol li ol {
+ list-style-type: lower-alpha;
}
-/* Subsections : Weblinks
------------------------------------------------------ */
-
-/* Subsections : Pedigree
+/* Subsection : Pedigree
----------------------------------------------------- */
.pedigreegen {
- font-size:.9em;
- list-style:none;
- margin:.5em 0 0 0;
- padding:0 0 .7em 20px;
+ list-style-type: none;
+ padding-left: 15px;
}
.pedigreegen li ol {
- list-style:none;
- margin-left:.5em;
-}
-.pedigreegen li ol li {
- padding-bottom:.2em;
+ list-style-type: none;
}
.pedigreegen li ol li ol {
- list-style:decimal;
- margin-left:1.6em;
+ list-style-type: decimal;
}
-.pedigreegen li ol li ol li ol.spouselist {
- font-size:1em;
- list-style:none;
- margin-left:0;
+.pedigreegen ol.spouselist {
+ list-style-type: none;
}
-.spouselist li.spouse ol {
- font-size:1em;
- list-style:decimal;
- margin-left:1.6em;
-}
-.spouse a {
- font-weight:normal;
+.pedigreegen ol.spouselist li.spouse ol {
+ list-style-type: decimal;
}
.spouse:before {
content: "+ ";
}
.thisperson {
- font-weight:bold;
+ font-weight: bold;
+}
+.thisperson > ol {
+ font-weight: normal;
}
/* Footer
----------------------------------------------------- */
#footer {
- clear:both;
- width:100%;
- font-size:12px;
- line-height:130%;
- color:#8C581C;
- margin:0;
- padding:15px 0 0 0;
- background-color:#FFC35E;
- border-top:solid 1px #EA8414;
+ clear: both;
+ padding-top: 1em;
+ background-color: #FFC35E;
+ border-top: solid 1px #EA8414;
}
-#footer a, #footer a:visited {
- text-decoration:none;
- color:#8C581C;
-}
-#footer a:hover {
- text-decoration:underline;
-}
-#footer img {
- border:0;
- margin:0 auto;
- vertical-align:middle;
+#footer > * {
+ background-color: #FFE09F;
}
#footer p#createdate {
- float:left;
- width:40%;
- text-align:left;
- margin-left:10px;
+ float: left;
+ width: 50%;
+ text-align: left;
+ padding-left: 15px;
+ margin-top: 1em;
}
#footer p#copyright {
- float:right;
- width:40%;
- text-align:right;
- margin-right:10px;
+ float: right;
+ width: 40%;
+ text-align: right;
+ padding-right: 15px;
}
-#footer p#copyright img {
- margin-right:10px;
+#footer a[href]:hover {
+ background-color: #FFC35E;
}
-#user_footer {
- width:70%;
- float:left;
- margin:1em;
+
+/* Overwritten
+----------------------------------------------------- */
+button#drop {
+ background-color: #FFE09F;
+ border: solid 1px #EA8414 ! important;
}
-#user_footer p {
- font:normal 1em/1.2em serif;
- margin:0;
- padding:0;
+button#drop:hover {
+ background-color: #FFC35E;
+}
+div#map_canvas {
+ border-color: #EA8414 ! important;
+}
+body#FamilyMap {
+ background-color: #FFE09F ! important;
}
/* Calendar Styles
--------------------------------------------------------------------------------------------- */
-/* Calendar : General */
-body#WebCal {
- padding:0 14px;
- background-color:#8C581C;
+===================================================== */
+table.calendar {
+ table-layout: fixed;
+ empty-cells: show;
}
-.calendar {
- empty-cells:show;
- width:100%;
- font-size:1em;
- font-weight:normal;
- margin:0;
- padding:0;
- border:none;
- border-collapse:collapse;
+.calendar thead th {
+ text-align: center;
+ border-top-style: none;
}
-.calendar thead tr th {
- width:14%;
- font-weight:bold;
- font-size:14px;
- line-height:14px;
- text-align:center;
- text-transform:uppercase;
- padding:2px 0;
+.calendar thead th.monthName {
+ font-size: xx-large;
+ font-weight: normal;
+ background-color: #FFFBE7;
+ border-bottom-style: none;
+ padding-top: 1em;
}
-.calendar thead tr th.monthName {
- width:100%;
- font-weight:normal;
- font-size:2em;
- line-height:100%;
- text-transform:none;
- color:#36220B;
- padding:.3em 0 .2em 0;
- background-color:#FFF;
- border-bottom-width:0;
+.calendar thead th abbr {
+ border-bottom-style: none;
}
-body#WebCal #CreatorInfo {
- float:right;
- font-size:12px;
- margin:-24px 10px 0 0;
+#CreatorInfo {
+ float: right;
+ margin: -1em 15px 0px 0px;
+ font-weight: bold;
+ color: #8C581C;
}
-.calendar thead tr th.weekend,
-.calendar thead tr th.weekday {
- color:#EA8414;
- background-color:#FFE09F;
- border-style:solid;
- border-width:0 0 1px 0;
- border-color:#8C581C;
-}
-.calendar thead tr th.saturday,
-.calendar thead tr th.sunday { }
-.calendar tfoot tr td {
- padding:.7em 5% 1em 5%;
- border-top:solid 4px #8C581C;
+#CreatorInfo a[href]:hover {
+ background-color: #FFC35E;
}
.calendar tfoot tr td {
- vertical-align:middle;
- color:#8C581C;
- background-color:#FFFBE7;
+ border-top: solid 4px #8C581C;
+ vertical-align: middle;
}
/* Calendar : Date Numeral */
-.calendar tbody tr td div.date {
- float:right;
- display:block;
- width:1.8em;
- font-weight:bold;
- font-size:1em;
- line-height:100%;
- text-align:center;
- color:#8C581C;
- margin:0 0 0 .5em;
- padding:.2em 0;
- background-color:#FFE09F;
+.calendar div.date {
+ float: right;
+ width: 1.8em;
+ font-size: large;
+ text-align: center;
+ background-color: #FFC35E;
+ color: #8C581C;
}
/* Calendar : Date Container */
-.calendar tbody tr td {
- vertical-align:top;
- height:10em;
- padding:0;
- border-width:1px 0 0 1px;
- border-style:solid;
- border-color:#FFE09F;
+.calendar td {
+ padding: 0px 0px 0px 1ex;
+ border-width: 1px 0px 0px 1px;
+ border-style: solid;
+ border-color: #FFC35E;
+ background-color: #FFFBE7;
}
-.calendar tbody tr td.weekday {
- background-color:#FFF;
-}
-.calendar tbody tr td.weekend {
- background-color:#FFFBE7;
-}
-.calendar tbody tr td.saturday {
-
- }
-.calendar tbody tr td:first-child {
- border-left:none;
+.calendar td:first-child {
+ border-left-style: none;
+ padding: 0px 0px 0px 1ex;
}
.calendar tbody tr:first-child td {
- border-top:none;
+ border-top-style: none;
}
/* Calendar : Date Detail */
-.calendar tbody tr td ul {
- list-style:none;
- font-family:sans-serif;
- font-size:.8em;
- margin:2.3em 0 .3em 0;
- padding:0;
+.calendar td ul {
+ font-size: smaller;
+ list-style: none;
+ padding: 0px;
}
-.calendar tbody tr td ul li {
- display:block;
- width:92%;
- margin:0 4%;
- padding:.2em 0 .3em 0;
- border-top:dashed 1px #C1B398;
+.calendar td ul li {
+ border-top: dashed 1px #8C581C;
+ padding-top: 0.5em;
+ padding-bottom: 0.5em;
}
-.calendar tbody tr td ul li:first-child {
- border:none;
+.calendar td ul li:first-child {
+ border-style: none;
+}
+.calendar td ul a[href]:hover {
+ background-color: #FFC35E;
}
/* Calendar : Birthday, Anniversary, Highlight */
-.calendar tbody tr td ul li em {
- font-style:normal;
- color:#0A65B5;
+.calendar td ul li em {
+ font-style: normal;
+ color: #EA8414;
}
-.calendar tbody tr td ul li span.yearsmarried em {
- color:#453619;
+.calendar td.highlight {
+ background-color: #FFE09F;
}
-.calendar tbody tr td.highlight {
- background-color:#E5F2FE;
-}
-.calendar tbody tr td.highlight div.date {
- color:#0A65B5;
- background-color:#C2E1FE;
+.calendar td.highlight div.date {
+ color: #36220B;
+ background-color: #FFC35E;
}
/* Calendar : Previous-Next Month */
-.calendar tbody tr td.previous,
-.calendar tbody tr td.next,
-.calendar tbody tr td.previous div.date,
-.calendar tbody tr td.next div.date {
- color:#FFE09F;
- background-color:#FFFBE7;
+.calendar td.previous,
+.calendar td.next,
+.calendar td.previous div.date,
+.calendar td.next div.date {
+ color: #FFC35E;
+ background-color: #FFFBE7;
}
/* Calendar : Full Year */
body#fullyearlinked div.content {
- width:963px;
- margin:0 auto;
- padding:15px 0 2px 2px;
+ overflow: hidden;
}
body#fullyearlinked table.calendar {
- float:left;
- width:320px;
- height:18em;
- border:solid 1px #7D5925;
+ float: left;
+ width: 33.3%;
+ height: 18em;
+ border: solid 1px #36220B;
}
-body#fullyearlinked table.calendar thead tr th {
- height:2em;
+body#fullyearlinked table.calendar thead th {
+ height: 2em;
}
-body#fullyearlinked table.calendar thead tr th.monthName {
- font-size:1.2em;
- padding:2px 0;
+body#fullyearlinked table.calendar thead th.monthName {
+ font-size: large;
+ padding: 2px 0px;
}
-body#fullyearlinked table.calendar tbody tr td {
- height:3em;
+body#fullyearlinked table.calendar tbody td {
+ height: 3em;
+}
+body#OneDay div.content {
+ overflow: hidden;
}
diff --git a/src/plugins/webstuff/css/Web_Basic-Spruce.css b/src/plugins/webstuff/css/Web_Basic-Spruce.css
index e24998a50..f3b73ecb7 100644
--- a/src/plugins/webstuff/css/Web_Basic-Spruce.css
+++ b/src/plugins/webstuff/css/Web_Basic-Spruce.css
@@ -6,11 +6,11 @@ GRAMPS Cascading Style Sheet
Style Name: Basic-Spruce Stylesheet
Style Author: Jason M. Simanek (2008)
Note: Adapted from GRAMPS original Modern Style stylesheet with a new blue color scheme.
-
**************************************************************************************************
This website was created with GRAMPS
--------------------------------------------------------------------------------------------------
GRAMPS is a Free Software Project for Genealogy, offering a professional
+
genealogy program, and a wiki open to all. It is a community project, created,
developed and governed by genealogists.
@@ -20,6 +20,7 @@ Go to to learn more!
Copyright 2008 Jason M. Simanek
Copyright 2009 Stephane Charette
Copyright (C) 2008-2011 Rob G. Healey
+Copyright 2011 Michiel D. Nauta
This file is part of the GRAMPS program.
@@ -37,6 +38,7 @@ GRAMPS. If not, see .
Color Palette
--------------------------------------------------------------------------------------------------
+
black #000
blue dark #204D91
blue #7CA3DD
@@ -44,1209 +46,661 @@ blue light #BFD0EA
blue very light #EAEEF4
white #FFF
--------------------------------------------------------------------------------------------------
-
+Characteristic of this style is that it uses the full width of the browser
+window and that horizontal highlighting bars extend over the full width of
+the page.
+--------------------------------------------------------------------------------------------------
# $Id$
NarrativeWeb Styles
---------------------------------------------------------------------------------------------
+------------------------------------------------------------------------------------------------
General Elements
----------------------------------------------------- */
body {
- font-family:sans-serif;
- color:#000;
- margin:0;
- padding:0;
- background-color:#FFF;
+ font-family: sans-serif;
+ font-size: 90%;
+ color: black;
+ margin: 0px;
+ background-color: #EAEEF4;
}
-div {
- margin:0;
- padding:0;
-}
-img {
- border:none;
- margin:0;
-}
-.thumbnail a:hover {
- background:none;
+body > div {
+ clear: both;
}
.content {
- padding-top: 1cm;
- background-color:#FFF;
+ background-color: #FFF;
+ border-top: solid 1px #7CA3DD;
}
.content div.snapshot {
- float:right;
- margin:20px;
- padding:0;
- background:none;
-}
-.content div.snapshot div.thumbnail {
- margin:0;
- padding:0;
- background:none;
+ float: right;
+ margin: 2em;
}
.fullclear {
- width:100%;
- height:1px;
- margin:0;
- padding:0;
- clear:both;
+ clear: both;
}
/* General Text
----------------------------------------------------- */
h1 {
- font-size:1.4em;
- font-weight:bold;
- margin:0;
-}
-h2 {
- display:none;
+ font-size: x-large;
+ font-weight: bold;
+ padding-left: 15px;
}
h3 {
- font-size:1.2em;
- font-weight:bold;
- margin-left:12px;
- text-align:left;
- margin:0;
- padding:.5em 20px .2em 20px;
+ font-size: large;
+ padding-left: 15px;
}
h4 {
- font-size:.8em;
- color:#204D91;
- margin:0;
- padding:.2em 0 .2em 20px;
- background-color:#EAEEF4;
- border-bottom:solid 1px #7CA3DD;
-}
-h5, h6 {
- font-style:italic;
- margin:1.3em 0 .5em 1em;
-}
-p {
- font-size:14px;
- line-height:17px;
- margin:0;
+ font-size: medium;
+ color: #204D91;
+ background-color: #BFD0EA;
+ padding-left: 15px;
+ margin-bottom: 0px;
+ border-bottom: solid 1px #7CA3DD;
}
p#description {
- padding:0 15px 1em 15px;
+ padding-left: 15px;
}
-p a:link {
- text-decoration:underline;
+a {
+ color: black;
+ text-decoration: none;
}
-sup {
- line-height:0;
-}
-ol {
-}
-ol li a {
- text-decoration:none;
-}
-a:link {
- color:#000;
- text-decoration:underline;
-}
-a:hover, a:active {
- background-color:#EAEEF4;
- color:#000;
- text-decoration:underline;
-}
-a:visited {
- color:#000;
- text-decoration:underline;
+a[href]:hover, a[href]:active {
+ background-color: #EAEEF4
}
.grampsid {
- font:normal .8em/1.2em monospace;
- color:#7CA3DD;
+ font-family: monospace;
+ font-size: smaller;
+ color: #7CA3DD;
}
/* Header
----------------------------------------------------- */
-#header {
- padding:15px 15px 2px 15px;
- margin:0;
- background-color:#EAEEF4;
-}
#SiteTitle {
- color:#204D91;
- margin:0 0 3px 0;
+ color: #204D91;
}
-#header p {
- font-size:1em;
- font-weight:bold;
- color:#7CA3DD;
- margin:0;
+#user_header, #user_footer {
+ padding-left: 15px;
}
/* Navigation
----------------------------------------------------- */
#navigation, #subnavigation {
- margin:0;
- padding:4px 0 0 0;
- background-color:#EAEEF4;
+ border: solid 1px #EAEEF4; /* needed by IE7 */
+}
+#subnavigation ul {
+ overflow: hidden;
}
#navigation ul, #subnavigation ul {
- list-style:none;
- min-width:770px;
- height:22px;
- margin:0;
- padding:0 0 0 12px;
- border-bottom:1px solid #7CA3DD;
+ list-style: none;
+ margin: 0px;
+ padding-left: 15px;
+}
+#subnavigation ul {
+ border-bottom: solid 1px #7CA3DD;
}
#navigation ul li, #subnavigation ul li {
- margin:0;
- padding:0;
- float:left;
+ float: left;
}
#navigation ul li a, #subnavigation ul li a {
- display:block;
- font-size:12px;
- line-height:100%;
- font-weight:bold;
- text-decoration:none;
- margin:0;
- padding:5px 5px;
- background-color:#EAEEF4;
+ display: block;
+ font-size: smaller;
+ font-weight: bold;
+ padding: 5px;
+ border-bottom: solid 1px #EAEEF4;
}
#navigation ul li a:hover, #subnavigation ul li a:hover {
- background-color:#BFD0EA;
- border-bottom:solid 1px #000;
+ text-decoration: none;
+ background-color: #BFD0EA;
+ border-bottom: solid 1px black;
}
-#navigation ul li.CurrentSection a, #subnavigation ul li.CurrentSection a {
- padding-bottom:4px;
- border-top:solid 1px #7CA3DD;
- border-right:solid 1px #7CA3DD;
- border-left:solid 1px #7CA3DD;
- border-bottom:solid 1px #FFF;
- background-color:#FFF;
-}
-#navigation ul li.CurrentSection a:hover {
- background-color:#FFF;
+#navigation ul li.CurrentSection a {
+ position: relative;
+ top: 1px;
+ border: solid 1px #7CA3DD;
+ border-bottom-style: none;
+ background-color: #FFF;
}
#subnavigation ul li.CurrentSection a {
- border-width:0 0 1px 0;
+ background-color: #FFF;
}
/* Alphabet Navigation
----------------------------------------------------- */
-div#alphabet {
- width: 100%;
- margin: 0;
- background-color: #EAFFF4;
+#alphabet {
+ background-color: #EAEEF4;
}
-div#alphabet ul {
- list-style:none;
- min-width:770px;
- height:24px;
- margin:0;
- padding: 0px 0px 0px 16px;
+#alphabet ul {
+ list-style: none;
border-width: 2px 0px 4px 0px;
border-style: solid;
- border-color: #000;
+ border-color: black;
+ margin: 0px;
+ padding-left: 15px;
+ /* float container stretch, see www.quirksmode.org/css/clearing.html */
+ overflow: hidden;
}
-div#alphabet ul li:after {
- content:" |";
+#alphabet ul li {
+ float: left;
+ font-size: larger;
+ font-weight: bold;
}
-div#alphabet ul li {
- margin:0;
- float:left;
+#alphabet ul li:after {
+ content: " |";
}
-div#alphabet ul li a {
- display:block;
- padding: 4px 8px 4px 8px;
- float:left;
- font:bold 16px/100% sans;
- margin:0;
- text-decoration:none;
- color: #000;
+#alphabet ul li a {
+ display: block;
+ padding: 4px 8px;
+ line-height: 100%;
+ float: left;
}
-div#alphabet ul li a:hover {
- background-color: #000;
+#alphabet ul li a:hover {
+ text-decoration: none;
+ background-color: black;
color: #FFF;
}
/* Main Table
----------------------------------------------------- */
table {
- font-size:14px;
- margin:0 15px;
- padding:0;
- border:none;
- border-collapse:collapse;
+ border-collapse: collapse;
+ width: 100%;
+}
+div#summaryarea > table.infolist,
+div#parents > table.infolist,
+h3 + table.infolist {
+ width: auto;
}
table tr th {
- font-weight: bold;
text-align: left;
- margin:0;
- padding:.1em 10px;
- background-color:#BFD0EA;
- border-top:solid 1px #7CA3DD;
- border-bottom:solid 1px #7CA3DD;
+ background-color: #EAEEF4;
+ border-top: solid 1px #7CA3DD;
+ border-bottom: solid 1px #7CA3DD;
}
-table.infolist tr th:first-child {
- border-left:solid 1px #7CA3DD;
+table tr th:first-child {
+ border-left: solid 1px #7CA3DD;
}
-table.infolist tr th:last-child {
- border-right:solid 1px #7CA3DD;
+table tr th:last-child {
+ border-right: solid 1px #7CA3DD;
}
-table.infolist tr th a {
- text-decoration:none;
+table.primobjlist tr th {
+ background-color: #BFD0EA;
}
-table tr td {
- vertical-align:middle;
- padding:.1em 10px;
+table td, table th {
+ vertical-align: top;
+ padding-left: 1ex;
}
-table.infolist tr td a {
- display:block;
- text-decoration:none;
+table.primobjlist td {
+ vertical-align: middle;
}
-table.infolist tr.BeginLetter td, table.infolist tr.BeginSurname td {
- border-top:solid 1px #BFD0EA;
+table td:first-child, table th:first-child {
+ padding-left: 15px;
}
-table.infolist tr th.ColumnQuantity {
- width:30%;
+table.primobjlist tr a {
+ display: block; /* make whole td clickable */
}
-table.infolist tr td.ColumnLetter {
- font-weight:bold;
+table.primobjlist tr.BeginLetter td, table.primobjlist tr.BeginSurname td {
+ border-top: solid 1px #BFD0EA;
}
-table.infolist tbody tr td.ColumnBirth {
- font-size:.9em;
- width:10%;
+td.ColumnLetter, td.ColumnRowLabel {
+ font-weight: bold;
}
-table.infolist tbody tr td.ColumnDeath {
- font-size:.9em;
- width:10%;
+td.ColumnBirth, td.ColumnDeath, td.ColumnPartner, td.ColumnParents {
+ font-size: 90%;
}
-table.infolist tbody tr td.ColumnRowLabel {
- font-weight:bold;
- width:2%;
+table.infolist tr td ol {
+ margin: 0px;
}
-table.infolist tbody tr td.ColumnType {
- width:6%;
- padding-left:20px;
+#summaryarea table.infolist td.ColumnAttribute,
+#parents table.infolist td.ColumnAttribute,
+#families table.infolist td.ColumnType,
+#families table.infolist td.ColumnAttribute {
+ color: #204D91;
}
-table.infolist tbody tr td.ColumnPartner {
- font-size:.9em;
+/* div summaryarea is missing for events, sources and repos! */
+h3 + table.infolist td.ColumnAttribute {
+ color: #204D91;
}
-table.infolist tbody tr td.ColumnParents {
- font-size:.9em;
-}
-table.infolist tbody tr td.ColumnParents span.father, table.infolist tbody tr td.ColumnParents span.mother {
- display:block;
-}
-table.infolist tbody tr td.ColumnParents span.mother:before {
- content:"+ ";
-}
-table.infolist tbody p.EventNote {
- border-top:dashed 1px #BFD0EA;
- padding-top:1em;
- padding-bottom:1em;
+table.primobjlist td.ColumnParents span.mother:before {
+ content: "+ ";
}
/* Surnames
----------------------------------------------------- */
-#Surnames { }
-#SurnameDetail p#description { padding-top:0; }
-table.surnamelist tbody tr td.ColumnSurname {
- width:50%;
+table#SortByName td.ColumnSurname, table#SortByName th.ColumnSurname,
+table#SortByCount td.ColumnQuantity, table#SortByCount th.ColumnQuantity {
+ background-color: #EAEEF4;
}
-table.surnamelist thead tr th.ColumnSurname {
- padding:0;
+table#SortByName td.ColumnSurname a[href]:hover {
+ background-color: #BFD0EA;
}
-table.surnamelist thead tr th.ColumnQuantity {
- width:40%;
- padding:0;
+/* make the whole cell light up on hover not just the a. */
+table#SortByName td.ColumnSurname,
+table#SortByName th.ColumnSurname,
+table#SortByName th.ColumnQuantity {
+ padding-left: 0px;
}
-table.infolist thead tr th.ColumnSurname a, table.infolist thead tr th.ColumnQuantity a {
- display:block;
- padding:.1em 10px;
+table#SortByName td.ColumnSurname > a,
+table#SortByName th.ColumnSurname > a,
+table#SortByName th.ColumnQuantity > a {
+ padding-left: 1ex;
}
-table#SortByName thead tr th.ColumnSurname a, table#SortByCount thead tr th.ColumnQuantity a {
- background-color:#EAEEF4;
+table#SortByName thead th.ColumnSurname a:after,
+table#SortByCount thead th.ColumnQuantity a:after {
+ content: " \2193";
}
-table#SortByName thead tr th.ColumnSurname a:after, table#SortByCount thead tr th.ColumnQuantity a:after {
- content:" ↓";
+table.surname td.ColumnName {
+ background-color: #EAEEF4;
}
-table.infolist tbody tr td.ColumnSurname {
- padding:0;
- background-color:#EAEEF4;
+table.surname td.ColumnName a[href]:hover {
+ background-color: #BFD0EA;
}
-table.infolist tbody tr td.ColumnSurname a {
- padding:.1em 10px;
+/* make the whole cell light up on hover not just the a. */
+table.surname td.ColumnName {
+ padding-left: 0px;
}
-table.infolist tbody tr td.ColumnSurname a:hover {
- padding:.1em 10px;
- background-color:#BFD0EA;
-}
-table.surname {
- border-bottom:solid 1px #EAEEF4;
-}
-table.surname tbody tr td {
- border-bottom:dashed 1px #BFD0EA;
-}
-table.surname tbody tr td.ColumnName {
- width:20%;
- padding:0;
- background-color:#EAEEF4;
-}
-table.surname tbody tr td.ColumnName a {
- display:block;
- padding:.6em 10px .6em 20px;
-}
-table.surname tbody tr td.ColumnName a:hover {
- background-color:#BFD0EA;
-}
-table.surname tbody tr td.ColumnName a span.grampsid {
- display:none;
-}
-table.surname thead tr th.ColumnParents, table.surname tbody tr td.ColumnParents {
- width:25%;
+table.surname td.ColumnName > a {
+ padding-left: 15px;
}
/* Individuals
----------------------------------------------------- */
-#Individuals { }
-#Individuals table.individuallist {
- border-bottom:solid 1px #EAEEF4;
-}
-#Individuals table.individuallist tbody tr td {
- border-bottom:dashed 1px #BFD0EA;
-}
-#Individuals table.individuallist tbody tr td a:hover {
- text-decoration:none;
-}
-table.individuallist tbody tr td.ColumnSurname {
- background:none;
-}
-table.individuallist tbody tr td.ColumnSurname a:hover, table.individuallist tbody tr td.ColumnSurname a:active {
- cursor:default;
- color:black;
- background:none;
-}
-table.individuallist tbody tr td.ColumnName {
- padding:0;
- background-color:#EAEEF4;
-}
-table.individuallist tbody tr td.ColumnName a {
- display:block;
- padding:.6em 10px;
- vertical-align:middle;
-}
-table.individuallist tbody tr td.ColumnName a:hover {
- background-color:#BFD0EA;
-}
-#Individuals div table.infolist tr td p {
- vertical-align:top;
-}
-#Individuals div table.infolist tr td p a {
- display:inline;
-}
-
-/* IndividualDetail
------------------------------------------------------- */
-#IndividualDetail {
- background-color:#EAEEF4;
-}
-#IndividualDetail div table.infolist tr td {
- font:normal .9em/1.2em sans-serif;
- vertical-align:top;
-}
-#IndividualDetail div table.infolist tr td a {
- display:inline;
-}
-#IndividualDetail table.infolist tr td a:hover {
- text-decoration:underline;
-}
-#IndividualDetail table.infolist tbody tr td.ColumnAttribute {
- width:10%;
- color:#696969;
-}
-#IndividualDetail div.subsection table tr td:first-child {
- padding-left:20px;
-}
-#familymap a.familymap {
- margin-left:20px;
-}
-
-/* Subsections : Attributes
------------------------------------------------------ */
-div#attributes {
- margin: 0;
- padding: 0;
-}
-table.attrlist {
- width: 100%;
-}
-table.attrlist thead tr th {
- background-color: #70B1ED;
- color: #000;
-}
-table.attrlist tbody tr td {
- border-bottom: dashed 1px #000;
-}
-table.attrlist tbody tr td.ColumnType {
- width: 15%;
-}
-table.attrlist tbody tr td.ColumnValue {
- width: 15%;
-}
-table.attrlist tbody tr td.ColumnNotes {
- width: 40%;
-}
-table.attrlist tbody tr td.ColumnSources {
- width: 10%;
-}
-
-/* Sources
------------------------------------------------------ */
-#Sources table.infolist tbody tr td.ColumnRowLabel {
- padding-bottom:0;
-}
-#Sources table.infolist tbody tr td.ColumnName {
- padding:0;
-}
-#Sources table.infolist tbody tr td.ColumnName a {
- padding:.1em 10px .3em 10px;
-}
-#SourceDetail div#references ol li {
- padding-bottom:.5em;
-}
-
-/* Relationships
-================================================= */
-table.relationships thead tr th.ColumnMarriage,
-table.relationships thead tr th.ColumnDivorce {
- width: 13%;
-}
-table.relationships thead tr th.ColumnHyper {
- width: 15%;
-}
-table.relationships thead tr th.ColumnMedia {
- width: 15%;
-}
-table.relationships tbody tr td.ColumnRowLabel a {
- background: none;
-}
-table.relationships tbody tr td.ColumnPartner {
- font-size:100%;
+table.IndividualList td.ColumnSurname {
+ background-color: #EAEEF4;
}
/* Places
----------------------------------------------------- */
-#Places table.infolist tbody tr td.ColumnName {
- padding:0;
+#Places table.infolist td.ColumnName {
+ background-color: #EAEEF4;
}
-#Places table.infolist tbody tr td.ColumnName a {
- padding:.1em 10px .3em 10px;
+#Places table.infolist td.ColumnName a[href]:hover {
+ background-color: #BFD0EA;
+}
+/* make the whole cell light up on hover not just the a. */
+#Places table.infolist td.ColumnName {
+ padding-left: 0px;
+}
+#Places table.infolist td.ColumnName > a {
+ padding-left: 1ex;
}
/* Events
----------------------------------------------------- */
#EventList table.infolist tr.BeginType td {
- border-top: dashed 1px #BFD0EA;
+ border-top:dashed 1px #BFD0EA;
}
#EventList table.infolist tr.BeginLetter td {
- border-top: solid 1px #BFD0EA;
+ border-top:solid 1px #BFD0EA;
}
-#EventList table.infolist tr td a,
-#EventDetail table.infolist tr td a {
+#EventList table.infolist td.ColumnType {
+ background-color: #EAEEF4;
+}
+#EventList td.ColumnPerson a {
display: inline;
}
-#EventList table.infolist tr td span.father,
-#EventList table.infolist tr td span.mother,
-#EventDetail table.infolist tr td span.father,
-#EventDetail table.infolist tr td span.mother {
- display: block;
-}
-#EventList table.infolist tr td span.person:after,
-#EventList table.infolist tr td span.father:after,
-#EventList table.infolist tr td span.mother:after,
-#EventDetail table.infolist tr td span.person:after,
-#EventDetail table.infolist tr td span.father:after,
-#EventDetail table.infolist tr td span.mother:after {
+#EventList td.ColumnPerson span.person:after,
+#EventList td.ColumnPerson span.father:after,
+#EventList td.ColumnPerson span.mother:after,
+#EventDetail td.ColumnPerson span.person:after,
+#EventDetail td.ColumnPerson span.father:after,
+#EventDetail td.ColumnPerson span.mother:after {
content: ", ";
}
-#EventList table.infolist tr td span.person:last-child:after,
-#EventList table.infolist tr td span.father:last-child:after,
-#EventList table.infolist tr td span.mother:last-child:after,
-#EventDetail table.infolist tr td span.person:last-child:after,
-#EventDetail table.infolist tr td span.father:last-child:after,
-#EventDetail table.infolist tr td span.mother:last-child:after {
+#EventList td.ColumnPerson span.fatherNmother:after,
+#EventDetail td.ColumnPerson span.fatherNmother:after {
+ content: " + ";
+}
+#EventList td.ColumnPerson span.person:last-child:after,
+#EventList td.ColumnPerson span.father:last-child:after,
+#EventList td.ColumnPerson span.mother:last-child:after,
+#EventDetail td.ColumnPerson span.person:last-child:after,
+#EventDetail td.ColumnPerson span.father:last-child:after,
+#EventDetail td.ColumnPerson span.mother:last-child:after {
content: "";
}
/* Gallery
----------------------------------------------------- */
-#Gallery table.infolist tbody tr td.ColumnRowLabel, #Gallery table.infolist tbody tr td.ColumnDate {
- padding-bottom:0;
-}
-#Gallery table.infolist tbody tr td.ColumnName {
- padding:0;
-}
-#Gallery table.infolist tbody tr td.ColumnName a {
- padding:.1em 10px .3em 10px;
-}
-#Gallery table.infolist tbody tr td.ColumnName a:hover {
- background-color:#EAEEF4;
-}
#GalleryNav {
- font-size:.8em;
- margin:1em 0 0 0;
- padding:1.2em 0 0 0;
- text-align:center;
+ text-align: center;
+ margin: 2em 0px;
}
#GalleryNav a {
- font-weight:bold;
- text-decoration:none;
- background-color:#EAEEF4;
- border:solid 1px #7CA3DD;
+ font-weight: bold;
+ background-color: #EAEEF4;
+ border: solid 1px #7CA3DD;
+ margin: 1em;
}
#GalleryNav a:hover {
- background-color:#BFD0EA;
+ background-color: #BFD0EA;
}
#GalleryNav a#Previous {
- padding:.4em .7em .3em .7em;
+ padding: .4em .7em .3em .7em;
}
#GalleryNav a#Next {
- padding:.4em 1.9em .3em 1.9em;
-}
-#GalleryPages {
- margin:0 1em;
+ padding: .4em 1.9em .3em 1.9em;
}
#GalleryCurrent {
- font-size:1.2em;
- font-weight:bold;
+ font-size: larger;
}
#GalleryTotal {
- font-weight:normal;
+ font-weight: normal;
}
#GalleryDisplay {
- margin:0 auto;
- padding:0;
- position:relative;
- overflow:hidden;
- text-align:center;
- border:solid 1px #7CA3DD;
+ margin: 0px auto;
+ position: relative;
}
#GalleryDisplay img {
- margin:0 auto;
+ margin: 0px auto;
+ display: block;
+ border: solid 1px #7CA3DD;
}
-#GalleryDetail div#summaryarea{
- margin:0;
- padding:1.4em 0 0 0;
-}
-#GalleryDetail div#summaryarea h3 {
- text-align:center;
-}
-#GalleryDetail div h4 {
- margin-top:0;
-}
-#GalleryDetail div#summaryarea table.gallery {
- width:100%;
- margin-top:1.5em;
- margin-bottom:0;
- padding-bottom:0;
- background-color:#EAEEF4;
- border-style:solid;
- border-width:8px 0 0 0;
- border-color:#BFD0EA;
-}
-
-/* Thumbnail Preview Reference Section
-------------------------------------------------- */
-body#ThumbnailPreview div#references {
- background-color: #FFF;
- color: #00029D;
- margin: 0 auto;
- padding: 0;
- width: 100%;
-}
-body#ThumbnailPreview div#references table.infolist tbody tr {
- border-bottom: dashed 1px #000;
-}
-body#ThumbnailPreview div#references table.infolist tbody tr td.ColumnRowLabel a {
- background: none;
- width: 2%;
-}
-body#ThumbnailPreview div#references table.infolist tbody tr td.ColumnName {
- width: 90%;
+#GalleryDetail h3 {
+ text-align: center;
}
/* Contact
----------------------------------------------------- */
+#Contact {
+ overflow: hidden;
+}
#Contact #summaryarea {
- width:500px;
- margin:2em auto;
- padding:3em;
- background-color:#EAEEF4;
- border:solid 1px #7CA3DD;
+ width: 40em;
+ margin: 2em auto;
+ padding: 3em;
+ background-color: #EAEEF4;
+ border: solid 1px #7CA3DD;
}
-#Contact #summaryarea img {
- float:right;
- margin:0;
- padding:0;
- border:solid 1px #7CA3DD;
+#Contact img {
+ float: right;
+ border: solid 1px #7CA3DD;
}
-#researcher {
- margin-top:.3em;
+#Contact #researcher, #Contact #researcher h3 {
+ font-size: larger;
+ padding-left: 0px;
}
-#researcher h3 {
- padding:0;
-}
-#researcher span {
- display:block;
- float:left;
- margin-right:.4em;
-}
-#streetaddress {
- width:85%;
-}
-#locality, .locality {
+#Contact #streetaddress, #Contact #locality, #Contact #email {
display: block;
- width: 100%;
}
-#city:after {
- content:",";
+#Contact #locality, #Contact #city, #Contact #state, #Contact #postalcode,
+#Contact #country {
+ white-space: nowrap;
}
-#country {
- clear:left;
-}
-#email {
- clear:left;
-}
-#email a {
- text-decoration:none;
-}
-#email a:hover {
- text-decoration:underline;
+#Contact #city:after {
+ content: ",";
}
-/* Download
+/* Download
----------------------------------------------------- */
-#Download {
- padding:1cm;
- height:396px;
-}
-table.download {
- border:solid 2px #000;
- width:100%;
-}
-table.download img {
- float:center;
-}
-table.download thead tr th {
- text-align:center;
- border:solid 2px #000;
- color: #000;
- text-transform:uppercase;
-}
-table.download tbody tr#Row02 {
- border-bottom:solid 2px #000;
-}
-table.download thead tr th, table.download tbody tr td {
- padding-left:10px;
- padding-top:20px;
- border-style:solid;
- border-color:#000;
- border-width:0 2px 2px 2px;
- text-align:left;
-}
-table.download td.Description {
- width: 50%;
-}
-table.download td.License {
- width:8%;
-}
-table.download td.Filename {
- width:30%;
-}
-table.download td.Filename a {
- font-weight:bold;
- font-style: italic;
- text-decoration:none;
-}
-table.download td.Filename a:hover {
- text-decoration:underline;
-}
-table.download td.Modified {
- width:12%;
- font-weight:bold;
+#Download table.download a {
+ display: block;
}
-/* Subsections
+/* Subsection
----------------------------------------------------- */
-#Home, #Introduction, #Contact {
- padding:1.5em 0 3em 0;
+#Home, #Introduction {
+ overflow: hidden;
}
-#Home p, #Introduction p, #Contact p {
- margin:0 20px 1em 20px;
+#Home img, #Introduction img {
+ float: right;
+ margin: 1em;
+ max-width: 950px;
}
-#Home img, #Introduction img, #Contact img {
- float:right;
- margin:0;
- padding:0 20px 3em 20px;
+#Home p, #Introduction p {
+ padding-left: 15px;
}
-#Home a, #Introduction a, #Contact a {
- color: #000;
- text-decoration: none;
+.subsection {
+ clear: both;
+ overflow: hidden;
}
-div.subsection{
- padding-bottom:.5em;
- background-color:#FFF;
-}
-div.subsection h4 {
- margin-bottom:.5em;
-}
-div.subsection table, div.subsection ol, div.subsection p, div.subsection > a {
- font-size:.9em;
-}
-div.subsection a {
- text-decoration:none;
-}
-div.subsection a:hover {
- text-decoration:underline;
- background:none;
-}
-div.subsection table.infolist {
- width:100%;
- margin:0;
-}
-#IndividualDetail div.subsection table tr td:first-child {
- padding-left:20px;
+.subsection p {
+ margin: 0px;
}
-/* Subsections : Summary Area
+/* Subsection : Families
----------------------------------------------------- */
-div#summaryarea {
- min-height:100px;
- background:none;
-}
-div#summaryarea table.infolist {
- margin:0;
- padding:0;
- background:#FFF;
- border-bottom:solid .7em #FFF;
-}
-div#summaryarea table.infolist tr td, div#summaryarea table.infolist tr td p {
- vertical-align:top;
-}
-div#summaryarea table.infolist tr td a, div#summaryarea table.infolist tr td p a {
- display:inline;
-}
-div#summaryarea table.infolist tbody tr td.ColumnAttribute {
- width:14%;
- padding-left:20px;
-}
-
-/* Subsections : Events
------------------------------------------------------ */
-div#events {
- padding-bottom:0;
-}
-div#events h4 {
- margin-bottom:0;
-}
-div#events table.infolist {
- border-bottom:solid 1px #FFF;
-}
-div#events table.infolist tbody tr td {
- padding-top:.2em;
- padding-bottom:.2em;
-}
-#IndividualDetail div#events table.infolist thead tr th:first-child {
- padding-left:20px;
-}
-div#events table.infolist tbody tr td.ColumnAttribute {
- border-bottom:dashed 1px #BFD0EA;
-}
-div#events table.infolist tbody tr td.ColumnValue {
- border-bottom:dashed 1px #BFD0EA;
-}
-div#events table.infolist tbody tr td.ColumnValue p {
- margin:.1em 2em;
-}
-
-/* Subsections : Parents
------------------------------------------------------ */
-div#parents table.infolist tbody tr td.ColumnValue ol {
- margin:0;
- padding-top:0;
-}
-div#parents table.infolist tbody tr td.ColumnValue ol li {
- padding-bottom:.2em;
-}
-
-/* Subsections : Families
------------------------------------------------------ */
-div#families table.infolist tbody tr td.ColumnValue p {
- margin-top:0;
-}
-div#families table.infolist tbody tr td.ColumnValue ol {
- margin:0;
- padding-top:0;
-}
-div#families table.infolist tbody tr td.ColumnValue ol li {
- padding-bottom:.2em;
-}
div#families table.fixed_subtables table.eventlist {
- table-layout:fixed;
+ table-layout: fixed;
}
div#families table.fixed_subtables table.eventlist th:first-child {
- width:9em;
+ width: 9em;
}
div#families table.fixed_subtables table.eventlist th:last-child {
- width:5em;
+ width: 5em;
+}
+div#families table.attrlist td.ColumnType {
+ color: black;
}
-/* Subsections : Addresses
+/* Subsection : Gallery
----------------------------------------------------- */
-div#addresses {
- padding-bottom:0;
-}
-div#addresses h4 {
- margin-bottom:0;
-}
-div#addresses table.infolist {
- border-bottom:solid 1px #FFF;
-}
-div#addresses table.infolist tbody tr td {
- padding-top:.2em;
- padding-bottom:.2em;
-}
-div#addresses table.infolist tbody tr td.ColumnAttribute {
- width:30%;
- border-bottom:dashed 1px #BFD0EA;
-}
-div#addresses table.infolist tbody tr td.ColumnValue {
- border-bottom:dashed 1px #BFD0EA;
-}
-div#Addresses table.infolist tr td a, div#Addresses table.infolist tr td p a {
- display: inline;
-}
-
-/* Subsections : Attributes
------------------------------------------------------ */
-
-/* Subsections : Gallery
------------------------------------------------------ */
-#indivgallery h4 {
- margin-bottom:1em;
-}
#indivgallery .thumbnail {
- margin:0;
- float:left;
- width:130px;
- height:150px;
- text-align:center;
+ float: left;
+ max-width: 130px;
+ max-height: 150px;
+ font-size: smaller;
+ text-align: center;
+ margin: 0.8em 0.5em;
}
-#indivgallery .thumbnail a {
- display:block;
- margin:0;
- padding:0;
- background:none;
+#indivgallery h4 + .thumbnail {
+ margin-left: 15px;
+ /* Problem: if there are more thumnails then fit on a single row, the
+ * first thumnail on each next row should also have a margin-left
+ * of 15 px. */
}
-#indivgallery .thumbnail a img {
- margin:0;
- padding:0;
- border:solid 1px #7CA3DD;
+#indivgallery img {
+ border: solid 1px #7CA3DD;
}
-#indivgallery div.thumbnail span {
-/* ## remove this line and the comment markers from the line below to hide the description in Individual Gallery
+#indivgallery span {
+/* ## remove this line and the comment markers from the line below to hide description in Indivifual Gallery
display: none; */
-
- font-size:.6em;
- text-align:center;
- width:80%;
- margin:0 auto;
- padding:0;
}
-/* Subsections : Narrative
+/* Subsection : Narrative
----------------------------------------------------- */
-div.narrative {
- padding-bottom:0;
+h4 + div.grampsstylednote, a.familymap {
+ margin: 1em 15px;
}
-.narrative p {
- margin-top:.5em;
- margin-bottom:0;
- padding:0 20px 1em 20px;
+i + div.grampsstylednote p {
+ margin: 0px;
}
-/* Subsections : References
+/* Subsection : Family Map
----------------------------------------------------- */
-#references ol {
- margin-top:0;
- margin-bottom:0;
+a.familymap {
+ display: block;
}
-/* Subsections : Source References
+/* Subsection : Source References
----------------------------------------------------- */
-div#sourcerefs ol {
- list-style-type:decimal;
-}
-div#sourcerefs ol li ol {
- list-style-type:lower-alpha;
+#sourcerefs ol li ol {
+ list-style-type: lower-alpha;
}
-/* Subsections : Weblinks
------------------------------------------------------ */
-
-/* Subsections : Pedigree
+/* Subsection : Pedigree
----------------------------------------------------- */
.pedigreegen {
- font-size:.9em;
- list-style:none;
- margin:.5em 0 0 0;
- padding:0 0 .7em 20px;
+ list-style-type: none;
+ padding-left: 15px;
}
.pedigreegen li ol {
- list-style:none;
- margin-left:.5em;
-}
-.pedigreegen li ol li {
- padding-bottom:.2em;
+ list-style-type: none;
}
.pedigreegen li ol li ol {
- list-style:decimal;
- margin-left:1.6em;
+ list-style-type: decimal;
}
-.pedigreegen li ol li ol li ol.spouselist {
- font-size:1em;
- list-style:none;
- margin-left:0;
+.pedigreegen ol.spouselist {
+ list-style-type: none;
}
-.spouselist li.spouse ol {
- font-size:1em;
- list-style:decimal;
- margin-left:1.6em;
-}
-.spouse a {
- font-weight:normal;
+.pedigreegen ol.spouselist li.spouse ol {
+ list-style-type: decimal;
}
.spouse:before {
content: "+ ";
}
.thisperson {
- font-weight:bold;
+ font-weight: bold;
+}
+.thisperson > ol {
+ font-weight: normal;
}
/* Footer
----------------------------------------------------- */
#footer {
- clear:both;
- width:100%;
- font-size:12px;
- line-height:130%;
- color:#204D91;
- margin:0;
- padding:15px 0 0 0;
- background-color:#BFD0EA;
- border-top:solid 1px #204D91;
+ clear: both;
+ padding-top: 1em;
+ background-color: #BFD0EA;
+ border-top: solid 1px #204D91;
}
-#footer a, #footer a:visited {
- text-decoration:none;
- color:#204D91;
-}
-#footer a:hover {
- text-decoration:underline;
-}
-#footer img {
- border:0;
- margin:0 auto;
- vertical-align:middle;
+#footer > * {
+ background-color: #EAEEF4;
}
#footer p#createdate {
- float:left;
- width:40%;
- text-align:left;
- margin-left:10px;
+ float: left;
+ width: 50%;
+ text-align: left;
+ padding-left: 15px;
+ margin-top: 1em;
}
#footer p#copyright {
- float:right;
- width:40%;
- text-align:right;
- margin-right:10px;
+ float: right;
+ width: 40%;
+ text-align: right;
+ padding-right: 15px;
}
-#footer p#copyright img {
- margin-right:10px;
+#footer a[href]:hover {
+ background-color: #BFD0EA;
}
-#user_footer {
- width:70%;
- float:left;
- margin:1em;
-}
-#user_footer p {
- font:normal 1em/1.2em serif;
- margin:0;
- padding:0;
+
+/* Overwritten
+----------------------------------------------------- */
+body#FamilyMap {
+ background-color: #EAEEF4 ! important;
}
/* Calendar Styles
--------------------------------------------------------------------------------------------- */
-/* Calendar : General */
-body#WebCal {
- padding:0 14px;
- background-color:#204D91;
+===================================================== */
+table.calendar {
+ table-layout: fixed;
+ empty-cells: show;
}
-.calendar {
- empty-cells:show;
- width:100%;
- font-size:1em;
- font-weight:normal;
- margin:0;
- padding:0;
- border:none;
- border-collapse:collapse;
+.calendar thead th {
+ text-align: center;
+ border-top-style: none;
}
-.calendar thead tr th {
- width:14%;
- font-weight:bold;
- font-size:14px;
- line-height:14px;
- text-align:center;
- text-transform:uppercase;
- padding:2px 0;
+.calendar thead th.monthName {
+ font-size: xx-large;
+ font-weight: normal;
+ background-color: #FFF;
+ border-bottom-style: none;
+ padding-top: 1em;
}
-.calendar thead tr th.monthName {
- width:100%;
- font-weight:normal;
- font-size:2em;
- line-height:100%;
- text-transform:none;
- color:#204D91;
- padding:.3em 0 .2em 0;
- background-color:#FFF;
- border-bottom-width:0;
+.calendar thead th abbr {
+ border-bottom-style: none;
}
-body#WebCal #CreatorInfo {
- float:right;
- font-size:12px;
- margin:-24px 10px 0 0;
+#CreatorInfo {
+ float: right;
+ margin: -1em 15px 0px 0px;
+ font-weight: bold;
+ color: #7CA3DD;
}
-.calendar thead tr th.weekend,
-.calendar thead tr th.weekday {
- color:#204D91;
- background-color:#EEE;
- border-style:solid;
- border-width:0 0 1px 0;
- border-color:#7CA3DD;
-}
-.calendar thead tr th.saturday,
-.calendar thead tr th.sunday { }
-.calendar tfoot tr td {
- padding:.7em 5% 1em 5%;
- border-top:solid 4px #7CA3DD;
+#CreatorInfo a[href]:hover {
+ background-color: #BFD0EA;
}
.calendar tfoot tr td {
- vertical-align:middle;
- color:#204D91;
- background-color:#EEE;
+ border-top: solid 4px #7CA3DD;
+ vertical-align: middle;
}
/* Calendar : Date Numeral */
-.calendar tbody tr td div.date {
- float:right;
- display:block;
- width:1.8em;
- font-weight:bold;
- font-size:1em;
- line-height:100%;
- text-align:center;
- color:#204D91;
- margin:0 0 0 .5em;
- padding:.2em 0;
- background-color:#BFD0EA;
+.calendar div.date {
+ float: right;
+ width: 1.8em;
+ font-size: large;
+ text-align: center;
+ background-color: #BFD0EA;
+ color: #204D91;
}
/* Calendar : Date Container */
-.calendar tbody tr td {
- vertical-align:top;
- height:10em;
- padding:0;
- border-width:1px 0 0 1px;
- border-style:solid;
- border-color:#BFD0EA;
+.calendar td {
+ padding: 0px 0px 0px 1ex;
+ border-width: 1px 0px 0px 1px;
+ border-style: solid;
+ border-color: #BFD0EA;
+ background-color: #FFF;
}
-.calendar tbody tr td.weekday {
- background-color:#FFF;
-}
-.calendar tbody tr td.weekend {
- background-color:#EAEEF4;
-}
-.calendar tbody tr td.saturday {
-
- }
-.calendar tbody tr td:first-child {
- border-left:none;
+.calendar td:first-child {
+ border-left-style: none;
+ padding: 0px 0px 0px 1ex;
}
.calendar tbody tr:first-child td {
- border-top:none;
+ border-top-style: none;
}
/* Calendar : Date Detail */
-.calendar tbody tr td ul {
- list-style:none;
- font-family:sans-serif;
- font-size:.8em;
- margin:2.3em 0 .3em 0;
- padding:0;
+.calendar td ul {
+ font-size: smaller;
+ list-style: none;
+ padding: 0px;
}
-.calendar tbody tr td ul li {
- display:block;
- width:92%;
- margin:0 4%;
- padding:.2em 0 .3em 0;
- border-top:dashed 1px #C1B398;
+.calendar td ul li {
+ border-top: dashed 1px #BFD0EA;
+ padding-top: 0.5em;
+ padding-bottom: 0.5em;
}
-.calendar tbody tr td ul li:first-child {
- border:none;
+.calendar td ul li:first-child {
+ border-style: none;
+}
+.calendar td ul a[href]:hover {
+ background-color: #BFD0EA;
}
/* Calendar : Birthday, Anniversary, Highlight */
-.calendar tbody tr td ul li em {
- font-style:normal;
- color:#0A65B5;
+.calendar td ul li em {
+ font-style: normal;
+ color: #7CA3DD;
}
-.calendar tbody tr td ul li span.yearsmarried em {
- color:#453619;
+.calendar td.highlight {
+ background-color: #EAEEF4;
}
-.calendar tbody tr td.highlight {
- background-color:#FFEBC2;
-}
-.calendar tbody tr td.highlight div.date {
- color:#FF7C27;
- background-color:#FFCF6C;
+.calendar td.highlight div.date {
+ color: black;
+ background-color: #BFD0EA;
}
/* Calendar : Previous-Next Month */
-.calendar tbody tr td.previous,
-.calendar tbody tr td.next,
-.calendar tbody tr td.previous div.date,
-.calendar tbody tr td.next div.date {
- color:#BFD0EA;
- background-color:#EAEEF4;
+.calendar td.previous,
+.calendar td.next,
+.calendar td.previous div.date,
+.calendar td.next div.date {
+ color: #BFD0EA;
+ background-color: #FFF;
}
/* Calendar : Full Year */
body#fullyearlinked div.content {
- width:963px;
- margin:0 auto;
- padding:15px 0 2px 2px;
+ overflow: hidden;
}
body#fullyearlinked table.calendar {
- float:left;
- width:320px;
- height:18em;
- border:solid 1px #7D5925;
+ float: left;
+ width: 33.3%;
+ height: 18em;
+ border: solid 1px black;
}
-body#fullyearlinked table.calendar thead tr th {
- height:2em;
+body#fullyearlinked table.calendar thead th {
+ height: 2em;
}
-body#fullyearlinked table.calendar thead tr th.monthName {
- font-size:1.2em;
- padding:2px 0;
+body#fullyearlinked table.calendar thead th.monthName {
+ font-size: large;
+ padding: 2px 0px;
}
- body#fullyearlinked table.calendar tbody tr td {
- height:3em;
+body#fullyearlinked table.calendar tbody td {
+ height: 3em;
+}
+body#OneDay div.content {
+ overflow: hidden;
}