Update Portal styles & templates

Officially renames it the "XRP Ledger Developer Portal" and
adapts the Ripple Client Portal templates to the XRP Dev Portal:

- Table-of-Contents-like landing page
- Accordion-style side nav except on landing page
- Breadcrumbs except on landing page
- floating (right-side) in-page nav on doc pages
- Adds "Edit on GitHub" link
- Slight modifications to API tool styles
This commit is contained in:
mDuo13
2018-02-28 17:48:02 -08:00
parent 8fd555c12a
commit 2fe16409f3
15 changed files with 564 additions and 515 deletions

View File

@@ -10,11 +10,8 @@
display:table-cell;
}
#command_list {
display:table-cell;
list-style-type:none;
padding:36px 0 0 0;
margin:0;
height:100%;
padding:0 0 0 0;
}
aside.sidebar {
@@ -40,37 +37,6 @@ aside.sidebar {
font-weight: bold;
margin-top: 10px;
}
#command_table {
height:100%;
}
#io_wrapper {
float:right;
display:table;
height:500px;
padding:0;
table-layout:fixed;
border-spacing:24px 0;
width:96%;
height: 100%;
margin-top: 30px;
}
#io_wrapper > div {
width:100%;
margin:0;
padding:0;
}
#response, #response_body {
min-height:100px;
border-top-left-radius:0px !important;
border-top-right-radius:0px !important;
}
#input {
width: 30%;
}
#output {
width: 60%;
}
h3 {
margin:16px 0;
font-family:'open sans';
@@ -149,7 +115,6 @@ h3 {
cursor:pointer;
}
#online_state {
position:absolute;
top:10px;
line-height:30px;
font-size:14px;
@@ -382,4 +347,3 @@ span.cm-atom {
#rest_url div input {
display: block;
}

View File

@@ -1,3 +1,7 @@
.no-sidebar aside.sidebar {
display: none;
}
.devportal-callout {
border-style: solid;
border-radius: 5px;
@@ -70,9 +74,9 @@
float: right;
}
/* Images should occupy the full main column width if possible */
.page-template-template-dev-portal-php .content img {
width: 100%;
/* Images should not exceed the main column */
.xrp-ledger-dev-portal .content img {
max-width: 100%;
height: auto;
}
@@ -81,24 +85,58 @@
width: initial;
}
/* dev portal content h5 should stand out from paragraph text */
.no-1st-head h1:first-child,
.no-1st-head h2:first-child,
.no-1st-head h3:first-child,
.no-1st-head h4:first-child,
.no-1st-head h5:first-child,
.no-1st-head h6:first-child {
display: none;
}
.content p {
line-height: 1.8;
}
.content h1 {
margin-top: 32px;
line-height: 1.2;
}
.content h2 {
margin-top: 28px;
line-height: 1.2;
}
.content h3 {
margin-top: 24px;
line-height: 1.2;
}
.content h4 {
margin-top: 20px;
line-height: 1.2;
}
.content h5 {
font-weight: bold;
margin-top: 16px;
line-height: 1.2;
font-weight: bold;
}
.content h6 {
margin-top: 12px
line-height: 1.2;
font-weight: bold;
}
/* Underline links in Dev Portal content */
.page-template-template-dev-portal-php .main a {
.xrp-ledger-dev-portal .main a {
text-decoration: underline !important;
}
/* "Button-style" links should look like buttons, not links */
.page-template-template-dev-portal-php a.button {
.xrp-ledger-dev-portal a.button {
cursor: pointer;
text-decoration: none !important;
}
/* Code Tabs stuff */
.page-template-template-dev-portal-php .multicode {
.xrp-ledger-dev-portal .multicode {
color: #000;
margin: 12px 0px 0px 0px;
padding: 0 0 0 0;
@@ -106,15 +144,15 @@
padding-left: 10px;
position: relative;
}
.page-template-template-dev-portal-php .multicode ul {
.xrp-ledger-dev-portal .multicode ul {
margin: 0 !important;
padding: 0;
}
.page-template-template-dev-portal-php .multicode pre {
.xrp-ledger-dev-portal .multicode pre {
padding-top: 0;
clear: both;
}
.page-template-template-dev-portal-php .multicode li {
.xrp-ledger-dev-portal .multicode li {
display: block;
float: left;
overflow: hidden;
@@ -122,12 +160,12 @@
margin-right: 5px;
border-top: 1px solid #DBDDE2;
}
.page-template-template-dev-portal-php .multicode ul > li:before {
.xrp-ledger-dev-portal .multicode ul > li:before {
background: none;
border: none;
}
.page-template-template-dev-portal-php .multicode a,
.page-template-template-dev-portal-php a.current {
.xrp-ledger-dev-portal .multicode a,
.xrp-ledger-dev-portal a.current {
color: black;
background: #DFE2E7;
border: 1px solid #DBDDE2;
@@ -135,18 +173,18 @@
margin: 0px;
text-decoration: none;
}
.page-template-template-dev-portal-php .multicode a.current {
.xrp-ledger-dev-portal .multicode a.current {
background: #fff;
border-bottom: 1px solid #fff;
color: black;
}
.page-template-template-dev-portal-php .multicode a:hover {
.xrp-ledger-dev-portal .multicode a:hover {
color: black;
background: white;
}
/* End of code tabs stuff */
.page-template-template-dev-portal-php .button {
.xrp-ledger-dev-portal .button {
border-radius: 5px;
background-color: #27a2db;
padding: 5px 20px;
@@ -164,152 +202,169 @@
-webkit-transition: .5s;
transition: .5s;
}
.page-template-template-dev-portal-php .button:hover {
.xrp-ledger-dev-portal .button:hover {
background-color: #43bded;
-o-transition: .5s;
-webkit-transition: .5s;
transition: .5s;
}
.page-template-template-dev-portal-php pre {
.xrp-ledger-dev-portal pre {
overflow: visible;
word-wrap: normal;
}
.page-template-template-dev-portal-php pre code {
.xrp-ledger-dev-portal pre code {
white-space: pre;
}
.page-template-template-dev-portal-php .code_sample pre {
.xrp-ledger-dev-portal .code_sample pre {
background: none;
border: none;
border-radius: 0;
}
.page-template-template-dev-portal-php .code_sample pre code {
.xrp-ledger-dev-portal .code_sample pre code {
overflow: auto;
max-height: 14em;
background-color: #f5f5f5;
border: 1px solid #cccccc;
border-radius: 4px;
}
.page-template-template-dev-portal-php .code_sample pre code.expanded {
.xrp-ledger-dev-portal .code_sample pre code.expanded {
overflow: visible;
max-height: none;
position: absolute;
min-width: 661px;
}
.page-template-template-dev-portal-php .code_sample .code_toggler {
.xrp-ledger-dev-portal .code_sample .code_toggler {
position: absolute;
bottom: 0;
right: 0;
}
.page-template-template-dev-portal-php .navbar-default {
.xrp-ledger-dev-portal .navbar-default {
border-bottom: none;
}
.page-template-template-dev-portal-php .wrap.container {
margin-top: 110px;
.xrp-ledger-dev-portal .wrap.container {
margin-top: 106px;
}
.page-template-template-dev-portal-php .main {
.xrp-ledger-dev-portal.sidebar-primary .main {
z-index: 5;
border-left: 1px solid #cccccc;
padding-left: 40px;
}
.page-template-template-dev-portal-php .content {
.xrp-ledger-dev-portal .content {
padding-bottom: 50px;
}
.page-template-template-dev-portal-php .level-1 {
margin: 10px 0 3px 0;
text-transform: uppercase;
.xrp-ledger-dev-portal .level-1 {
padding-left: 15px;
}
.page-template-template-dev-portal-php .level-1 a {
color: #000000;
font-family: 'open_sansbold', sans-serif;
letter-spacing: .04em;
.xrp-ledger-dev-portal .level-2 {
padding-left: 30px;
}
.page-template-template-dev-portal-php .level-2 {
margin-left: 2em;
.xrp-ledger-dev-portal .level-3 {
padding-left: 45px;
}
.page-template-template-dev-portal-php .level-3 {
margin-left: 4em;
.xrp-ledger-dev-portal #page-toc-wrapper {
max-width: 200px;
float: right;
position: absolute;
right: -210px;
}
.page-template-template-dev-portal-php .level-3 a {
color: #999999;
}
.page-template-template-dev-portal-php .level-3 a:hover {
color: #666;
}
.page-template-template-dev-portal-php .dev_nav_sidebar {
.xrp-ledger-dev-portal .dev_nav_sidebar {
padding-left: 5px;
list-style-type: none;
max-width: 370px;
}
.page-template-template-dev-portal-php .dev_nav_wrapper {
.xrp-ledger-dev-portal .dev_nav_sidebar li:before {
content: "\f105"; /* fontawesome angle-right */
font-family: FontAwesome;
position: relative;
left: -15px;
margin-right: -5px;
}
.xrp-ledger-dev-portal .dev_nav_wrapper {
position: fixed;
width: 100%;
overflow-y: scroll;
top: 130px;
}
.page-template-template-dev-portal-php td {
.xrp-ledger-dev-portal td {
border: 1px solid #dbdde2;
padding: 0.2em;
vertical-align: text-top;
}
.page-template-template-dev-portal-php th {
.xrp-ledger-dev-portal th {
padding: 0.2em;
}
.page-template-template-dev-portal-php .content a[title="Source"] {
.xrp-ledger-dev-portal .content a[title="Source"] {
float: right;
padding-left: 20px;
}
.page-template-template-dev-portal-php .content table {
.xrp-ledger-dev-portal .content table {
clear: right;
}
.page-template-template-dev-portal-php h1:before,
.page-template-template-dev-portal-php h2:before,
.page-template-template-dev-portal-php h3:before {
.xrp-ledger-dev-portal .main h1:before,
.xrp-ledger-dev-portal .main h2:before,
.xrp-ledger-dev-portal .main h3:before,
.xrp-ledger-dev-portal .main h4:before,
.xrp-ledger-dev-portal .main h5:before,
.xrp-ledger-dev-portal .main h6:before,
#main_content_wrapper:before {
display: block;
content: " ";
margin-top: -130px;
height: 130px;
margin-top: -67px;
height: 67px;
visibility: hidden;
}
@media (max-width: 1200px) {
.page-template-template-dev-portal-php .dev_nav_wrapper {
.xrp-ledger-dev-portal .dev_nav_wrapper {
max-width: 290px;
}
.xrp-ledger-dev-portal #page-toc-wrapper {
position: static;
float: none;
max-width: none;
}
.sidebar-primary .wrap.container {
width: inherit;
margin-right: 0;
}
}
@media (max-width: 992px) {
.page-template-template-dev-portal-php .dev_nav_wrapper {
.xrp-ledger-dev-portal .dev_nav_wrapper {
max-width: 230px;
}
}
@media (max-width: 768px) {
.page-template-template-dev-portal-php .dev_nav_wrapper,
.page-template-template-dev-portal-php .sidebar {
.xrp-ledger-dev-portal .dev_nav_wrapper,
.xrp-ledger-dev-portal .sidebar {
display: block;
clear: both;
overflow-y: inherit;
position: static;
max-width: 100%;
}
.page-template-template-dev-portal-php .main {
.xrp-ledger-dev-portal .main {
position: static;
clear: both;
border-left: none;
padding-left: 0px;
overflow-wrap: break-word;
word-wrap: break-word;
overflow: hidden;
}
}
@media (min-width: 768px) {
.page-template-template-dev-portal-php .main {
.xrp-ledger-dev-portal .main {
float: right;
}
}
@media (max-width: 480px) {
.page-template-template-dev-portal-php html {
.xrp-ledger-dev-portal html {
overflow-x: hidden !important;
}
}
@media print {
.page-template-template-dev-portal-php {
.xrp-ledger-dev-portal {
/* undo code tabs */
/* wrap code, not scroll */
/* Source URLs are too big to float */
@@ -319,61 +374,58 @@
/* better margins on main content */
/* crazy print-section-numbering idea */
}
.page-template-template-dev-portal-php .multicode > div {
.xrp-ledger-dev-portal .multicode > div {
display: block !important;
}
.page-template-template-dev-portal-php .multicode > ul {
.xrp-ledger-dev-portal .multicode > ul {
display: none !important;
}
.page-template-template-dev-portal-php .multicode > em,
.page-template-template-dev-portal-php .multicode > p > em {
.xrp-ledger-dev-portal .multicode > em,
.xrp-ledger-dev-portal .multicode > p > em {
display: block !important;
page-break-after: avoid;
}
.page-template-template-dev-portal-php .multicode > p {
.xrp-ledger-dev-portal .multicode > p {
display: block !important;
}
.page-template-template-dev-portal-php pre {
.xrp-ledger-dev-portal pre {
white-space: pre-wrap;
max-height: none !important;
overflow: visible;
page-break-inside: auto;
word-wrap: break-word;
}
.page-template-template-dev-portal-php pre code {
.xrp-ledger-dev-portal pre code {
white-space: pre-wrap !important;
}
.page-template-template-dev-portal-php .content a[title="Source"] {
.xrp-ledger-dev-portal .content a[title="Source"] {
float: none;
}
.page-template-template-dev-portal-php .main a:after {
content: " (" attr(href) ")";
}
.page-template-template-dev-portal-php header,
.page-template-template-dev-portal-php footer {
.xrp-ledger-dev-portal header,
.xrp-ledger-dev-portal footer {
display: none;
}
.page-template-template-dev-portal-php #goog-gt-tt {
.xrp-ledger-dev-portal #goog-gt-tt {
display: none;
}
.page-template-template-dev-portal-php .wrap.container {
.xrp-ledger-dev-portal .wrap.container {
margin-top: 0 !important;
}
.page-template-template-dev-portal-php .dev_nav_wrapper {
.xrp-ledger-dev-portal .dev_nav_wrapper {
position: static !important;
}
.page-template-template-dev-portal-php .sidebar:before {
.xrp-ledger-dev-portal .sidebar:before {
display: none !important;
}
.page-template-template-dev-portal-php .sidebar {
.xrp-ledger-dev-portal .sidebar {
padding-top: 0 !important;
display: block !important;
float: none !important;
}
.page-template-template-dev-portal-php h1 {
.xrp-ledger-dev-portal h1 {
page-break-before: always;
}
.page-template-template-dev-portal-php .main {
.xrp-ledger-dev-portal .main {
float: none !important;
width: 85% !important;
border-left: 0 !important;
@@ -382,78 +434,6 @@
display: block !important;
overflow: visible !important;
}
.page-template-template-dev-portal-php .main {
counter-reset: level1;
counter-reset: level2;
counter-reset: level3;
}
.page-template-template-dev-portal-php .main h1 {
counter-increment: level1;
counter-reset: level2;
}
.page-template-template-dev-portal-php .main h1:before {
content: counter(level1) ". " !important;
display: inline !important;
background: none !important;
position: static !important;
box-shadow: none !important;
visibility: visible !important;
}
.page-template-template-dev-portal-php .main h2 {
counter-reset: level3;
}
.page-template-template-dev-portal-php .main h2:before {
counter-increment: level2;
content: counter(level1) "." counter(level2) ". " !important;
display: inline !important;
background: none !important;
position: static !important;
box-shadow: none !important;
visibility: visible !important;
}
.page-template-template-dev-portal-php .main h3:before {
counter-increment: level3;
content: counter(level1) "." counter(level2) "." counter(level3) ". " !important;
display: inline !important;
background: none !important;
position: static !important;
box-shadow: none !important;
visibility: visible !important;
}
.page-template-template-dev-portal-php .menubar,
.page-template-template-dev-portal-php .dev_nav_wrapper {
counter-reset: toclevel1;
}
.page-template-template-dev-portal-php .level-1 {
counter-reset: toclevel2;
}
.page-template-template-dev-portal-php .level-1:before {
counter-increment: toclevel1;
content: counters(toclevel1, ".") ". " !important;
display: inline !important;
background: none !important;
position: static !important;
box-shadow: none !important;
}
.page-template-template-dev-portal-php .level-2 {
counter-reset: toclevel3;
}
.page-template-template-dev-portal-php .level-2:before {
counter-increment: toclevel2;
content: counters(toclevel1, ".") "." counters(toclevel2, ".") ". " !important;
display: inline !important;
background: none !important;
position: static !important;
box-shadow: none !important;
}
.page-template-template-dev-portal-php .level-3:before {
counter-increment: toclevel3;
content: counters(toclevel1, ".") "." counters(toclevel2, ".") "." counters(toclevel3, ".") ". " !important;
display: inline !important;
background: none !important;
position: static !important;
box-shadow: none !important;
}
}
/*------------- Code Tabs -----------------------------------------*/
@@ -504,4 +484,238 @@
background: white;
}
.multicode a.current:hover {}
.navbar-default {
background-color: #fff;
border-bottom: 1px solid #27a2db;
}
.navbar-brand {
vertical-align: middle;
text-decoration: none;
}
.navbar-default .logo {
float: left;
margin-right: 0.5em;
}
.navbar-default .navbar-brand .brand-text {
font-family: open_sansbold, sans-serif;
font-weight: bold;
line-height: 40px;
}
.navbar-default .navbar-nav > li > a {
font-size: 14px;
line-height: 30px;
color: #777;
}
.navbar-default a.active {
color: #27a2db !important;
}
.dev_nav .breadcrumb {
margin-bottom: 0;
}
.wrap-container {
margin-top: 106px;
}
.no-sidebar main .container {
padding-left: 0;
}
#main_content_wrapper {
margin-top: 67px;
padding-left: 0;
}
.jump-to-top {
display: none;
position: fixed;
bottom: 80px;
right: 80px;
background-color: #333;
font-weight: bolder;
z-index: 1000;
color: white;
}
@media screen and (max-width: 767px) {
.jump-to-top {
bottom: 40px;
right: 40px;
}
}
.xrp-ledger-dev-portal .breadcrumb li {
margin: 0;
}
.xrp-ledger-dev-portal .breadcrumb > li + li:before {
content: "\f105"; /* fontawesome angle-right */
font-family: FontAwesome;
padding-right: 5px;
}
.xrp-ledger-dev-portal .breadcrumb > li.active {
color: #666;
}
/* "← Back to guide" link in sidebar */
.back_to_guide a {
display: block;
font-size: 14px;
padding: 27px 0 14px 15px;
color: #666;
border-bottom: 1px solid #eee;
}
.back_to_guide a:before {
content: "\f100"; /* fontawesome angle-double-left */
font-family: FontAwesome;
padding-right: 15px;
color: #666;
}
/* Accordion styling for sidebar navigation */
.sidebar_cat_pagelist {
margin-left: 0;
padding-left: 0;
list-style-type: none;
}
#sidenav_accordion a {
text-decoration: none;
}
#sidenav_accordion .panel-body a:hover {
text-decoration: underline;
}
#sidenav_accordion .panel + .panel {
margin: 0;
}
#sidenav_accordion .panel-default {
border-width: 0;
border-color: #eee;
}
#sidenav_accordion .panel-body {
padding: 0;
}
#sidenav_accordion .collapse {
padding-bottom: 0;
}
#sidenav_accordion .panel.active {
background-color: #f8f8f8;
}
#sidenav_accordion .panel:hover {
background-color: #f6f6f6;
}
#sidenav_accordion .panel-heading {
padding: 0;
background-color: transparent;
}
#sidenav_accordion .panel {
padding: 0;
border-radius: 0;
}
#sidenav_accordion .panel-heading h5 {
margin-bottom: 0;
text-transform: none;
}
#sidenav_accordion .panel-heading h5 a {
display: block;
padding: 16px 15px;
font-family: "open_sansregular", sans-serif;
color: #666;
}
#sidenav_accordion .panel-heading a:before {
content: "\f106"; /* fontawesome angle-up */
font-family: FontAwesome;
margin-left: -20px;
padding-right: 5px;
float: right;
}
#sidenav_accordion .panel-heading a.collapsed:before {
content: "\f107"; /* fontawesome angle-down */
}
#sidenav_accordion .panel .sidebar_cat_pagelist li a {
display: block;
margin-top: 5px;
padding: 4px 15px 4px 55px;
text-indent: -20px;
font-size: 14px;
color: #27a2db;
}
#sidenav_accordion .panel .sidebar_cat_pagelist a.active {
color: black;
font-weight: bold;
}
#sidenav_accordion .panel .sidebar_cat_pagelist a:hover {
color: #333;
}
/* Edit on GitHub link --------- */
.github-edit-wrap .github-edit {
background-color: black;
background-image: url(../vendor/github-marks/GitHub-Mark-Light-32px.png);
background-position: left center;
background-repeat: no-repeat;
color: white;
border-radius: 8px;
margin: 10px;
float: right;
padding: 10px 20px 10px 38px;
text-decoration: none;
}
.github-edit-wrap .github-edit:hover {
text-decoration: underline;
}
.build-index .top {
text-indent: -20px;
}
.build-index ul {
border-top-left-radius: 5px;
border-top-right-radius: 5px;
padding: 0;
}
.build-index ul li {
font-size: 14px;
list-style: outside none none;
padding: 5px;
padding-left: 25px;
}
.build-index .dev_heading {
font-family: "Open Sans",sans-serif;
letter-spacing: 0.04em;
font-weight: 600;
text-transform: uppercase;
text-decoration: none;
color: #202020;
}
.build-index a.dev_heading:hover {
color: #27a2db;
text-decoration: underline;
}
.build-disclaimer {
font-size: 10pt;
margin: 2em 0;
padding-top: 2em;
border-top: 1px solid #777;
}

View File

@@ -1,112 +0,0 @@
.page-template-template-dev-portal-php .main {
border-left: 0;
}
/************
jumbotron
*********** */
.jumbotron {
margin-top: 50px;
margin-bottom: 0;
}
.jumbotron p {
font-size: 14px;
font-weight: 400;
}
.main_callout {
padding-top:10px;
}
.join {
font-weight: 500 !important;
}
img.large_logo {
padding: 10px 20px 10px 10px;
width: 100%;
}
.jumbotron p.api_btn {
/* text-align: center;
padding: 20px;*/
}
.jumbotron h4 {
font-weight: 800;
}
@media (min-width: 992px) {
.jumbotron .col-md-6 {
padding-left: 60px;
}
}
/************
Main content
*********** */
.main_title {
font-size: 30px;
font-weight: 300;
margin-top:10px;
}
.description h2{
font-size: 24px;
font-weight: 600;
margin: 20px 0 15px 0;
}
.build-index .top {
background: #f4f6f7 none repeat scroll 0 0;
}
.build-index ul {
border-top-left-radius: 5px;
border-top-right-radius: 5px;
padding: 0;
}
.build-index ul li {
border: 1px solid #ccc;
border-top-width: 0;
font-size: 14px;
list-style: outside none none;
padding: 5px;
}
.build-index ul li.top {
border-top-width: 1px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
.build-index .dev_heading {
font-family: "Open Sans",sans-serif;
letter-spacing: 0.04em;
font-weight: 600;
text-transform: uppercase;
}
.last {
margin-bottom: 40px;
}
.description.highlight {
background: #f5f5f5;
padding-bottom: 15px;
margin: 22px 0;
}
@media (max-width: 992px) {
.description.highlight {
padding-top: 10px;
}
}

View File

@@ -14,10 +14,3 @@ a[href^="#"]:after {
background: transparent;
box-decoration-break: slice;
}
/* Disable header numbering */
.page-template-template-dev-portal.page-template-template-dev-portal-php h1:before,
.page-template-template-dev-portal.page-template-template-dev-portal-php h2:before,
.page-template-template-dev-portal.page-template-template-dev-portal-php h3:before {
content: none !important;
}

View File

@@ -286,13 +286,11 @@ textarea {
line-height: inherit;
}
a {
color: #346aa9;
text-decoration: none !important;
color: #27a2db;
}
a:hover,
a:focus {
color: #22456e;
text-decoration: underline;
}
a:focus {
outline: thin dotted;
@@ -529,7 +527,7 @@ mark,
color: #777777;
}
.text-primary {
color: #346aa9;
color: #27a2db;
}
a.text-primary:hover {
color: #285282;
@@ -560,7 +558,7 @@ a.text-danger:hover {
}
.bg-primary {
color: #fff;
background-color: #346aa9;
background-color: #27a2db;
}
a.bg-primary:hover {
background-color: #285282;
@@ -2184,7 +2182,7 @@ fieldset[disabled] .btn-default.active {
}
.btn-primary {
color: #ffffff;
background-color: #346aa9;
background-color: #27a2db;
border-color: #2e5e96;
}
.btn-primary:hover,
@@ -2216,11 +2214,11 @@ fieldset[disabled] .btn-primary:active,
.btn-primary.disabled.active,
.btn-primary[disabled].active,
fieldset[disabled] .btn-primary.active {
background-color: #346aa9;
background-color: #27a2db;
border-color: #2e5e96;
}
.btn-primary .badge {
color: #346aa9;
color: #27a2db;
background-color: #ffffff;
}
.btn-success {
@@ -2388,7 +2386,7 @@ fieldset[disabled] .btn-danger.active {
background-color: #ffffff;
}
.btn-link {
color: #346aa9;
color: #27a2db;
font-weight: normal;
cursor: pointer;
border-radius: 0;
@@ -2539,12 +2537,12 @@ tbody.collapse.in {
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
text-decoration: none;
color: #346aa9;
color: #27a2db;
}
.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
color: #346aa9;
color: #27a2db;
text-decoration: none;
outline: 0;
}
@@ -2975,7 +2973,7 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
.nav .open > a:hover,
.nav .open > a:focus {
background-color: #eeeeee;
border-color: #346aa9;
border-color: #27a2db;
}
.nav .nav-divider {
height: 1px;
@@ -3068,7 +3066,7 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
.nav-pills > li.active > a:hover,
.nav-pills > li.active > a:focus {
color: #ffffff;
background-color: #346aa9;
background-color: #27a2db;
}
.nav-stacked > li {
float: none;
@@ -3482,7 +3480,7 @@ ul#menu-primary-navigation {
.home .navbar-default .navbar-nav > .active > a,
.home .navbar-default .navbar-nav > .active > a:hover,
.home .navbar-default .navbar-nav > .active > a:focus {
color: #346aa9;
color: #27a2db;
background-color: #ffffff;
}
.home .navbar-default .navbar-nav > .disabled > a,
@@ -3555,7 +3553,7 @@ fieldset[disabled] .home .navbar-default .btn-link:focus {
.navbar-default {
z-index: 99999;
background-color: #ffffff;
border-bottom: 1px solid #346aa9;
border-bottom: 1px solid #27a2db;
}
.navbar-default .navbar-brand {
color: #777777;
@@ -3573,13 +3571,13 @@ fieldset[disabled] .home .navbar-default .btn-link:focus {
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
color: #346aa9;
color: #27a2db;
background-color: transparent;
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
color: #346aa9;
color: #27a2db;
background-color: #ffffff;
}
.navbar-default .navbar-nav > .disabled > a,
@@ -3596,7 +3594,7 @@ fieldset[disabled] .home .navbar-default .btn-link:focus {
background-color: transparent;
}
.navbar-default .navbar-toggle .icon-bar {
background-color: #346aa9;
background-color: #27a2db;
}
.navbar-default .navbar-collapse,
.navbar-default .navbar-form {
@@ -3652,7 +3650,7 @@ fieldset[disabled] .navbar-default .btn-link:focus {
.navbar-default.scrolled {
z-index: 99999;
background-color: #ffffff !important;
border-bottom: 1px solid #346aa9;
border-bottom: 1px solid #27a2db;
-o-transition: .3s;
-ms-transition: .3s;
-moz-transition: .3s;
@@ -3680,7 +3678,7 @@ fieldset[disabled] .navbar-default .btn-link:focus {
}
.navbar-default.scrolled .navbar-nav > li > a:hover,
.navbar-default.scrolled .navbar-nav > li > a:focus {
color: #346aa9;
color: #27a2db;
background-color: transparent;
-o-transition: 1s;
-ms-transition: 1s;
@@ -3691,7 +3689,7 @@ fieldset[disabled] .navbar-default .btn-link:focus {
.navbar-default.scrolled .navbar-nav > .active > a,
.navbar-default.scrolled .navbar-nav > .active > a:hover,
.navbar-default.scrolled .navbar-nav > .active > a:focus {
color: #346aa9;
color: #27a2db;
background-color: #ffffff;
}
.navbar-default.scrolled .navbar-nav > .disabled > a,
@@ -3705,7 +3703,7 @@ fieldset[disabled] .navbar-default .btn-link:focus {
background-color: transparent;
}
.navbar-default.scrolled .navbar-toggle .icon-bar {
background-color: #346aa9;
background-color: #27a2db;
}
.navbar-default.scrolled .navbar-collapse,
.navbar-default.scrolled .navbar-form {
@@ -3894,7 +3892,7 @@ fieldset[disabled] .navbar-inverse .btn-link:focus {
padding: 6px 12px;
line-height: 1.42857143;
text-decoration: none;
color: #346aa9;
color: #27a2db;
background-color: #ffffff;
border: 1px solid #dddddd;
margin-left: -1px;
@@ -3926,8 +3924,8 @@ fieldset[disabled] .navbar-inverse .btn-link:focus {
.pagination > .active > span:focus {
z-index: 2;
color: #ffffff;
background-color: #346aa9;
border-color: #346aa9;
background-color: #27a2db;
border-color: #27a2db;
cursor: default;
}
.pagination > .disabled > span,
@@ -4043,7 +4041,7 @@ a.label:focus {
background-color: #5e5e5e;
}
.label-primary {
background-color: #346aa9;
background-color: #27a2db;
}
.label-primary[href]:hover,
.label-primary[href]:focus {
@@ -4110,7 +4108,7 @@ a.badge:focus {
}
a.list-group-item.active > .badge,
.nav-pills > .active > a > .badge {
color: #346aa9;
color: #27a2db;
background-color: #ffffff;
}
.nav-pills > li > a > .badge {
@@ -4174,7 +4172,7 @@ a.list-group-item.active > .badge,
a.thumbnail:hover,
a.thumbnail:focus,
a.thumbnail.active {
border-color: #346aa9;
border-color: #27a2db;
}
.thumbnail .caption {
padding: 9px;
@@ -4288,7 +4286,7 @@ a.thumbnail.active {
line-height: 20px;
color: #ffffff;
text-align: center;
background-color: #346aa9;
background-color: #27a2db;
-webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
-webkit-transition: width 0.6s ease;
@@ -4439,8 +4437,8 @@ a.list-group-item:focus {
.list-group-item.active:focus {
z-index: 2;
color: #ffffff;
background-color: #346aa9;
border-color: #346aa9;
background-color: #27a2db;
border-color: #27a2db;
}
.list-group-item.active .list-group-item-heading,
.list-group-item.active:hover .list-group-item-heading,
@@ -4772,22 +4770,22 @@ a.list-group-item-danger.active:focus {
border-bottom-color: #dddddd;
}
.panel-primary {
border-color: #346aa9;
border-color: #27a2db;
}
.panel-primary > .panel-heading {
color: #ffffff;
background-color: #346aa9;
border-color: #346aa9;
background-color: #27a2db;
border-color: #27a2db;
}
.panel-primary > .panel-heading + .panel-collapse > .panel-body {
border-top-color: #346aa9;
border-top-color: #27a2db;
}
.panel-primary > .panel-heading .badge {
color: #346aa9;
color: #27a2db;
background-color: #ffffff;
}
.panel-primary > .panel-footer + .panel-collapse > .panel-body {
border-bottom-color: #346aa9;
border-bottom-color: #27a2db;
}
.panel-success {
border-color: #d6e9c6;
@@ -5652,7 +5650,7 @@ Dev subnav
.banner .dev_nav {
background: #f4f6f7;
padding: 5px;
border-top: 1px solid #346aa9;
border-top: 1px solid #27a2db;
border-bottom: 1px solid #cccccc;
}
.banner .dev_nav li {
@@ -5697,7 +5695,7 @@ Style subnav
.style_nav {
background: #f4f6f7;
padding: 5px;
border-top: 1px solid #346aa9;
border-top: 1px solid #27a2db;
border-bottom: 1px solid #cccccc;
}
.style_nav li {
@@ -5717,7 +5715,7 @@ Company subnav
.company_nav {
background: #f4f6f7;
padding: 5px;
border-top: 1px solid #346aa9;
border-top: 1px solid #27a2db;
border-bottom: 1px solid #cccccc;
}
.company_nav li {
@@ -5737,7 +5735,7 @@ News subnav
.news_nav {
background: #f4f6f7;
padding: 5px;
border-top: 1px solid #346aa9;
border-top: 1px solid #27a2db;
border-bottom: 1px solid #cccccc;
}
.news_nav li {
@@ -5964,7 +5962,7 @@ i.fa.fa-share {
display: none;
}
.scrolled .nav_x {
color: #346aa9;
color: #27a2db;
}
.white_x {
display: none;
@@ -5972,7 +5970,7 @@ i.fa.fa-share {
.nav_x {
margin-top: -4px;
display: none;
color: #346aa9;
color: #27a2db;
width: 20px;
}
.page-header {
@@ -6016,14 +6014,14 @@ img.ripple_stack {
font-size: 21px;
}
.title_border hr {
border-bottom: 1px solid #346aa9;
border-bottom: 1px solid #27a2db;
width: 100px;
}
.top_border_section {
border-top: 1px solid #cccccc;
}
.ripple_page_heading h3 hr {
border-top: 1px solid #346aa9;
border-top: 1px solid #27a2db;
width: 200px;
margin-top: 30px;
}
@@ -6352,7 +6350,7 @@ Thank You page
}
.error404 h1 {
font-size: 48px;
color: #346aa9;
color: #27a2db;
}
.error404 ul {
list-style-type: none;
@@ -6562,7 +6560,7 @@ Media Queries
.dev_nav {
background: #f4f6f7;
padding: 5px;
border-top: 1px solid #346aa9;
border-top: 1px solid #27a2db;
border-bottom: 1px solid #cccccc;
}
.dev_nav li {
@@ -6594,12 +6592,6 @@ Media Queries
display: none !important;
}
}
@media (min-width: 768px) {
.sidebar {
padding-top: 75px;
padding-left: 30px !important;
}
}
@media (max-width: 1024px) {
.hidden-ipad {
display: none !important;
@@ -6613,55 +6605,7 @@ Media Queries
display: block !important;
}
}
/*
******************
Transifex
******************
*/
#translation {
display: inline-block;
}
#tx-live-lang-toggle {
display: none;
}
.txlive-langselector-list {
position: absolute;
margin: 50px 0 0 0 !important;
padding: 0 !important;
display: inline-block !important;
background-color: transparent !important;
box-shadow: none !important;
color: #999999 !important;
width: auto !important;
top: 0 !important;
left: 0;
}
.txlive-langselector-list > li {
padding: 0 16px;
display: inline-block !important;
width: auto !important;
-o-transition: .5s;
-ms-transition: .5s;
-moz-transition: 5s;
-webkit-transition: .5s;
transition: .5s;
}
.txlive-langselector-list > li:hover {
background-color: transparent !important;
-o-transition: .5s;
-ms-transition: .5s;
-moz-transition: 5s;
-webkit-transition: .5s;
transition: .5s;
}
@media (max-width: 480px) {
.txlive-langselector-list {
position: relative !important;
}
.txlive-langselector-list > li {
padding: 0 5px 0 !important;
}
}
.aligncenter {
display: block;
margin: 10px auto;
@@ -6710,7 +6654,7 @@ figure.alignnone {
}
}
.banner .main_nav_wrapper {
border-bottom: 1px solid #346aa9;
border-bottom: 1px solid #27a2db;
height: 60px;
}
.banner ul#menu-primary-navigation li:hover {
@@ -6930,7 +6874,7 @@ figure.alignnone {
}
.content-info .absolute_bottom_footer .social-iconer a:hover,
.content-info .absolute_bottom_footer .social-iconer a:focus {
color: #346aa9;
color: #27a2db;
-o-transition: .5s;
-ms-transition: .5s;
-moz-transition: .5s;

15
assets/js/jump-to-top.js Normal file
View File

@@ -0,0 +1,15 @@
$(document).ready(function() {
var TO_TOP_MIN = 50;
var TO_TOP_SPEED = 500;
var TO_TOP_POS = 0;
$(window).scroll(function () {
if ($(this).scrollTop() > TO_TOP_MIN) {
$('.jump-to-top').fadeIn();
} else {
$('.jump-to-top').fadeOut();
}
});
$(".jump-to-top").click(function() {
$("body").animate({scrollTop: TO_TOP_POS}, TO_TOP_SPEED)
});
});

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.3 KiB

View File

@@ -5,7 +5,13 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width">
<title>{{ currentpage.name }} - {{ target.display_name }}</title>
<title>{{ currentpage.name }} - XRP Ledger Developer Portal</title>
<!--[if lt IE 9]>
<script src="/dist/js/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="/dist/js/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<!-- favicon -->
<link rel="icon" href="favicon.ico" type="image/x-icon">
@@ -21,54 +27,56 @@
<!-- Bootstrap JS -->
<script src="assets/vendor/bootstrap.min.js"></script>
<!-- fontawesome icons -->
<link rel="stylesheet" href="assets/vendor/fontawesome/css/font-awesome.min.css" />
{% block head %}
{% endblock %}
</head>
<body class="page page-template page-template-template-dev-portal page-template-template-dev-portal-php {% if currentpage.sidebar != 'off' %}sidebar-primary{% endif %} wpb-js-composer js-comp-ver-3.6.2 vc_responsive">
<body class="{% block bodyclasses %} xrp-ledger-dev-portal sidebar-primary{% endblock %}">
<header role="banner" class="banner navbar navbar-default navbar-fixed-top initial_header">
<div class="container">
<div class="navbar-header">
<a href="index.html" class="navbar-brand"><img src="assets/img/ripple-logo-color.png" class="logo"></a>
<a href="index.html" class="navbar-brand">
<img src="assets/img/ripple-logo-color.png" class="logo">
<span class="brand-text">XRP Ledger Developer Portal</span>
</a>
</div><!-- /.navbar-header -->
<div class="nav">
<div class="draft-warning">DRAFT PAGE</div>
<div class="github-edit-wrap">
{% if currentpage.md is defined %}
{% set githuburl = "https://github.com/ripple/ripple-dev-portal/edit/master/content/" + currentpage.md %}
{% elif currentpage.template is defined %}
{% set githuburl = "https://github.com/ripple/ripple-dev-portal/edit/master/tool/" + currentpage.template %}
{% else %}
{% set githuburl = "https://github.com/ripple/ripple-dev-portal/" %}
{% endif %}
<a href="{{githuburl}}" class="github-edit">Edit on GitHub</a>
</div><!-- /.github-edit -->
</div><!-- /.nav -->
</div><!-- /.container -->
<div class="subnav dev_nav">
<div class="container">
<ul id="menu-dev-menu" class="menu">
{% for cat in categories %}
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">{{cat}} <span class="caret"></span></a>
<ul class="dropdown-menu" role="menu">
{% for page in pages %}
{% if page.category == cat %}
<li><a href="{{ page.html }}">{{ page.name }}</a></li>
{% endif %}
{% endfor %}
</ul>
</li>
{% endfor %}
<li><a href="https://github.com/ripple/ripple-dev-portal" title="GitHub">Site Source</a></li>
</ul><!-- /#dev-menu -->
</div><!-- /.subnav .container -->
</div><!-- /.subnav -->
</header>
<div class="wrap container" role="document">
{% if currentpage.sidebar != 'off' %}
<div class="wrap container" role="document" id="main_content_wrapper">
<aside class="sidebar" role="complementary">
{% block sidebar %}{% endblock %}
</aside>
{% endif %}
<main class="main" role="main">
{% block breadcrumbs %}
<ul class="breadcrumb">
<li><a href="index.html">XRP Ledger Documentation</a></li>
{% if currentpage.category %}
<li class="active">{{ currentpage.category }}</li>
{% endif %}
</ul>
{% endblock %}
{% block main %}{% endblock %}
</main>
</div>

View File

@@ -18,35 +18,26 @@
<script src="assets/js/expandcode.js"></script>
<script src="assets/js/fixsidebarscroll.js"></script>
<!-- fontawesome icons -->
<link rel="stylesheet" href="assets/vendor/fontawesome/css/font-awesome.min.css" />
{% endblock %}
{% block sidebar %}
{% if currentpage.sidebar != 'off' %}
<div class="dev_nav_wrapper">
<div id="cont">
<h5>In this category:</h5>
<ul class="dev_nav_sidebar">
<li class="level-1"><a href="index.html">Category: {{ currentpage.category }}</a></li>
{% for page in pages %}
{% if page.category == currentpage.category %}
<li class="level-2"><a href="{{ page.html }}">{{ page.name }}</a></li>
{% endif %}
{% endfor %}
</ul>
<hr />
<h5>In this page:</h5>
<ul class="dev_nav_sidebar" id="dactyl_toc_sidebar">
{{ page_toc }}
</ul>
</div>
</div>
{% endif %}
{% if currentpage.sidebar != "disabled" %}
{% include "template-sidebar_nav.html" %}
{% endif %}
{% endblock %}
{% block main %}
<div class='content'>
<h1 class="main-page-header">{{ currentpage.name }}</h1>
<div id="page-toc-wrapper" class="panel panel-default">
<p class="in-this-doc panel-heading">In this document:</p>
<ul class="dev_nav_sidebar panel-body" id="dactyl_toc_sidebar">
{{ sidebar_content }}
</ul>
</div>
<div class='content no-1st-head'>
{{ content }}
</div>
{% endblock %}

View File

@@ -3,7 +3,7 @@
<div class="row">
<div class="col-sm-12 absolute_bottom_footer">
<div class="col-sm-8">
<span>&copy; 2013 - 2017 Ripple Labs, Inc. All Rights Reserved.</span>
<span>&copy; 2013 - 2018 Ripple. All Rights Reserved.</span>
<span><a href="/terms-of-use/">Terms</a></span>
<span><a href="/privacy-policy/">Privacy</a></span>
</div>
@@ -12,3 +12,7 @@
</div><!-- /.row -->
</div><!-- /.container -->
</footer>
<!-- Jump to top button -->
<a href="#main_content_wrapper" class="jump-to-top btn btn-primary btn-lg" role="button" title="Jump to top of page">Top</span></a>
<script type="text/javascript" src="assets/js/jump-to-top.js"></script>

View File

@@ -13,44 +13,39 @@
{% endblock %}
{% block main %}
{% block bodyclasses %}client-portal-docs page-build no-sidebar{% endblock %}
<!-- jumbotron -->
<!-- <div class="container theme-showcase" role="main"> -->
<div class="jumbotron">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="col-md-3">
<img class="large_logo" src="assets/img/dev-logo.png" />
</div>
<div class="col-md-9">
<h4>Welcome to the Developer Center</h4>
<p class="main_callout">
Ripples distributed settlement network is built on open-source technology that anyone can use. Here are the tools developers can use to build solutions around the open-source platform.</p>
</div>
</div>
</div>
{% block breadcrumbs %}{% endblock %}
{% block main %}
<div class="container">
<h2>XRP Ledger Documentation Table of Contents</h2>
</div>
<div class="container build-index">
<div class="row">
<div class="col-md-8">
{% for cat in categories %}
<ul>
<li class="top"><h5><a class="dev_heading" href="{{ (pages|selectattr('category', 'equalto', cat)|first).html }}">{{ cat }}</a></h5></li>
{% for page in pages %}
{% if page.category == cat and page.name != category and not page.toc_omit %}
<li><a href="{{ page.html }}">{{ page.name }}</a></li>
{% endif %}
{% endfor %}
</ul>
{% endfor %}
</div>
</div>
<!-- </div> -->
</div>
<!-- main container -->
<div class="container build-index">
<div class="row">
{% for cat in categories %}
<div class="col-md-3">
<ul>
<li class="top"><h5 class="dev_heading">{{ cat }}</h5></li>
{% for page in pages %}
{% if page.category == cat %}
<li><a href="{{ page.html }}">{{ page.name }}</a></li>
{% endif %}
{% endfor %}
</ul>
</div>
{% endfor %}
</div>
</div>
<!-- Disclaimer block -->
<div class="container build-disclaimer">
<p>
These resources are provided for informational purposes only, as illustrative references for your independent development of products or services designed to interface with Ripples open-source technologies. These resources are not intended to direct or influence how you or any other person interacts with Ripples open-source technologies. Ripple <strong><em>does not</em></strong> endorse any specific resource and makes no representations or warranties with respect to the resources listed.
</p>
<p>
Note that anti-money laundering and counter-terrorism financing laws and regulations, such as the U.S. Bank Secrecy Act and regulations issued by the Financial Crimes Enforcement Network (FinCEN), require certain parties to take certain precautions against financial crime. In particular, you may be interested in the 2013 <a href="https://www.fincen.gov/statutes_regs/guidance/html/FIN-2013-G001.html">guidance issued by FinCEN</a> in response to questions concerning the regulatory treatment of persons who use or make a business of exchanging, accepting, or transmitting certain virtual currencies. Additional FinCEN references are available at <a href="https://www.fincen.gov">https://www.fincen.gov</a>.
</p>
</div>
{% endblock %}

View File

@@ -1,6 +1,7 @@
{% extends "template-base.html" %}
{% block sidebar %}
<h2>API Methods</h2>
<ul id='command_list'>
<li class='selected'><a href='#server_info'>server_info</a></li>
<li><a href='#server_state'>server_state</a></li>
@@ -88,4 +89,3 @@
<script type='text/javascript' src='assets/js/ripple-0.11.0-min.js'></script>
<script type='text/javascript' src='assets/js/apitool-websocket.js'></script>
{% endblock %}

View File

@@ -0,0 +1,33 @@
<div class="guide_toc">
<div id="sidenav_accordion" class="panel-group" role="tablist" aria-multiselectable="true">
{% for cat in categories %}
<div class="panel panel-default{% if currentpage.category == cat %} active{% endif %}">
<div class="panel-heading" role="tab" id="sidenav_cat_head_{{loop.index}}">
<h5 class="panel-title">
<a {% if currentpage.category != cat %}class="collapsed"{% endif %} role="button" data-toggle="collapse" data-parent="#sidenav_accordion" href="#sidenav_collapse_{{loop.index}}" aria-expanded="true" aria-controls="sidenav_collapse_{{loop.index}}">
{{ cat }}
</a>
</h5>
</div><!-- /.panel-heading -->
<div id="sidenav_collapse_{{loop.index}}" class="collapse{% if currentpage.category == cat %} in{% endif %}" role="tabpanel" aria-labelledby="sidenav_cat_head_{{loop.index}}">
<div class="panel-body">
<ul class="sidebar_cat_pagelist">
{% for page in pages %}
{% if page.category == cat %}
{% if page == currentpage %}
<li><a class="active" href="{{ page.html }}">{{ page.name }}</a></li>
{% else %}
<li><a href="{{ page.html }}">{{ page.name }}</a></li>
{% endif %}
{% endif %}
{% endfor %}
</ul>
</div><!-- /.panel-body -->
</div><!-- /#sidenav_collapse{{loop.index}} -->
</div><!-- /.panel -->
{% endfor %}
</div><!-- /#sidenav_accordion -->
</div><!-- /.guide_toc -->