[FM Discuss] pushing the css

Martin Kean Martin.Kean at op.ac.nz
Mon Dec 5 13:27:24 PST 2011 

Awesome!
The book looks great too.
________________________________________
From: discuss-bounces at lists.flossmanuals.net [discuss-bounces at lists.flossmanuals.net] On Behalf Of adam [adam at flossmanuals.net]
Sent: Tuesday, 6 December 2011 12:01 a.m.
To: discuss at lists.flossmanuals.net
Subject: [FM Discuss] pushing the css

hey Fmers

so last week we finished the freedomfone booksprint. Olaf, Laleh and
Lynne were there working on design and tech implementation of design.
all pushed the current booki css a bit further to do some cool stuff.
you can see the results here:
http://objavi.booki.cc/books/freedomfone-en-2011.12.05-10.50.21.pdf

note the use of images for section breaks. achieved by css like this:

#section-1 .objavi-subsection-heading{
        background:#fff
url(http://www.freedomfone.org/booki/images/01_whatisff.png) no-repeat
center center;
}



the entire css is included below for your hackery resuse and inspiration

adam

@font-face{
        src: url("http://www.freedomfone.org/booki/AllumiPtf-Bold.otf");
        font-family:AllumiPtf;
}
body {
   font-family: "fontin sans";
   background: #fff;
   color: #000;
   font-size:12pt;
}

.objavi-chapter{
   color: #000;
   display:none;
}

a {
   text-decoration:none;
   color:#000;
}

h1 .initial{
   color: #000;
   display:none;
}

ol#InsertNote_NoteList{
page-break-before:always;
font-size:8pt;
}

.objavi-subsection{
   display: block;
   page-break-before: always;
}

body .objavi-subsection:first-child{
   page-break-before: avoid;
}

.objavi-subsection .initial {
   color: #000;
   display:none;
}

.objavi-subsection-heading {
   font-size: 20pt;
   text-align: center;
   line-height: 300px;
   font-weight: normal;
}

h1 {
   page-break-before: always;
   font-weight:normal;
        margin-top:10px
}

h2 {
   margin-bottom:-10pt;
   font-weight:normal;
   font-size:15pt;
}

h3 {
   margin-bottom:-10pt;
   font-weight:normal;
   font-size:12pt;
   font-style:italic;
}


table {
   float: none;
}

h1.frontpage{
   page-break-after:always;
   margin-top:70%;
   font-size: 20pt;
   text-align: center;
   page-break-before: avoid;
   max-width: 700pt;
   font-weight: normal;
}

div.copyright{
   padding: 1em;
}
/* TOC ******************************/
table {
   float: none;
}

table.toc {
   font-size: 1.1em;
   width: 95%;
}

table.toc td{
   vertical-align:top
   padding-left: 0.5em;
}

td.chapter {
   padding: 0 0.5em;
   text-align: right;
}

table.toc td.pagenumber {
   text-align: right;
   vertical-align:bottom;
}

td.section {
   padding-top: 1.1em;
   font-weight: bold;
}
/* End TOC **************************/


p, ul, ol {
   page-break-inside: avoid;
}

pre, code, tt {
}

pre {
   max-width:700px;
   overflow: hidden;
}

img {
   max-width: 500px;
   height: auto;
}

.objavi-no-page-break {
   page-break-inside: avoid;
}

.unseen{
   z-index: -66;
   margin-left: -1000pt;
}

body{
        font-size:12pt;
        color:#000;
        font-family:"Fontin Sans";
        line-height:16pt;
}
sup{
        vertical-align:text-top;
        font-size:0.7em;
}
a{
        color:#000 !important;
        text-decoration:none
}

