[CHG] ws doc: set right section against a dark background

This commit is contained in:
Xavier Morel 2014-11-27 16:14:04 +01:00
parent 15d87a1732
commit 2cfd7182cc
3 changed files with 527 additions and 16 deletions

View File

@ -6808,11 +6808,405 @@ td.field-body > ul {
float: left;
clear: left;
}
.stripe .section > .force-right {
padding-left: 1em;
padding-right: 1em;
}
.stripe .section > .force-right,
.stripe .section > [class*=highlight] {
float: none;
clear: none;
margin-left: 50%;
width: 50%;
color: #eeeeee;
}
.stripe .section > .force-right a,
.stripe .section > [class*=highlight] a {
color: #d9a8cc;
}
.stripe .section > .force-right code,
.stripe .section > [class*=highlight] code,
.stripe .section > .force-right .literal,
.stripe .section > [class*=highlight] .literal {
color: #f9f2f4;
background-color: #555555;
}
.stripe .section > .force-right:not(.highlight-json) .highlight,
.stripe .section > [class*=highlight]:not(.highlight-json) .highlight {
border-bottom-color: #777777;
}
.stripe .section > .force-right.admonition,
.stripe .section > [class*=highlight].admonition {
margin-left: 51%;
width: 49%;
border-top-color: #777777;
border-bottom-color: #777777;
border-right-color: #777777;
}
.stripe .section > .force-right pre,
.stripe .section > [class*=highlight] pre {
padding: 0;
margin: 10px;
background: none;
border: none;
}
.stripe .section > .force-right .highlight,
.stripe .section > [class*=highlight] .highlight {
border-color: #555555;
border-style: solid;
border-width: 1px 0;
color: #cccccc;
background: none;
/* Line Numbers */
/* Comment */
/* Error */
/* Generic */
/* Keyword */
/* Literal */
/* Name */
/* Operator */
/* Other */
/* Punctuation */
/* Comment.Multiline */
/* Comment.Preproc */
/* Comment.Single */
/* Comment.Special */
/* Generic.Deleted */
/* Generic.Emph */
/* Generic.Error */
/* Generic.Heading */
/* Generic.Inserted */
/* Generic.Output */
/* Generic.Prompt */
/* Generic.Strong */
/* Generic.Subheading */
/* Generic.Traceback */
/* Keyword.Constant */
/* Keyword.Declaration */
/* Keyword.Namespace */
/* Keyword.Pseudo */
/* Keyword.Reserved */
/* Keyword.Type */
/* Literal.Date */
/* Literal.Number */
/* Literal.String */
/* Name.Attribute */
/* Name.Builtin */
/* Name.Class */
/* Name.Constant */
/* Name.Decorator */
/* Name.Entity */
/* Name.Exception */
/* Name.Function */
/* Name.Label */
/* Name.Namespace */
/* Name.Other */
/* Name.Property */
/* Name.Tag */
/* Name.Variable */
/* Operator.Word */
/* Text.Whitespace */
/* Literal.Number.Float */
/* Literal.Number.Hex */
/* Literal.Number.Integer */
/* Literal.Number.Oct */
/* Literal.String.Backtick */
/* Literal.String.Char */
/* Literal.String.Doc */
/* Literal.String.Double */
/* Literal.String.Escape */
/* Literal.String.Heredoc */
/* Literal.String.Interpol */
/* Literal.String.Other */
/* Literal.String.Regex */
/* Literal.String.Single */
/* Literal.String.Symbol */
/* Name.Builtin.Pseudo */
/* Name.Variable.Class */
/* Name.Variable.Global */
/* Name.Variable.Instance */
/* Literal.Number.Integer.Long */
}
.stripe .section > .force-right .highlight .lineno,
.stripe .section > [class*=highlight] .highlight .lineno {
color: #586e75;
}
.stripe .section > .force-right .highlight .c,
.stripe .section > [class*=highlight] .highlight .c {
color: #586e75;
}
.stripe .section > .force-right .highlight .err,
.stripe .section > [class*=highlight] .highlight .err {
color: #cccccc;
}
.stripe .section > .force-right .highlight .g,
.stripe .section > [class*=highlight] .highlight .g {
color: #cccccc;
}
.stripe .section > .force-right .highlight .k,
.stripe .section > [class*=highlight] .highlight .k {
color: #859900;
}
.stripe .section > .force-right .highlight .l,
.stripe .section > [class*=highlight] .highlight .l {
color: #cccccc;
}
.stripe .section > .force-right .highlight .n,
.stripe .section > [class*=highlight] .highlight .n {
color: #cccccc;
}
.stripe .section > .force-right .highlight .o,
.stripe .section > [class*=highlight] .highlight .o {
color: #859900;
}
.stripe .section > .force-right .highlight .x,
.stripe .section > [class*=highlight] .highlight .x {
color: #cb4b16;
}
.stripe .section > .force-right .highlight .p,
.stripe .section > [class*=highlight] .highlight .p {
color: #cccccc;
}
.stripe .section > .force-right .highlight .cm,
.stripe .section > [class*=highlight] .highlight .cm {
color: #586e75;
}
.stripe .section > .force-right .highlight .cp,
.stripe .section > [class*=highlight] .highlight .cp {
color: #859900;
}
.stripe .section > .force-right .highlight .c1,
.stripe .section > [class*=highlight] .highlight .c1 {
color: #586e75;
}
.stripe .section > .force-right .highlight .cs,
.stripe .section > [class*=highlight] .highlight .cs {
color: #859900;
}
.stripe .section > .force-right .highlight .gd,
.stripe .section > [class*=highlight] .highlight .gd {
color: #2aa198;
}
.stripe .section > .force-right .highlight .ge,
.stripe .section > [class*=highlight] .highlight .ge {
color: #cccccc;
font-style: italic;
}
.stripe .section > .force-right .highlight .gr,
.stripe .section > [class*=highlight] .highlight .gr {
color: #dc322f;
}
.stripe .section > .force-right .highlight .gh,
.stripe .section > [class*=highlight] .highlight .gh {
color: #cb4b16;
}
.stripe .section > .force-right .highlight .gi,
.stripe .section > [class*=highlight] .highlight .gi {
color: #859900;
}
.stripe .section > .force-right .highlight .go,
.stripe .section > [class*=highlight] .highlight .go {
color: #cccccc;
}
.stripe .section > .force-right .highlight .gp,
.stripe .section > [class*=highlight] .highlight .gp {
color: #cccccc;
}
.stripe .section > .force-right .highlight .gs,
.stripe .section > [class*=highlight] .highlight .gs {
color: #cccccc;
font-weight: bold;
}
.stripe .section > .force-right .highlight .gu,
.stripe .section > [class*=highlight] .highlight .gu {
color: #cb4b16;
}
.stripe .section > .force-right .highlight .gt,
.stripe .section > [class*=highlight] .highlight .gt {
color: #cccccc;
}
.stripe .section > .force-right .highlight .kc,
.stripe .section > [class*=highlight] .highlight .kc {
color: #cb4b16;
}
.stripe .section > .force-right .highlight .kd,
.stripe .section > [class*=highlight] .highlight .kd {
color: #268bd2;
}
.stripe .section > .force-right .highlight .kn,
.stripe .section > [class*=highlight] .highlight .kn {
color: #859900;
}
.stripe .section > .force-right .highlight .kp,
.stripe .section > [class*=highlight] .highlight .kp {
color: #859900;
}
.stripe .section > .force-right .highlight .kr,
.stripe .section > [class*=highlight] .highlight .kr {
color: #268bd2;
}
.stripe .section > .force-right .highlight .kt,
.stripe .section > [class*=highlight] .highlight .kt {
color: #dc322f;
}
.stripe .section > .force-right .highlight .ld,
.stripe .section > [class*=highlight] .highlight .ld {
color: #cccccc;
}
.stripe .section > .force-right .highlight .m,
.stripe .section > [class*=highlight] .highlight .m {
color: #2aa198;
}
.stripe .section > .force-right .highlight .s,
.stripe .section > [class*=highlight] .highlight .s {
color: #2aa198;
}
.stripe .section > .force-right .highlight .na,
.stripe .section > [class*=highlight] .highlight .na {
color: #cccccc;
}
.stripe .section > .force-right .highlight .nb,
.stripe .section > [class*=highlight] .highlight .nb {
color: #b58900;
}
.stripe .section > .force-right .highlight .nc,
.stripe .section > [class*=highlight] .highlight .nc {
color: #268bd2;
}
.stripe .section > .force-right .highlight .no,
.stripe .section > [class*=highlight] .highlight .no {
color: #cb4b16;
}
.stripe .section > .force-right .highlight .nd,
.stripe .section > [class*=highlight] .highlight .nd {
color: #268bd2;
}
.stripe .section > .force-right .highlight .ni,
.stripe .section > [class*=highlight] .highlight .ni {
color: #cb4b16;
}
.stripe .section > .force-right .highlight .ne,
.stripe .section > [class*=highlight] .highlight .ne {
color: #cb4b16;
}
.stripe .section > .force-right .highlight .nf,
.stripe .section > [class*=highlight] .highlight .nf {
color: #268bd2;
}
.stripe .section > .force-right .highlight .nl,
.stripe .section > [class*=highlight] .highlight .nl {
color: #cccccc;
}
.stripe .section > .force-right .highlight .nn,
.stripe .section > [class*=highlight] .highlight .nn {
color: #cccccc;
}
.stripe .section > .force-right .highlight .nx,
.stripe .section > [class*=highlight] .highlight .nx {
color: #cccccc;
}
.stripe .section > .force-right .highlight .py,
.stripe .section > [class*=highlight] .highlight .py {
color: #cccccc;
}
.stripe .section > .force-right .highlight .nt,
.stripe .section > [class*=highlight] .highlight .nt {
color: #268bd2;
}
.stripe .section > .force-right .highlight .nv,
.stripe .section > [class*=highlight] .highlight .nv {
color: #268bd2;
}
.stripe .section > .force-right .highlight .ow,
.stripe .section > [class*=highlight] .highlight .ow {
color: #859900;
}
.stripe .section > .force-right .highlight .w,
.stripe .section > [class*=highlight] .highlight .w {
color: #cccccc;
}
.stripe .section > .force-right .highlight .mf,
.stripe .section > [class*=highlight] .highlight .mf {
color: #2aa198;
}
.stripe .section > .force-right .highlight .mh,
.stripe .section > [class*=highlight] .highlight .mh {
color: #2aa198;
}
.stripe .section > .force-right .highlight .mi,
.stripe .section > [class*=highlight] .highlight .mi {
color: #2aa198;
}
.stripe .section > .force-right .highlight .mo,
.stripe .section > [class*=highlight] .highlight .mo {
color: #2aa198;
}
.stripe .section > .force-right .highlight .sb,
.stripe .section > [class*=highlight] .highlight .sb {
color: #586e75;
}
.stripe .section > .force-right .highlight .sc,
.stripe .section > [class*=highlight] .highlight .sc {
color: #2aa198;
}
.stripe .section > .force-right .highlight .sd,
.stripe .section > [class*=highlight] .highlight .sd {
color: #cccccc;
}
.stripe .section > .force-right .highlight .s2,
.stripe .section > [class*=highlight] .highlight .s2 {
color: #2aa198;
}
.stripe .section > .force-right .highlight .se,
.stripe .section > [class*=highlight] .highlight .se {
color: #cb4b16;
}
.stripe .section > .force-right .highlight .sh,
.stripe .section > [class*=highlight] .highlight .sh {
color: #cccccc;
}
.stripe .section > .force-right .highlight .si,
.stripe .section > [class*=highlight] .highlight .si {
color: #2aa198;
}
.stripe .section > .force-right .highlight .sx,
.stripe .section > [class*=highlight] .highlight .sx {
color: #2aa198;
}
.stripe .section > .force-right .highlight .sr,
.stripe .section > [class*=highlight] .highlight .sr {
color: #dc322f;
}
.stripe .section > .force-right .highlight .s1,
.stripe .section > [class*=highlight] .highlight .s1 {
color: #2aa198;
}
.stripe .section > .force-right .highlight .ss,
.stripe .section > [class*=highlight] .highlight .ss {
color: #2aa198;
}
.stripe .section > .force-right .highlight .bp,
.stripe .section > [class*=highlight] .highlight .bp {
color: #268bd2;
}
.stripe .section > .force-right .highlight .vc,
.stripe .section > [class*=highlight] .highlight .vc {
color: #268bd2;
}
.stripe .section > .force-right .highlight .vg,
.stripe .section > [class*=highlight] .highlight .vg {
color: #268bd2;
}
.stripe .section > .force-right .highlight .vi,
.stripe .section > [class*=highlight] .highlight .vi {
color: #268bd2;
}
.stripe .section > .force-right .highlight .il,
.stripe .section > [class*=highlight] .highlight .il {
color: #2aa198;
}
.stripe .body > .section > .section {
border-top: 1px solid #eeeeee;
}
.stripe .section > h1,
.stripe .section > h2,
@ -6820,7 +7214,7 @@ td.field-body > ul {
.stripe .section > h4,
.stripe .section > h5,
.stripe .section > h6 {
background-color: rgba(255, 255, 255, 0.7);
max-width: 50%;
}
.stripe .section > h1,
.stripe .section > h2,
@ -6834,17 +7228,17 @@ td.field-body > ul {
float: none;
clear: both;
}
.stripe .bodywrapper {
position: relative;
.stripe .documentwrapper {
overflow: auto;
}
.stripe .bodywrapper:before {
.stripe .documentwrapper:before {
position: absolute;
top: 0;
bottom: 0;
left: 50%;
content: "";
width: 0;
border-left: 1px solid #777777;
width: 50%;
background: #333333;
}
.stripe .highlight pre {
white-space: pre-wrap;

View File

@ -472,7 +472,6 @@ div.section > h2 {
*/
.highlight pre {
padding: 4px;
font-size: 75%;
// don't break lines within words
word-break: normal;
@ -590,6 +589,11 @@ td.field-body {
}
}
}
@background-right: @gray-dark;
@color-right: @gray-lighter;
@color-right-code: lighten(#000, 80%);
@separator-right: @gray-light;
// STRIPE-STYLE PAGES
.stripe {
.section {
@ -606,16 +610,129 @@ td.field-body {
clear: left;
}
// column 2
.section > .force-right {
padding-left: 1em;
padding-right: 1em;
}
.section > .force-right,
.section > [class*=highlight] {
float: none;
clear: none;
margin-left: 51%;
margin-left: 50%;
width: 50%;
color: @color-right;
a {
color: lighten(@link-color, 30%);
}
code, .literal {
color: @code-bg;
background-color: @gray;
}
&:not(.highlight-json) .highlight {
border-bottom-color: @separator-right;
}
&.admonition {
margin-left: 51%;
width: 49%;
border-top-color: @separator-right;
border-bottom-color: @separator-right;
border-right-color: @separator-right;
}
pre {
// padding leads to overflow scrollbar in safari for no reason I understand,
// margin does not have that issue
padding: 0;
margin: 10px;
background: none;
border: none;
}
.highlight {
border-color: @gray;
border-style: solid;
border-width: 1px 0;
// solarized-ish from https://gist.github.com/qguv/7936275
color: @color-right-code;
background: none;
.lineno { color: #586e75 } /* Line Numbers */
.c { color: #586e75 } /* Comment */
.err { color: @color-right-code } /* Error */
.g { color: @color-right-code } /* Generic */
.k { color: #859900 } /* Keyword */
.l { color: @color-right-code } /* Literal */
.n { color: @color-right-code } /* Name */
.o { color: #859900 } /* Operator */
.x { color: #cb4b16 } /* Other */
.p { color: @color-right-code } /* Punctuation */
.cm { color: #586e75 } /* Comment.Multiline */
.cp { color: #859900 } /* Comment.Preproc */
.c1 { color: #586e75 } /* Comment.Single */
.cs { color: #859900 } /* Comment.Special */
.gd { color: #2aa198 } /* Generic.Deleted */
.ge { color: @color-right-code; font-style: italic } /* Generic.Emph */
.gr { color: #dc322f } /* Generic.Error */
.gh { color: #cb4b16 } /* Generic.Heading */
.gi { color: #859900 } /* Generic.Inserted */
.go { color: @color-right-code } /* Generic.Output */
.gp { color: @color-right-code } /* Generic.Prompt */
.gs { color: @color-right-code; font-weight: bold } /* Generic.Strong */
.gu { color: #cb4b16 } /* Generic.Subheading */
.gt { color: @color-right-code } /* Generic.Traceback */
.kc { color: #cb4b16 } /* Keyword.Constant */
.kd { color: #268bd2 } /* Keyword.Declaration */
.kn { color: #859900 } /* Keyword.Namespace */
.kp { color: #859900 } /* Keyword.Pseudo */
.kr { color: #268bd2 } /* Keyword.Reserved */
.kt { color: #dc322f } /* Keyword.Type */
.ld { color: @color-right-code } /* Literal.Date */
.m { color: #2aa198 } /* Literal.Number */
.s { color: #2aa198 } /* Literal.String */
.na { color: @color-right-code } /* Name.Attribute */
.nb { color: #B58900 } /* Name.Builtin */
.nc { color: #268bd2 } /* Name.Class */
.no { color: #cb4b16 } /* Name.Constant */
.nd { color: #268bd2 } /* Name.Decorator */
.ni { color: #cb4b16 } /* Name.Entity */
.ne { color: #cb4b16 } /* Name.Exception */
.nf { color: #268bd2 } /* Name.Function */
.nl { color: @color-right-code } /* Name.Label */
.nn { color: @color-right-code } /* Name.Namespace */
.nx { color: @color-right-code } /* Name.Other */
.py { color: @color-right-code } /* Name.Property */
.nt { color: #268bd2 } /* Name.Tag */
.nv { color: #268bd2 } /* Name.Variable */
.ow { color: #859900 } /* Operator.Word */
.w { color: @color-right-code } /* Text.Whitespace */
.mf { color: #2aa198 } /* Literal.Number.Float */
.mh { color: #2aa198 } /* Literal.Number.Hex */
.mi { color: #2aa198 } /* Literal.Number.Integer */
.mo { color: #2aa198 } /* Literal.Number.Oct */
.sb { color: #586e75 } /* Literal.String.Backtick */
.sc { color: #2aa198 } /* Literal.String.Char */
.sd { color: @color-right-code } /* Literal.String.Doc */
.s2 { color: #2aa198 } /* Literal.String.Double */
.se { color: #cb4b16 } /* Literal.String.Escape */
.sh { color: @color-right-code } /* Literal.String.Heredoc */
.si { color: #2aa198 } /* Literal.String.Interpol */
.sx { color: #2aa198 } /* Literal.String.Other */
.sr { color: #dc322f } /* Literal.String.Regex */
.s1 { color: #2aa198 } /* Literal.String.Single */
.ss { color: #2aa198 } /* Literal.String.Symbol */
.bp { color: #268bd2 } /* Name.Builtin.Pseudo */
.vc { color: #268bd2 } /* Name.Variable.Class */
.vg { color: #268bd2 } /* Name.Variable.Global */
.vi { color: #268bd2 } /* Name.Variable.Instance */
.il { color: #2aa198 } /* Literal.Number.Integer.Long */
}
}
// separator above H2
.body > .section > .section {
border-top: 1px solid @color-right;
}
// fullwidth elements
.section > h1, .section > h2, .section > h3, .section > h4, .section > h5,
.section > h6 {
background-color: fadeout(@body-bg, 30%);
max-width: 50%;
}
.section > h1, .section > h2, .section > h3, .section > h4, .section > h5,
.section > h6, .section > .section {
@ -625,8 +742,8 @@ td.field-body {
clear: both;
}
.bodywrapper {
position: relative;
.documentwrapper {
overflow: auto;
// middle separator
&:before {
position: absolute;
@ -634,8 +751,8 @@ td.field-body {
bottom: 0;
left: 50%;
content: "";
width: 0;
border-left: 1px solid @gray-light;
width: 50%;
background: @background-right;
}
}

View File

@ -19,8 +19,8 @@ easily available over XML-RPC_ and accessible from a variety of languages.
into every call. Session would allow db to be stored as well
These issues are especially visible in Java, somewhat less so in PHP
Connection and authentication
=============================
Connection
==========
.. kinda gross because it duplicates existing bits