Mercurial > octave
diff doc/interpreter/octave.css @ 21986:9e992b9ffc5f
doc/interpreter/octave.css: improve HTML manual readability on small screens (patch #9031).
author | Oliver Heimlich <oheim@posteo.de> |
---|---|
date | Tue, 28 Jun 2016 11:10:12 +0200 |
parents | 15517574276a |
children | 02216516bbfe |
line wrap: on
line diff
--- a/doc/interpreter/octave.css Mon Jun 27 16:27:07 2016 -0700 +++ b/doc/interpreter/octave.css Tue Jun 28 11:10:12 2016 +0200 @@ -18,6 +18,7 @@ <http://www.gnu.org/licenses/>. */ +/* Import web font Roboto Condensed, Font Library Version 2015-06-06 */ @font-face { font-family: 'Roboto Condensed'; src: local('Roboto Condensed'), url('https://fontlibrary.org/assets/fonts/roboto-condensed/71405335c70332d94afd24ae4f06c9b2/4b8b4b377e8cb358cf886d13c7bb287c/RobotoCondensedBold.ttf') format('truetype'); font-weight: bold; font-style: normal; } @@ -30,37 +31,82 @@ @font-face { font-family: 'Roboto Condensed'; src: local('Roboto Condensed'), url('https://fontlibrary.org/assets/fonts/roboto-condensed/71405335c70332d94afd24ae4f06c9b2/b0b1845ecce8ab6a503971e808a8409c/RobotoCondensedRegular.ttf') format('truetype'); font-weight: normal; font-style: normal; } + +/* Import web font Fantasque Sans Mono, Font Library Version 2016-04-05 */ @font-face { font-family: 'Fantasque Sans Mono'; src: local('Fantasque Sans Mono'), - url('https://fontlibrary.org/assets/fonts/fantasque-sans-mono/db52617ba875d08cbd8e080ca3d9f756/b145f0e884b2da8f1b112d26e7cefd3d/FantasqueSansMonoBold.ttf') format('truetype'); + url('https://fontlibrary.org/assets/fonts/fantasque-sans-mono/b0cbb25e73a9f8354e96d89524f613e7/a46033d3a07d9385620dc83b7655203f/FantasqueSansMonoBold.ttf') format('truetype'); font-weight: bold; font-style: normal; } @font-face { font-family: 'Fantasque Sans Mono'; src: local('Fantasque Sans Mono'), - url('https://fontlibrary.org/assets/fonts/fantasque-sans-mono/db52617ba875d08cbd8e080ca3d9f756/49319cbd53210c32099631ac89b1e70a/FantasqueSansMonoBoldItalic.ttf') format('truetype'); + url('https://fontlibrary.org/assets/fonts/fantasque-sans-mono/b0cbb25e73a9f8354e96d89524f613e7/b0683ef4c834908aa372ec78dea42349/FantasqueSansMonoBoldItalic.ttf') format('truetype'); font-weight: bold; font-style: italic; } @font-face { font-family: 'Fantasque Sans Mono'; src: local('Fantasque Sans Mono'), - url('https://fontlibrary.org/assets/fonts/fantasque-sans-mono/db52617ba875d08cbd8e080ca3d9f756/5c07fe59e84e4594ffa87ae1a72b130d/FantasqueSansMonoItalic.ttf') format('truetype'); + url('https://fontlibrary.org/assets/fonts/fantasque-sans-mono/b0cbb25e73a9f8354e96d89524f613e7/b78d0a48e4443f797e8d45dcf97594f7/FantasqueSansMonoItalic.ttf') format('truetype'); font-weight: normal; font-style: italic; } @font-face { font-family: 'Fantasque Sans Mono'; src: local('Fantasque Sans Mono'), - url('https://fontlibrary.org/assets/fonts/fantasque-sans-mono/db52617ba875d08cbd8e080ca3d9f756/cc70dc22137e92aaef169e1de38a6ec7/FantasqueSansMonoRegular.ttf') format('truetype'); + url('https://fontlibrary.org/assets/fonts/fantasque-sans-mono/b0cbb25e73a9f8354e96d89524f613e7/f3fdc4f0f26e4431f54e8b552d55480c/FantasqueSansMonoRegular.ttf') format('truetype'); font-weight: normal; font-style: normal; } -body > * { max-width: 42em; } -div.header { max-width: 100%; } -hr { margin-left: 0; border: none; border-top: 3px double #657b83; } -div.header, div.float-caption { color: #657b83; } -ul, ol { max-width: 39.5em; padding-left: 2.5em; } -div.example, div.display, div.indentedblock, div.smalldisplay, div.lisp, div.smallindentedblock, div.smallexample, div.smalllisp { max-width: 38.8em; margin-left: 3.2em; } -blockquote { margin-left: 3.2em; margin-right: 3.2em; max-width: 35.6em; } -body, span.roman { font-family: 'Roboto Condensed', sans-serif; } -body { padding-left: 7.5em; padding-right: 7.5em; } -h1, h2, h3, h4, h5, pre.menu-comment { font-family: 'Roboto Condensed', serif; text-align: left !important; } -div.float table, img { margin-left: auto; margin-right: auto; } -div.float table { width: 38em; } -div.float table, div.float th { border-collapse: collapse; border-top: 1px solid black; border-bottom: 1px solid black; } -div.float th, div.float td { padding: 0.5em; } -dd > p:first-child { margin-top: 0; } -a { color: #268bd2; } -a:visited { color: #d33682; } -code, kbd, samp, tt { font-family: 'Fantasque Sans Mono', monospace; padding: 0 0.1em; font-style: italic; } -pre.example, pre.smallexample, pre.verbatim { font-family: 'Fantasque Sans Mono', monospace; } -pre.example { background-color: #fdf6e3; color: #657b83; padding: 0.5em; } + +/* Use custom fonts */ +code, kbd, samp, tt, pre { font-family: 'Fantasque Sans Mono', monospace; } +code, kbd, samp, tt { font-style: italic; padding: 0 0.1ex; /* slightly increase margin to surrounding text */ } +body, .sansserif { font-family: 'Roboto Condensed', sans-serif; } +h1, h2, h3, h4, h5, .menu-comment, .roman, .menu-preformatted { font-family: 'Roboto Condensed', serif; } + +/* +Use colors from the solarized color theme (sparsely), +the main text will remain in default colors for optimal readability (black on white). +*/ +pre.example, .header, .float-caption, hr +{ + /* base00 ~ body text in light solarized theme */ + color: #657b83; + border-color: #657b83; +} +pre.example +{ + /* base3 ~ background color in light solarized theme */ + background-color: #fdf6e3; + padding: 0.5em; +} +a { color: #268bd2; /* blue */ } +a:visited { color: #d33682; /* magenta */ } + +/* Center floating tables and images */ +.float table, .float img, .float object { margin-left: auto; margin-right: auto; } + +/* Decrease table width, but not on small screens */ +.float table { max-width: 38em; } + +/* Use horizontal lines: above/below tables and after table headers (Chicago Style) */ +.float table, .float th { border-collapse: collapse; border-top: 1px solid black; border-bottom: 1px solid black; } +.float th, .float td { padding: 0.5em; } + +/* Use horizontal ruler with double lines */ +hr { border-width: 0; border-top-width: 3px; border-style: double; } + +/* Smaller gap between subsequent @group blocks */ .example { margin-bottom: 1em; } .example + .example { margin-top: -0.5em } + +/* Smaller gap between definition and its description */ +dd > p:first-child { margin-top: 0.5em; } + +/* Limit maximum body width such that text is easier to read */ +body { max-width: 42em; margin-left: 0.5em; margin-right: 0.5em; } + +/* On small screens don't indent the code examples to prevent overflow */ +div.example { margin-left: auto; max-width: 38.8em; } + +/* +Use left margin such that text is easier to read, +but don't sacrifice space on small screens. +*/ +@media screen and (min-width: 43em) +{ + /* Smooth transition for screens between 43em and 57em */ + body { margin-left: auto; margin-right: auto; } + @media (min-width: 57em) + { + body { margin-left: 7.5em; } + } +}