mbutterick
/
pollen-tfl
Archived
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

adjust styles

Browse Source
master
Matthew Butterick 7 years ago
parent 75221f19f6
commit c1e382cffc
2 changed files with 54 additions and 52 deletions
Show Stats Download Patch File Download Diff File

79
styles.css.pp
Unescape Escape View File

@ -218,8 +218,6 @@ margin-right: ◊|default-margin|;
◊(define content-width "29rem") ◊(define content-width "29rem")
#content { #content {
border-top: 0.3rem solid ◊|content-rule-color|;
border-bottom: 0.3rem solid ◊|content-rule-color|;
width: ◊|content-width|; width: ◊|content-width|;
padding: 3rem 0 8rem 0; padding: 3rem 0 8rem 0;
} }
@ -600,65 +598,82 @@ margin-left: ◊(+ single-quote-width)em;
◊(define nav-width "3rem") ◊(define nav-width "3rem")
◊(define big-nav-width "8rem") ◊(define big-nav-width "8rem")
◊(define border-width "0px")
.nav-inner { #top-stripe {
border: solid ◊border-width grey; position: absolute;
margin: 0;
padding: 0;
left: 2rem;
width: 38rem;
border-bottom: 0.2rem solid ◊|content-rule-color|;
}
#prev .nav-inner,
#next .nav-inner {
position: fixed; position: fixed;
} }
#bottom .nav-inner { #bottom .nav-inner {
border-top: 0.2rem solid ◊|content-rule-color|;
opacity: 0.95; opacity: 0.95;
position: absolute; position: absolute;
left: 2rem;
width: 38rem;
} }
#bottom a {
#navtable #left .xref:before { border-bottom: inherit;
content: "← ";
} }
#navtable #right .xref:after {
content: " →";
}
#navtable {
margin: 0; #left a.xref:before {
height: 100%; content: "← ";
width: ◊|content-width|;
} }
#navtable td { #right a.xref:after {
vertical-align: top; ◊; otherwise vertical centering happens content: " →";
padding: 0; ◊; to allow links to fill whole td
} }
#navtable a.xref { #bottom a.xref {
display: block; display: block;
text-align: center;
box-sizing: content-box; ◊; must override border-box setting here box-sizing: content-box; ◊; must override border-box setting here
padding: 0.3rem; padding: 0.4rem;
padding-bottom: 0.6rem; padding-bottom: 0.6rem;
height: 100%; height: 2rem;
background: none; background: none;
color: black; color: black;
line-height: 1.1; line-height: 1.1;
font-size: 85%; font-size: 85%;
opacity: 0.5; ◊; this works better than straight gray, which Webkit renders heavy opacity: 0.5; ◊; this works better than straight gray, which Webkit renders heavy
transition: opacity 0.2s;
} }
#navtable a.xref:hover { #bottom .span {
opacity: 1; display: inline-block,
width: 12%;
} }
#navtable td:hover, #tfl-fonts-nav tr + tr td:hover { #bottom span + span {
◊make-css-background-gradient[`("#ffffff" ,anchor-hover-color) '("17%" "100%") #:radial #t] border-left: 1px solid gray;
} }
#navtable a.xref, #navtable a.xref:hover { #bottom #left,
transition: opacity 0.2s; #bottom #right {
width: 32%;
} }
#bottom a.xref:hover {
opacity: 1;
}
#bottom a.xref:hover,
#tfl-fonts-nav tr + tr td:hover {
◊make-css-background-gradient[`("#ffffff" ,anchor-hover-color) '("17%" "100%") #:radial #t]
}
div.pdf-thumbnail { div.pdf-thumbnail {
font-family: "concourse-c6"; font-family: "concourse-c6";
@ -758,16 +773,6 @@ width: ◊|nav-width|;
} }
#bottom .nav-inner {
left: ◊|body-left-margin|;
right: ◊|default-margin|;
max-width:1000px; ◊; same as body
min-width:520px; ◊; same as body
}
#bottom a {
border-bottom: inherit;
}

27
template.html.p
Unescape Escape View File

@ -136,15 +136,14 @@ document.write('<link rel="stylesheet" type="text/css" media="all" href="/firefo
◊if[(not toolbar?) ""]{ ◊if[(not toolbar?) ""]{
◊div[#:class "nav-outer" #:id "bottom"]{ ◊div[#:class "nav-outer" #:id "bottom"]{
◊div[#:class "nav-inner"]{ ◊div[#:class "nav-inner"]{
◊table[#:id "navtable"]{ ◊span[#:style "width:33%"]{◊xref["/index.html"]{TFL home}}
◊tr{ ◊span[#:style "width:34%"]{◊xref["/toc.html"]{Read excerpts}}
◊td{◊xref["/index.html"]{TFL home}} ◊span[#:style "width:33%"]{◊xref[buy-url]{get the book}}}}}})
◊td{◊xref["/toc.html"]{Read excerpts}}
◊td{◊xref[buy-url]{get the book}}}}}}}})
◊(define (default-body) ◊(define (default-body)
◊body{ ◊; use this body for all other pages ◊body{ ◊; use this body for all other pages
◊div[#:id "top-stripe"]{}
◊div[#:id "content"]{ ◊div[#:id "content"]{
◊doc ◊doc
◊(gap 1) ◊(gap 1)
@ -158,15 +157,13 @@ document.write('<link rel="stylesheet" type="text/css" media="all" href="/firefo
(empty-string) (empty-string)
◊div[#:class "nav-outer" #:id "bottom"]{ ◊div[#:class "nav-outer" #:id "bottom"]{
◊div[#:class "nav-inner"]{ ◊div[#:class "nav-inner"]{
◊table[#:id "navtable"]{ ◊span[#:id "left"]{◊(if (eq? here 'toc.html)
◊tr{ ◊xref["index.html"]{home}
◊(if (eq? here 'toc.html) ◊xref{◊(select 'title previous-page)})}
(empty-string) ◊span{◊xref["/index.html"]{TFL home}}
◊td[#:id "left" #:style (format "width: ~a%" side-cell-width)]{◊xref{◊(select 'title previous-page)}}) ◊span{◊xref[buy-url]{get the book}}
◊td[#:style "width:10%"]{◊xref["/index.html"]{TFL home}} ◊span{◊xref["/fonts.html"]{get the fonts}}
◊td[#:style (format "width:~a%" center-cell-width)]{◊xref[buy-url]{get the book}} ◊(if next-page ◊span[#:id "right"]{◊xref{◊(select 'title next-page)}} "")}})})
◊td[#:style (format "width:~a%" center-cell-width)]{◊xref["/fonts.html"]{get the fonts}}
◊(if next-page ◊td[#:id "right" #:style (format "width: ~a%" side-cell-width)]{◊xref{◊(select 'title next-page)}} "")}}}})})
◊(->html ◊(->html
(body (body
@ -176,4 +173,4 @@ document.write('<link rel="stylesheet" type="text/css" media="all" href="/firefo
</html> </html>
<!-- © 2015 Matthew Butterick · website made with Pollen (pollenpub.com) --> <!-- © 2008–2017 Matthew Butterick · website made with Pollen (pollenpub.com) -->