forked from amazingfate/help
I have worked in a new implementation of the Help online. The strategy was to batch "flatten" all XHP into HTML files with an offline transformation using xsltproc. (by "flatten", I mean resolve all embeds in XHP files) see http://vm173.documentfoundation.org This way all displayed files are now HTML with minimal javascript. No more on-line XSLT transformation and their associate issues (delays) and poor debug. Advantages: 1) preserve all XHP files as-is, authoring tools, DTD. 2) preserve current translation workflow 3) all files turned to HTML static, with minimum Javascript 4) much faster load times, browser cache used. 5) Honors parameters &System and &DbPAR 6) URL bookmarking in browser (Ctrl-D) 7) Page navigation back and forth with browser buttons 8) preserve current HC2 in LibreOffice (see 1). 9) resolved <switchinline><caseinline> for &System and &DbPAR (aka module). 10) maintained Fabio's bookmark search solution. 11) index-able by search engines (XHP files were unknown to robots). 12) pages can be directly accessed: e.g. http://localhost/text/scalc/01/04060106.html?DbPAR=CALC#bm_id3153114 13) hold Google search snippet in TopRight area Disadvantages (Most are further work): 1) issue with offline use (file://path/to/pages/) To do: 1) batch create html of localized pages, localized bookmarks 2) Resolve missing images paths (Icons are in core/icon-themes/) 3) Resolve protocol file:// for offline use (hit CORS guideline restriction for browsers) 4) provide better layout for bookmarks in the left pane 5) work on web CSS to make it beautiful 6) Clean up the XSLT filter, set a debug param. 7) more Change-Id: I6de74037dbb59da872153f853237afd75b47c917 Reviewed-on: https://gerrit.libreoffice.org/38220 Reviewed-by: Olivier Hallot <olivier.hallot@edx.srv.br> Tested-by: Olivier Hallot <olivier.hallot@edx.srv.br>
255 lines
4.4 KiB
CSS
255 lines
4.4 KiB
CSS
/*
|
|
* This file is part of the LibreOffice project.
|
|
*
|
|
* This Source Code Form is subject to the terms of the Mozilla Public
|
|
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
|
* file, You can obtain one at http://mozilla.org/MPL/2.0/.
|
|
*
|
|
* This file incorporates work covered by the following license notice:
|
|
*
|
|
* Licensed to the Apache Software Foundation (ASF) under one or more
|
|
* contributor license agreements. See the NOTICE file distributed
|
|
* with this work for additional information regarding copyright
|
|
* ownership. The ASF licenses this file to you under the Apache
|
|
* License, Version 2.0 (the "License"); you may not use this file
|
|
* except in compliance with the License. You may obtain a copy of
|
|
* the License at http://www.apache.org/licenses/LICENSE-2.0 .
|
|
*/
|
|
|
|
/*
|
|
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
|
|
+ LIBREOFFICE HELP IN BROWSER +
|
|
+ DEFAULT STYLESHEET +
|
|
+ WESTERN LANGUAGES +
|
|
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
|
|
|
|
*/
|
|
|
|
body, p, h1, h2, h3, h4, h5, h6, .listitem, .listitemintable, .tablecontent, .tablecontentintable {
|
|
font-family: "Segoe UI", Ubuntu, Cantarell, "Noto Sans", "DejaVu Sans", "Lucida Sans Unicode", "Helvetica Neue", Helvetica, Tahoma, sans-serif;
|
|
}
|
|
|
|
pre, .code, .codeintable, .example, .exampleintable, .literal, .literalintable, .path, .pathintable {
|
|
font-family: Menlo, Consolas, "DejaVu Sans Mono", "Nimbus Mono L", "Lucida Sans Typewriter", "Courier New", Courier, Monaco, monospace;
|
|
margin-top: 1pt;
|
|
margin-bottom: 1pt;
|
|
}
|
|
|
|
.acronym {
|
|
font-weight: bold;
|
|
}
|
|
|
|
.related {
|
|
font-weight: bold;
|
|
margin-top: 20pt;
|
|
border-top: 1px solid black;
|
|
}
|
|
|
|
.emph, .menuitem, .keycode {
|
|
font-weight: bold;
|
|
}
|
|
|
|
.tablehead, .tableheadintable {
|
|
font-weight: bold;
|
|
margin-top: 0px;
|
|
background: #CCF4C6;
|
|
text-align: center;
|
|
}
|
|
|
|
.howtogetheader {
|
|
font-weight: bold;
|
|
border: 1px solid #999999;
|
|
background: #FFFFFF;
|
|
padding: 3px;
|
|
}
|
|
|
|
h1, h2, h3, h4, h5, h6 {
|
|
margin-bottom: 5pt;
|
|
color: #18A303;
|
|
}
|
|
|
|
p, td {
|
|
font-size: 11pt;
|
|
margin: 2px 2px 2px 2px;
|
|
}
|
|
|
|
h1 {
|
|
font-size: 18pt;
|
|
border-bottom: 5px solid #18A303;
|
|
padding-bottom: 6px;
|
|
margin-bottom: 6px;
|
|
}
|
|
|
|
h2 {
|
|
font-size: 14pt;
|
|
}
|
|
|
|
h3 {
|
|
font-size: 12pt;
|
|
}
|
|
|
|
h4, h5, h6 {
|
|
font-size: 11pt;
|
|
}
|
|
|
|
.avis {
|
|
background-color: #FFCCFF;
|
|
}
|
|
|
|
.relatedtopics {
|
|
font-weight: normal;
|
|
}
|
|
|
|
.relatedbody {
|
|
margin-top: 2px;
|
|
margin-bottom: 2px;
|
|
margin-left: 5px;
|
|
}
|
|
|
|
.howtoget {
|
|
background: #CCF4C6;
|
|
}
|
|
|
|
.howtogetbody {
|
|
background: #CCF4C6;
|
|
margin: 0px;
|
|
}
|
|
|
|
.wide {
|
|
width: 100%;
|
|
}
|
|
|
|
.topalign {
|
|
vertical-align: top;
|
|
border: 1px;
|
|
}
|
|
|
|
.bug {
|
|
color: red;
|
|
border: 1px solid red;
|
|
}
|
|
|
|
.debug {
|
|
border: 1px solid black;
|
|
padding: 3px;
|
|
display: show;
|
|
}
|
|
|
|
/* Basic code syntax highlight */
|
|
.identifier, .unknown {
|
|
color: green;
|
|
}
|
|
|
|
.keyword {
|
|
color: blue;
|
|
}
|
|
|
|
.comment {
|
|
color: gray;
|
|
}
|
|
|
|
.number, .string {
|
|
color: red;
|
|
}
|
|
|
|
.operator, .parameter {
|
|
color: black;
|
|
}
|
|
|
|
.hotlink {
|
|
color: blue;
|
|
}
|
|
|
|
.infopage {
|
|
color: green;
|
|
font-size: 16pt;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.topmenu {
|
|
font-size: 12pt;
|
|
font-weight: bold;
|
|
padding: 1px;
|
|
border: solid 1px #18A303;
|
|
}
|
|
|
|
.indexlink {
|
|
font-size: 10pt;
|
|
margin-top: 2px;
|
|
margin-bottom: 2px;
|
|
}
|
|
|
|
#DisplayArea {
|
|
position: fixed;
|
|
bottom: 5px;
|
|
right: 5px;
|
|
left: 30%;
|
|
top: 15%;
|
|
overflow: auto;
|
|
border: solid 1px;
|
|
padding: 10px;
|
|
}
|
|
|
|
#BottomLeft {
|
|
position: fixed;
|
|
bottom: 5px;
|
|
left: 5px;
|
|
overflow: auto;
|
|
right: 70%;
|
|
top: 15%;
|
|
border-top: solid 1px;
|
|
border-left: solid 1px;
|
|
border-bottom: solid 1px;
|
|
padding: 10px;
|
|
}
|
|
|
|
#TopRight {
|
|
border-top: solid 1px;
|
|
border-left: solid 1px;
|
|
border-right: solid 1px;
|
|
position: fixed;
|
|
right: 5px;
|
|
top: 5px;
|
|
left: 50%;
|
|
bottom: 85%;
|
|
}
|
|
|
|
#TopLeft {
|
|
border-top: solid 1px;
|
|
border-left: solid 1px;
|
|
border-right: solid 1px;
|
|
left: 5px;
|
|
position: fixed;
|
|
top: 5px;
|
|
bottom: 85%;
|
|
}
|
|
|
|
#NavigationHistory {
|
|
top: 5px;
|
|
float: right;
|
|
text-align: right;
|
|
color: #18A303;
|
|
font-weight: 700;
|
|
font-size: 0.625rem;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.mediabutton {
|
|
background-color: cyan;
|
|
}
|
|
|
|
.tintro {
|
|
color: white;
|
|
background-color: green;
|
|
font-family: Arial;
|
|
font-weight: bold;
|
|
font-size: 24pt;
|
|
border: 1px solid black;
|
|
padding-bottom: 6px;
|
|
margin-bottom: 6px;
|
|
}
|
|
|
|
.embedded {
|
|
border-right: 10px solid red;
|
|
}
|