gramps/data/css/Web_Print-Default.css
Serge Noiraud fd072528d2
Narrative web: Some improvements (#931)
* Narrative web: Some improvements

- Event type, Date and place in bold
- Family events shifted one column on the left
- ancestortree css file before narrative-screen to allow modification
- Adaptation for all themes

Fixes #11393

* Narrative web: forgot a comma during last merge

* Allow scrolling if the ancestor tree is too large

* Translation of alternate stylesheets name

* Crash when using the family map

* Translate only the css title, not the file name

* Some minor corrections to css files

* Narrative web: open layers optimizations

* Narrative web: open layers and link in popup

* Narrative web: some events missing in popup

* Narrative web: Reference date column too large.

Allow the place title to use the maximum of width

* NarrativeWeb: shift children from one column

- adapt the css files to the new table
- some inconsistencies between the source and the css

* Make the drop down menu button size usable

* NarrativeWeb: Incorrect rendering when use of

alternate place name

* NarWeb: removing the unused image heigth option

* Click on image link gives a not found URL.

If the image used in home, introduction or contact page
is not already associated by a filtered object, we have a 404 error

* NarWeb: Index images and thumbnails pages optional

* Narweb: Improper Notes subtitle in web pages

* Narweb: List index truncated after 999

* Narweb: NarrativeWeb usage enhancements

* Narweb: avoid duplicate files in archive.

* Narweb: Add an optional news and updates page:

When you have a big database and you make intensive updates, it's
useful to have a list of the last modified objects.
you can select the period to show and how many records to see per object type.

* Narweb: forgot to add the module updates.py

* Narweb: some minor changes (pylint, img index bug)

* Popups don't work with the last openlayers version

It only needs to move the scripts at the end of the html body.
Use addEventListener instead of onload in the html body statement.

* Narweb: some popup problems

* Narweb: better score for pylint
2019-12-14 11:55:16 +01:00

824 lines
17 KiB
CSS

/*
*******************************************************************************
Copyright Holder and License
*******************************************************************************
GRAMPS Cascading Style Sheet
Style Name: Print Style Sheet
Style Author: Jason M. Simanek (2008)
Modified by Rob G. Healey, July 2008
*******************************************************************************
This website was created with GRAMPS <http://www.gramps-project.org/>
-------------------------------------------------------------------------------
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.
'Go to <http://gramps-project.org/> to learn more!
-------------------------------------------------------------------------------
Copyright (C) 2008-2011 Rob G. Healey <robhealey1@gmail.com>
This file is part of the GRAMPS program.
GRAMPS is free software: you can redistribute it and/or modify it under the
terms of the GNU General Public License as published by the Free Software
Foundation, version 2 of the License.
GRAMPS is distributed in the hope that it will be useful, but WITHOUT ANY
WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
A PARTICULAR PURPOSE. See the GNU General Public License for more details.
You should have received a copy of the GNU General Public License along with
GRAMPS. If not, see <http://www.gnu.org/licenses/>.
-------------------------------------------------------------------------------
Color Palette
-------------------------------------------------------------------------------
gray #A7A7A7
red #520
black #000
white #FFF
-------------------------------------------------------------------------------
NarrativeWeb Styles
-------------------------------------------------------------------------------
General Elements
----------------------------------------------------- */
body {
color:#000;
margin:0;
padding:0;
background-color:#FFF;
}
div {
margin:0;
padding:0;
}
img {
border:none;
margin:0;
}
.content { }
.content div.snapshot {
float:right;
margin:1.6em;
padding-top: .5cm;
background:none;
}
.content div.snapshot div.thumbnail {
margin:0;
padding:0;
background:none;
}
.content .thumbnail a:link:after, .content .thumbnail a:visited:after {
content:"";
}
.fullclear {
width:100%;
height:1pt;
margin:0;
padding:0;
clear:both;
}
/* General Text
----------------------------------------------------- */
h1 {
font:normal 16pt/18pt serif;
margin:0;
padding:0;
}
h2 {
font:normal 18pt/23pt serif;
display:inline;
margin:0;
padding:0;
}
h3 {
font:normal 18pt/23pt serif;
text-align:left;
display:inline;
margin:0 0 0 8pt;
padding:0;
}
h4 {
display:block;
clear:both;
font:normal 14pt/16pt serif;
margin:8pt 0 0 0;
padding:8pt 0 1pt 0;
border-top:solid .5pt #A7A7A7
}
h5, h6 {
font:normal 14pt/16pt serif;
font-style:italic;
margin:0;
padding:0;
}
p {
font:normal 11pt/14pt serif;
}
p#description {
margin:0 0 14pt 0;
}
a:link, a:visited {
color:#520;
text-decoration:underline;
}
.content a:link:after, content a:visited:after {
font-size:70%;
font-family:sans-serif;
content:" (" attr(href) ") ";
}
.content ol li a:link {
text-decoration:none;
}
.content ol li a:link:after, .content ol li a:visited:after {
content:"";
}
sup {
line-height:0;
}
ol {
font:normal .9em/1.6em sans-serif;
margin-top:0;
margin-bottom:0;
padding-top:.5em;
padding-bottom:0;
}
/* Header
----------------------------------------------------- */
#Header {
padding:0 0 8pt 0;
margin:0 0 8pt 0;
border-bottom:solid .5pt #000;
}
#SiteTitle {
text-align: left;
margin: 0;
padding: 0;
}
#user_header {
font-style:italic;
text-align:center;
margin:0;
padding:0
}
.grampsid {
font-size:60%;
font-family:monospace;
color:#A7A7A7
}
/* Navigation
----------------------------------------------------- */
#alphabet, #navigation, #subnavigation { display:none; }
/* Main Table
----------------------------------------------------- */
table {
width:100%;
margin:0;
padding:0;
border:none;
border-collapse:collapse;
border-bottom:solid .5pt #FFF;
}
table thead tr th {
text-align:left;
font:normal 11pt/13pt serif;
color:#000;
margin:0;
padding:0;
padding-bottom:1pt;
border-bottom:solid .5pt #000;
}
.content table thead tr th a {
text-decoration:none;
}
.content table thead tr th a:link:after, .content table thead tr th a:visited:after {
content:"";
}
table tbody tr td {
font:normal 9pt/11pt sans-serif;
vertical-align:middle;
padding:2pt 6pt 1pt 0;
border-bottom:dashed .5pt #A7A7A7;
}
.content table tbody tr td a {
text-decoration:none;
}
.content table tbody tr td a:link:after, .content table tbody tr td a:visited:after {
content:"";
}
table tr.BeginLetter td, table.infolist tr.BeginSurname td {
border-top:solid .5pt #A7A7A7;
}
table tbody tr td.ColumnRowLabel {
width:2%;
color:#A7A7A7;
text-align:center;
}
table tr td.ColumnLetter {
width:3%;
text-align:center;
}
table tr td.ColumnAttribute {
width:10%;
}
.content table tbody tr td.ColumnName a {
text-decoration:none;
}
table tbody tr td.ColumnBirth {
width:10%;
}
table tbody tr td.ColumnDeath {
width:10%;
text-decoration:underline;
}
table tbody tr td.ColumnParents {
font-size:70%;
}
table tbody tr td.ColumnParents span.mother:before {
content:"+ ";
}
/* Home/ Welcome
----------------------------------------------------- */
#Home p {
margin:0 0 9pt 0;
}
#Home img {
float:right;
margin:0;
padding:0 0 9pt 9pt;
}
#Home a {
color: #000;
text-decoration: underline;
}
/* Introduction
----------------------------------------------------- */
#Introduction p {
margin:0 0 9pt 0;
}
#Introduction img {
float:right;
margin:0;
padding:0 0 9pt 9pt;
}
#Introcution a {
color: #000;
text-decoration: underline;
}
/* Surnames
----------------------------------------------------- */
#Surnames { }
table.surnamelist tr thead th.ColumnSurname, #Surnames table.surnamelist tbody tr td.ColumnSurname {
width:50%;
}
table#SortByName thead tr th.ColumnSurname a:after, table#SortByCount thead tr th.ColumnQuantity a:after {
content:" ↓";
}
table.surname thead tr th.ColumnParents, table.surname tbody tr td.ColumnParents {
width:35%;
}
div#SourceDetail {
margin: 0 auto;
}
div#SourceCitationReferents ul.Col1 {
list-style-type: decimal
}
div#SourceCitationReferents ul.Col2 {
list-style-type: upper-alpha
}
div#SourceCitationReferents ul.Col3 {
list-style-type: lower-alpha
}
div#SourceCitationReferents ul.Col4 {
list-style-type: upper-roman
}
div#SourceCitationReferents ul.Col5 {
list-style-type: disc
}
/* Individuals
----------------------------------------------------- */
/* 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;
}
/* Events
----------------------------------------------------- */
#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 {
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 {
content: "";
}
/* Gallery
----------------------------------------------------- */
#GalleryDetail h2 {
display:none;
}
#GalleryNav {
display:none;
}
#GalleryDisplay {
margin:0 auto;
padding:0;
position:relative;
overflow:hidden;
text-align:center;
}
#GalleryDisplay img {
margin:0 auto;
border:solid 1pt #542;
}
#GalleryDetail h3 {
display:block;
text-align:center;
margin:2pt 0 8pt 0;
}
/* Download
----------------------------------------------------- */
#Download p {
margin:0 0 9pt 0;
}
#Download img {
float:right;
margin:0;
padding:0 0 9pt 9pt;
}
/* 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%;
}
/* Contact
----------------------------------------------------- */
#researcher {
margin:16pt 0 0 0;
}
#Contact img {
float:right;
margin:0;
padding:0 0 9pt 9pt;
}
#Contact a {
color: #000;
text-decoration: none;
}
#researcher h3 {
margin:0;
}
#researcher span {
font:normal .9em/1.4em serif;
display:block;
float:left;
margin-right:.4em;
}
#city {
clear:left;
}
#locality, .locality {
display: block;
width: 100%;
}
#city:after {
content:",";
}
#email {
clear:left;
}
/* Subsections
----------------------------------------------------- */
#Home, #Introduction, #Download, #Contact {
padding:3em 20px;
}
/* Subsections : Events
----------------------------------------------------- */
#IndividualDetail .ColumnValue {
padding:4pt 0;
}
.ColumnValue p {
font:normal 9pt/11pt sans-serif;
margin:1pt 0 0 18pt;
}
/* Subsections : Gallery
----------------------------------------------------- */
#indivgallery h4 {
margin-bottom:1em;
}
#indivgallery .thumbnail {
margin:0;
float:left;
width:130px;
height:150px;
text-align:center;
}
#indivgallery .thumbnail a {
display:block;
margin:0;
padding:0;
background:none;
}
#indivgallery .thumbnail a img {
margin:0;
padding:0;
border:solid .5pt #000;
}
#indivgallery div.thumbnail span {
font:normal 7pt/9pt sans-serif;
text-align:center;
width:80%;
margin:0 auto;
padding:0;
}
/* 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%;
}
/* Subsections : Pedigree
----------------------------------------------------- */
#pedigree a {
text-decoration:none;
}
.content #pedigree a:link:after, .content #pedigree a:visited:after {
content:"";
}
.pedigreegen {
font:normal 10pt/12pt sans-serif;
list-style:none;
margin:8pt 0 0 0;
padding:0 0 0 20px;
}
.pedigreegen li ol {
list-style:none;
margin-left:16pt;
}
.pedigreegen li ol li ol {
font:normal 9pt/11pt sans-serif;
list-style:decimal;
margin-left:16pt;
}
.pedigreegen li ol li ol li ol.spouselist {
list-style:none;
margin-left:0;
}
.spouselist li.spouse ol {
list-style:decimal;
margin-left:16pt;
}
.spouse a {
font-weight:normal;
font-style:normal;
}
.spouse:before {
content: "+ ";
}
.thisperson {
font-weight:bold;
}
/* Subsections : Ancestors Tree
----------------------------------------------------- */
#tree {
page-break-before:always;
margin:0;
padding:0;
}
#treeContainer {
position:relative;
z-index:1;
}
#treeContainer div.boxbg a:link:after, #treeContainer div.boxbg a:visited:after {
font-size:70%;
font-family:sans-serif;
content:"";
}
.boxbg {
position:absolute;
margin:0;
padding:0;
background:none;
}
#treeContainer div.boxbg span.thumbnail {
display:block;
margin:0 auto;
}
.boxbg a {
position:relative;
z-index:10;
display:block;
font:normal .7em/1.4em sans-serif;
text-align:center;
text-decoration:none;
width:50pt;
padding:5pt 8pt;
margin:5pt 0 0 0;
background-color:#FFF;
border:solid 1pt #000;
}
#treeContainer div.AncCol3 span.thumbnail, #treeContainer div.AncCol4 span.thumbnail {
display:none;
}
.shadow {
display:none;
}
#tree div div.bvline {
position:absolute;
z-index:2;
height:1pt;
margin:0;
padding:0;
background-color:#FFF;
border-bottom:solid .5pt #A7A7A7
}
#tree div div.bhline {
position:absolute;
z-index:2;
width:1pt;
margin:0;
padding:0;
background-color:#FFF;
border-right:solid .5pt #A7A7A7
}
.ghline, .gvline {
display:none;
}
/* Footer
----------------------------------------------------- */
#footer {
width: 100%;
margin: 0;
padding: .1in 0 0 0;
clear: both;
border-top: solid .5pt #000;
}
#user_footer {
float: left;
width: 70%;
}
#user_footer p {
font-style: italic;
}
p#createdate {
float: left;
width: 45%;
font: normal 9pt/10pt sans-serif;
margin: 0;
}
#copyright {
float: right;
width: 4in;
margin: 0;
font: normal 9pt/10pt sans-serif;
text-align: right;
}
#copyright img {
display: none;
}
/* Calendar Styles
-------------------------------------------------------------------------------------------- */
/* Calendar : General */
body#WebCal h1#SiteTitle {
float:left;
font-size:14pt;
line-height:16pt;
padding-bottom:.1in;
}
.calendar {
clear:both;
empty-cells:show;
width:100%;
font-size:14pt;
font-weight:normal;
margin:0;
padding:0;
border:none;
border-collapse:collapse;
}
.calendar thead, .calendar tbody {
border-style:solid;
border-width:2pt 2pt 2pt 2pt;
border-color:#000;
}
.calendar tbody {
border-top:none;
}
.calendar thead tr th {
width:12%;
font-family:sans-serif;
font-size:10pt;
font-weight:bold;
text-align:center;
text-transform:uppercase;
padding:.2em 0 .1em 0;
}
.calendar thead tr th.monthName {
width:100%;
font-size:20pt;
line-height:100%;
text-transform:none;
padding:5pt;
border-width:0;
}
body#WebCal a {
text-decoration:none;
color:#000;
}
.calendar tfoot {
border:none;
}
.calendar tfoot tr td {
font-size:12pt;
font-style:italic;
padding:.7em 5% 1em 5%;
}
/* Calendar : Date Numeral */
.calendar td div.date {
float:right;
display:block;
font-size:16pt;
line-height:100%;
font-weight:bold;
text-align:center;
color:#000;
margin:0 0 0 .5em;
padding:7pt;
}
.calendar td.highlight div.date {
color:#F00;
}
/* Calendar : Date Container */
.calendar tbody tr td {
vertical-align:top;
height:4em;
padding:0;
border-width:1px 0 0 1px;
border-style:solid;
border-color:#999;
}
.calendar tbody tr td:first-child {
border-left:none;
}
.calendar tbody tr:first-child td {
border-top:none;
}
/* Calendar : Date Detail */
.calendar tbody tr td ul {
list-style:none;
font-family:sans-serif;
font-size:8pt;
margin:30pt 0 5pt 0;
padding:0;
}
.calendar tbody tr td ul li {
display:block;
width:92%;
margin:0 4%;
padding:.2em 0 .3em 0;
border-top:dashed .5pt #999;
}
.calendar tbody tr td ul li:first-child {
border:none;
}
.calendar tbody tr td ul li em {
font-style:normal;
color:#000;
}
.calendar tbody tr td ul li span.yearsmarried em {
color:#000;
}
/* 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 {
font-weight:normal;
font-size:12pt;
color:#999;
}
/* Calendar : Full Year */
body#fullyearlinked div.content {
width:963px;
margin:0 auto;
padding:15px 0 2px 2px;
}
body#fullyearlinked table.calendar {
float:left;
width:320px;
height:18em;
border:solid 1px #000;
}
body#fullyearlinked table.calendar thead tr th {
height:2em;
}
body#fullyearlinked table.calendar thead tr th.monthName {
font-size:1.2em;
padding:2px 0;
}
body#fullyearlinked table.calendar tbody tr td {
height:3em;
}