h1, h2, h3{
        color:#666;
        margin:0;
        padding:0;
        font-weight:normal !important;
        text-decoration:none !important;
        line-height:normal;
        font-family:AllumiPtf !important;
        text-transform:uppercase;

}
h1{
        font-size:24.3pt;
}
h1+p{
        padding-top:20pt;
        margin-top:0;
}
h2{
        font-size:14pt;
        padding-top:20pt;
}
h2+p{
        padding-top:10pt;
}
h3{
        font-size:9pt;
        padding-bottom:5pt;
}
h3+p{
        margin-top:0;
}
p+h3{
        padding-top:10pt;
}
ul{
        list-style-image:url(http://www.freedomfone.org/booki/images/bullet.png);
        list-style-position:outside;
        margin-left:-25px;
}
ol{
        margin-left:-25px;
}
li{
        padding-left:5.5mm;
}
.starred{
        padding-left:50px;
        background-image:url(http://www.freedomfone.org/booki/images/star.png);
        background-repeat:no-repeat;
        background-position:center left;
        font-weight:bold;
        min-height:40px;
}
.speechBox{
        padding:5mm;
        padding-top:0;
        background:#ebebeb
url(http://www.freedomfone.org/booki/images/boxBottom.png) no-repeat
bottom right;
        padding-bottom:60px;
        margin-bottom:-55px;
}
.breakPage{
        page-break-before:always;
}
.speechBox:before{
        background:#ebebeb
url(http://www.freedomfone.org/booki/images/boxTop.png) no-repeat top left;
        height:44px;
        content:" ";
        display:block;
        margin:-5mm;
        margin-bottom:5mm;
}
.objavi-subsection-heading{
        height:860px;
        font-size:0px;
        display:block;
}
#section-1 .objavi-subsection-heading{
        background:#fff
url(http://www.freedomfone.org/booki/images/01_whatisff.png) no-repeat
center center;
}
#section-2 .objavi-subsection-heading{
        background:#fff
url(http://www.freedomfone.org/booki/images/02_realworld.png) no-repeat
center center;
}
#section-3 .objavi-subsection-heading{
        background:#fff
url(http://www.freedomfone.org/booki/images/03_scenarios.png) no-repeat
center center;
}
#section-4 .objavi-subsection-heading{
        background:#fff
url(http://www.freedomfone.org/booki/images/04_creatingservice.png)
no-repeat center center;
}
#section-5 .objavi-subsection-heading{
        background:#fff
url(http://www.freedomfone.org/booki/images/05_settingup.png) no-repeat
center center;
}
#section-6 .objavi-subsection-heading{
        background:#fff
url(http://www.freedomfone.org/booki/images/06_techstuff.png) no-repeat
center center;
}
#section-7 .objavi-subsection-heading{
        background:#fff
url(http://www.freedomfone.org/booki/images/07_gettinghelp.png)
no-repeat center center;
}
#section-8 .objavi-subsection-heading{
        background:#fff
url(http://www.freedomfone.org/booki/images/08_troubleshooting.png)
no-repeat center center;
}
#section-9 .objavi-subsection-heading{
        background:#fff
url(http://www.freedomfone.org/booki/images/09_appendices.png) no-repeat
center center;
}
#section-10 .objavi-subsection-heading{
        background:#fff
url(http://www.freedomfone.org/booki/images/10_notes.png) no-repeat
center center;
}
.page{
        font-size:15pt;
        color:#666;
        font-weight:bold;

}



--

--
Adam Hyde
Founder, FLOSS Manuals
Project Manager, Booki
Book Sprint Facilitator
mobile :+ 49 177 4935122
identi.ca : @eset
booki.flossmanuals.net : @adam

http://www.flossmanuals.net
http://www.booki.cc
http://www.booksprints.net

_______________________________________________
Discuss mailing list
Discuss at lists.flossmanuals.net
http://lists.flossmanuals.net/listinfo.cgi/discuss-flossmanuals.net

______________________________________________________________________________

This email has been scrubbed for your protection by SMX.
For more information visit http://smxemail.com
______________________________________________________________________________

More information about the Discuss mailing list