<% language_tabs.each do |lang| %>
<% if lang.is_a? Hash %>
@@ -85,7 +100,7 @@ under the License.
<% end %>
- <% if language_tabs %>
+ <% if language_tabs.any? %>
<% language_tabs.each do |lang| %>
<% if lang.is_a? Hash %>
diff --git a/source/stylesheets/_normalize.css b/source/stylesheets/_normalize.scss
similarity index 100%
rename from source/stylesheets/_normalize.css
rename to source/stylesheets/_normalize.scss
diff --git a/source/stylesheets/_syntax.scss.erb b/source/stylesheets/_syntax.scss.erb
deleted file mode 100644
index dfeb0c15240..00000000000
--- a/source/stylesheets/_syntax.scss.erb
+++ /dev/null
@@ -1,27 +0,0 @@
-/*
-Copyright 2008-2013 Concur Technologies, Inc.
-
-Licensed 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
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
-WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
-License for the specific language governing permissions and limitations
-under the License.
-*/
-
-@import 'variables';
-
-<%= Rouge::Themes::Base16::Monokai.render(:scope => '.highlight') %>
-
-.highlight .c, .highlight .cm, .highlight .c1, .highlight .cs {
- color: #909090;
-}
-
-.highlight, .highlight .w {
- background-color: $code-bg;
-}
\ No newline at end of file
diff --git a/source/stylesheets/_variables.scss b/source/stylesheets/_variables.scss
index 5fe64b1f302..d5ace567008 100644
--- a/source/stylesheets/_variables.scss
+++ b/source/stylesheets/_variables.scss
@@ -23,53 +23,53 @@ under the License.
// BACKGROUND COLORS
////////////////////
-$nav-bg: #393939;
-$examples-bg: #393939;
-$code-bg: #292929;
-$code-annotation-bg: #1c1c1c;
-$nav-subitem-bg: #262626;
-$nav-active-bg: #2467af;
-$lang-select-border: #000;
-$lang-select-bg: #222;
-$lang-select-active-bg: $examples-bg; // feel free to change this to blue or something
-$lang-select-pressed-bg: #111; // color of language tab bg when mouse is pressed
-$main-bg: #eaf2f6;
-$aside-notice-bg: #8fbcd4;
-$aside-warning-bg: #c97a7e;
-$aside-success-bg: #6ac174;
-$search-notice-bg: #c97a7e;
+$nav-bg: #0076BD !default;
+$examples-bg: #292929 !default;
+$code-bg: #292929 !default;
+$code-annotation-bg: #393939 !default;
+$nav-subitem-bg: #0076BD !default;
+$nav-active-bg: #3498DB !default;
+$lang-select-border: #ccc !default;
+$lang-select-bg: #222 !default;
+$lang-select-active-bg: $examples-bg !default; // feel free to change this to blue or something
+$lang-select-pressed-bg: #111 !default; // color of language tab bg when mouse is pressed
+$main-bg: #fff !default;
+$aside-notice-bg: #8fbcd4 !default;
+$aside-warning-bg: #c97a7e !default;
+$aside-success-bg: #6ac174 !default;
+$search-notice-bg: #fff !default;
// TEXT COLORS
////////////////////
-$main-text: #333; // main content text color
-$nav-text: #fff;
-$nav-active-text: #fff;
-$lang-select-text: #fff; // color of unselected language tab text
-$lang-select-active-text: #fff; // color of selected language tab text
-$lang-select-pressed-text: #fff; // color of language tab text when mouse is pressed
+$main-text: #333 !default; // main content text color
+$nav-text: #fff !default;
+$nav-active-text: #fff !default;
+$lang-select-text: #ccc !default; // color of unselected language tab text
+$lang-select-active-text: #d0d4d7 !default; // color of selected language tab text
+$lang-select-pressed-text: #ccc !default; // color of language tab text when mouse is pressed
// SIZES
////////////////////
-$nav-width: 230px; // width of the navbar
-$examples-width: 50%; // portion of the screen taken up by code examples
-$logo-margin: 20px; // margin between nav items and logo, ignored if search is active
-$main-padding: 28px; // padding to left and right of content & examples
-$nav-padding: 15px; // padding to left and right of navbar
-$nav-v-padding: 10px; // padding used vertically around search boxes and results
-$nav-indent: 10px; // extra padding for ToC subitems
-$code-annotation-padding: 13px; // padding inside code annotations
-$h1-margin-bottom: 21px; // padding under the largest header tags
-$tablet-width: 930px; // min width before reverting to tablet size
-$phone-width: $tablet-width - $nav-width; // min width before reverting to mobile size
+$nav-width: 260px !default; // width of the navbar
+$examples-width: 50% !default; // portion of the screen taken up by code examples
+$logo-margin: 10px !default; // margin between nav items and logo, ignored if search is active
+$main-padding: 28px !default; // padding to left and right of content & examples
+$nav-padding: 15px !default; // padding to left and right of navbar
+$nav-v-padding: 10px !default; // padding used vertically around search boxes and results
+$nav-indent: 10px !default; // extra padding for ToC subitems
+$code-annotation-padding: 13px !default; // padding inside code annotations
+$h1-margin-bottom: 21px !default; // padding under the largest header tags
+$tablet-width: 930px !default; // min width before reverting to tablet size
+$phone-width: $tablet-width - $nav-width !default; // min width before reverting to mobile size
// FONTS
////////////////////
%default-font {
- font-family: "Helvetica Neue", Helvetica, Arial, "Microsoft Yahei","微软雅黑", STXihei, "华文细黑", sans-serif;
- font-size: 13px;
+ font-family: "Open Sans", Helvetica, Arial, "Microsoft Yahei","微软雅黑", STXihei, "华文细黑", sans-serif;
+ font-size: 14px;
}
%header-font {
@@ -79,19 +79,19 @@ $phone-width: $tablet-width - $nav-width; // min width before reverting to mobil
%code-font {
font-family: Consolas, Menlo, Monaco, "Lucida Console", "Liberation Mono", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Courier New", monospace, serif;
- font-size: 12px;
+ font-size: 14px;
line-height: 1.5;
}
// OTHER
////////////////////
-$nav-active-shadow: #000;
-$nav-footer-border-color: #666;
-$nav-embossed-border-top: #000;
-$nav-embossed-border-bottom: #939393;
-$main-embossed-text-shadow: 0px 1px 0px #fff;
-$search-box-border-color: #666;
+$nav-active-shadow: #fff !default;
+$nav-footer-border-color: #fff !default;
+$nav-embossed-border-top: #fff !default;
+$nav-embossed-border-bottom: #fff !default;
+$main-embossed-text-shadow: 0px 0px 0px #fff !default;
+$search-box-border-color: #fff !default;
////////////////////////////////////////////////////////////////////////////////
@@ -100,10 +100,6 @@ $search-box-border-color: #666;
// These settings are probably best left alone.
%break-words {
- word-break: break-all;
-
- /* Non standard for webkit */
- word-break: break-word;
-
- hyphens: auto;
+ word-break: break-all;
+ hyphens: auto;
}
diff --git a/source/stylesheets/print.css.scss b/source/stylesheets/print.css.scss
index 4bda057f019..adf8b66bd5f 100644
--- a/source/stylesheets/print.css.scss
+++ b/source/stylesheets/print.css.scss
@@ -1,6 +1,5 @@
@charset "utf-8";
@import 'normalize';
-@import 'compass';
@import 'variables';
@import 'icon-font';
@@ -48,6 +47,12 @@ body {
font-size: 0.8em;
}
+ pre {
+ code {
+ border: 0;
+ }
+ }
+
pre {
padding: 1.3em;
}
diff --git a/source/stylesheets/screen.css.scss b/source/stylesheets/screen.css.scss
index e4b3ef82b22..a6d8c2aba73 100644
--- a/source/stylesheets/screen.css.scss
+++ b/source/stylesheets/screen.css.scss
@@ -1,8 +1,6 @@
@charset "utf-8";
@import 'normalize';
-@import 'compass';
@import 'variables';
-@import 'syntax';
@import 'icon-font';
/*
@@ -41,6 +39,16 @@ html, body {
// TABLE OF CONTENTS
////////////////////////////////////////////////////////////////////////////////
+
+ // Section headers
+ .tocify-item[data-unique="api-reference"], .tocify-item[data-unique="object-data-api"], .tocify-item[data-unique="task-api"], .tocify-item[data-unique="developer-support"], .tocify-item[data-unique="interface-api"], .tocify-item[data-unique="package-api"], .tocify-item[data-unique="user-management-api"] {
+ text-transform: uppercase;
+ margin-top: 1em;
+ margin-bottom: 0.5em;
+ font-weight: bold;
+ }
+
+
#toc > ul > li > a > span {
float: right;
background-color: #2484FF;
@@ -50,10 +58,10 @@ html, body {
@mixin embossed-bg {
background:
- linear-gradient(to bottom, rgba(#000, 0.2), rgba(#000, 0) 8px),
- linear-gradient(to top, rgba(#000, 0.2), rgba(#000, 0) 8px),
- linear-gradient(to bottom, rgba($nav-embossed-border-top, 1), rgba($nav-embossed-border-top, 0) 1.5px),
- linear-gradient(to top, rgba($nav-embossed-border-bottom, 1), rgba($nav-embossed-border-bottom, 0) 1.5px),
+ linear-gradient(to bottom, rgba(#fff, 0), rgba(#fff, 0) 0px),
+ linear-gradient(to top, rgba(#fff, 0), rgba(#fff, 0) 0px),
+ linear-gradient(to bottom, rgba($nav-embossed-border-top, 0), rgba($nav-embossed-border-top, 0) 0px),
+ linear-gradient(to top, rgba($nav-embossed-border-bottom, 0), rgba($nav-embossed-border-bottom, 0) 0px),
$nav-subitem-bg;
}
@@ -84,8 +92,23 @@ html, body {
// This is the logo at the top of the ToC
&>img {
display: block;
+ max-width: 100%;
}
+ //placeholder font
+ ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
+ color: #fff;
+}
+::-moz-placeholder { /* Firefox 19+ */
+ color: #fff;
+}
+:-ms-input-placeholder { /* IE 10+ */
+ color: #fff;
+}
+:-moz-placeholder { /* Firefox 18- */
+ color: #fff;
+}
+
&>.search {
position: relative;
@@ -111,7 +134,7 @@ html, body {
}
}
- img+.tocify {
+ img+.tocify, .lang-selector+.tocify {
margin-top: $logo-margin;
}
@@ -162,7 +185,7 @@ html, body {
list-style: none;
margin: 0;
padding: 0;
- line-height: 28px;
+ line-height: 30px;
}
li {
@@ -174,33 +197,44 @@ html, body {
// This is the currently selected ToC entry
.tocify-focus {
- box-shadow: 0px 1px 0px $nav-active-shadow;
+ box-shadow: 0px 0px 0px $nav-active-shadow;
background-color: $nav-active-bg;
color: $nav-active-text;
}
// Subheaders are the submenus that slide open
- // in the table of contents.
- .tocify-subheader {
- display: none; // tocify will override this when needed
- background-color: $nav-subitem-bg;
- font-weight: 500;
- .tocify-item>a {
- padding-left: $nav-padding + $nav-indent;
- font-size: 12px;
- }
-
- // for embossed look:
- @include embossed-bg;
- &>li:last-child {
- box-shadow: none; // otherwise it'll overflow out of the subheader
- }
- }
+ // in the table of contents.
+ .tocify-subheader {
+ display: none; // tocify will override this when needed
+ background-color: $nav-subitem-bg;
+ font-weight: 500;
+ .tocify-item>a {
+ padding-left: $nav-padding + $nav-indent;
+ font-size: 12px;
+ }
+
+ // for embossed look:
+ @include embossed-bg;
+ &>li:last-child {
+ box-shadow: none; // otherwise it'll overflow out of the subheader
+ }
+ }
+
+ .tocify-subheader {
+ .tocify-subheader {
+ .tocify-item>a {
+ // Styling here for a level 2 nesting. For example ->
+ padding-left: $nav-padding + $nav-indent * 2;
+ font-size: 12px;
+ }
+ }
+ }
+
.toc-footer {
padding: 1em 0;
margin-top: 1em;
- border-top: 1px dashed $nav-footer-border-color;
+ border-top: 1px solid $nav-footer-border-color;
li,a {
color: $nav-text;
@@ -340,7 +374,7 @@ html, body {
padding: 0 $main-padding;
box-sizing: border-box;
display: block;
- @include text-shadow($main-embossed-text-shadow);
+ text-shadow: $main-embossed-text-shadow;
@extend %left-col;
}
@@ -359,11 +393,9 @@ html, body {
font-size: 30px;
padding-top: 0.5em;
padding-bottom: 0.5em;
- border-bottom: 1px solid #ccc;
margin-bottom: $h1-margin-bottom;
margin-top: 2em;
- border-top: 1px solid #ddd;
- background-image: linear-gradient(to bottom, #fff, #f9f9f9);
+ color: #0076BD;
}
h1:first-child, div:first-child + h1 {
@@ -373,13 +405,12 @@ html, body {
h2 {
@extend %header-font;
- font-size: 20px;
+ font-size: 23px;
margin-top: 4em;
margin-bottom: 0;
- border-top: 1px solid #ccc;
padding-top: 1.2em;
padding-bottom: 1.2em;
- background-image: linear-gradient(to bottom, rgba(#fff, 0.4), rgba(#fff, 0));
+ color: #0076BD;
}
// h2s right after h1s should bump right up
@@ -391,13 +422,20 @@ html, body {
h3, h4, h5, h6 {
@extend %header-font;
- font-size: 15px;
+ font-size: 20px;
margin-top: 2.5em;
margin-bottom: 0.8em;
+ color: #333;
}
h4, h5, h6 {
- font-size: 10px;
+ font-size: 16px;
+ color: #333;
+ }
+
+ h5, h6 {
+ font-size: 14px;
+ color: #333;
}
hr {
@@ -456,8 +494,7 @@ html, body {
}
code {
- background-color: rgba(0,0,0,0.05);
- padding: 3px;
+ background-color: #ECF0F1 ;
border-radius: 3px;
@extend %break-words;
@extend %code-font;
@@ -471,7 +508,7 @@ html, body {
aside {
padding-top: 1em;
padding-bottom: 1em;
- @include text-shadow(0 1px 0 lighten($aside-notice-bg, 15%));
+ text-shadow: 0 1px 0 lighten($aside-notice-bg, 15%);
margin-top: 1.5em;
margin-bottom: 1.5em;
background: $aside-notice-bg;
@@ -479,12 +516,12 @@ html, body {
&.warning {
background-color: $aside-warning-bg;
- @include text-shadow(0 1px 0 lighten($aside-warning-bg, 15%));
+ text-shadow: 0 1px 0 lighten($aside-warning-bg, 15%);
}
&.success {
background-color: $aside-success-bg;
- @include text-shadow(0 1px 0 lighten($aside-success-bg, 15%));
+ text-shadow: 0 1px 0 lighten($aside-success-bg, 15%);
}
}
@@ -511,7 +548,7 @@ html, body {
margin: -2px;
border-radius: 4px;
border: 1px solid #F7E633;
- @include text-shadow(1px 1px 0 #666);
+ text-shadow: 1px 1px 0 #fff;
background: linear-gradient(to top left, #F7E633 0%, #F1D32F 100%);
}
}
@@ -524,7 +561,7 @@ html, body {
.content {
pre, blockquote {
background-color: $code-bg;
- color: #fff;
+ color: #d0d4d7;
padding: 2em $main-padding;
margin: 0;
@@ -534,7 +571,7 @@ html, body {
clear:right;
box-sizing: border-box;
- @include text-shadow(0px 1px 2px rgba(0,0,0,0.4));
+ //text-shadow: 0px 1px 2px rgba(0,0,0,0.4);
@extend %right-col;
@@ -556,9 +593,9 @@ html, body {
background-color: $code-annotation-bg;
border-radius: 5px;
padding: $code-annotation-padding;
- color: #ccc;
- border-top: 1px solid #000;
- border-bottom: 1px solid #404040;
+ color: #d0d4d7;
+ //border-top: 1px solid #000;
+ //border-bottom: 1px solid #404040;
}
}
}
@@ -618,3 +655,11 @@ html, body {
margin-top: $main-padding;
}
}
+
+.highlight .c, .highlight .cm, .highlight .c1, .highlight .cs {
+ color: #909090;
+}
+
+.highlight, .highlight .w {
+ background-color: $code-bg;
+}