ARCHIVE/xrpl-dev-portal
1
0
Fork 0
mirror of https://github.com/XRPLF/xrpl-dev-portal.git synced 2025-11-20 03:35:51 +00:00
Code Issues Packages Projects Releases Wiki Activity

Clean up homepage styles more

Browse Source
This commit is contained in:
mDuo13
2018-05-04 16:53:29 -07:00
parent d3e09ea231
commit 13abdae81b
7 changed files with 127 additions and 126 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
assets/css/devportal.css
View File

@@ -199,7 +199,7 @@ th {
z-index: 2; z-index: 2;
color: #999999; color: #999999;
font-size: 14px; font-size: 14px;
background: #4e4e50 url(../img/ripple_footer_v2.jpg) repeat-x center center; background: #28282a url(../img/ripple_footer_v2.jpg) repeat-x center center;
background-position-y: -60px; background-position-y: -60px;
} }
@@ -456,22 +456,24 @@ a.current {
position: relative; position: relative;
} }
.landing .level-1 a, .landing .card .level-1 a,
.landing .curated-links li a { .landing .card .curated-links li a {
padding: 16px; padding: 16px 32px 16px 24px;
display: block; display: block;
margin: 0 -24px 0 -24px;
} }
.landing .level-1 a:hover, .landing .card .level-1 a:hover,
.landing .curated-links li a:hover { .landing .card .curated-links li a:hover {
background-color: #F5F7F9; background-color: #F5F7F9;
text-decoration: none; text-decoration: none;
} }
.landing .level-1 a:hover:after, .landing .card .level-1 a:hover:after,
.landing .curated-links li a:hover:after { .landing .card .curated-links li a:hover:after {
content: "\f105"; /* fontawesome angle-right */ content: "\f105"; /* fontawesome angle-right */
font-family: FontAwesome; font-family: FontAwesome;
position: absolute; position: absolute;
right: 16px; right: -8px;
top: 16px;
color: #C9CDD1; color: #C9CDD1;
} }
@@ -527,7 +529,7 @@ a.current {
padding-right: 5px; padding-right: 5px;
} }
.breadcrumbs-wrap .breadcrumb { .breadcrumbs-wrap .breadcrumb {
margin-bottom: 0; padding: 0;
} }
@@ -777,13 +779,13 @@ a.current {
margin-bottom: 0; margin-bottom: 0;
} }
.landing a .card { .landing a.card {
color: #212529; color: #212529;
box-shadow: 0px 1px 3px rgba(35, 41, 47, 0.24); box-shadow: 0px 1px 3px rgba(35, 41, 47, 0.24);
border-radius: 8px; border-radius: 8px;
} }
.landing a:hover .card { .landing a.card:hover {
box-shadow: 0px 4px 24px rgba(35, 41, 47, 0.16); box-shadow: 0px 4px 24px rgba(35, 41, 47, 0.16);
} }
@@ -808,7 +810,7 @@ a.current {
padding: 24px; padding: 24px;
} }
.landing .card-body { .landing .card-header + .card-body {
padding: 0 24px 24px 24px; padding: 0 24px 24px 24px;
} }
@@ -838,10 +840,6 @@ a.current {
text-decoration: none; text-decoration: none;
} }
#xrp_ledger_intro .card {
width: 200px;
}
#xrp_ledger_intro .card-footer { #xrp_ledger_intro .card-footer {
border-width: 0; border-width: 0;
border-radius: 0; border-radius: 0;
@@ -872,6 +870,7 @@ a.current {
font-size: 18px; font-size: 18px;
text-align: center; text-align: center;
font-weight: 300; font-weight: 300;
text-shadow: 0px 1px 2px #171C21;
} }
.splash-head code { .splash-head code {
@@ -943,6 +942,10 @@ a.current {
margin-right: 0; margin-right: 0;
margin-left: -1rem; margin-left: -1rem;
} }
.btn {
white-space: normal;
}
} }
/* Print styles ------------------------------------------------------------- */ /* Print styles ------------------------------------------------------------- */

2
tool/template-base.html
View File

@@ -79,7 +79,7 @@
{% endif %} {% endif %}
<!-- main column --> <!-- main column -->
<main class="main {% if currentpage.sidebar == "disabled" %}col-md-12{% else %}col-md-7 col-lg-6{% endif %} order-md-3 p-0" role="main" id="main_content_body"> <main class="main {% if currentpage.sidebar == "disabled" %}col-md-12{% else %}col-md-7 col-lg-6{% endif %} order-md-3 p-0 {% block mainclasses %}{% endblock %}" role="main" id="main_content_body">
{% block breadcrumbs %} {% block breadcrumbs %}
{% include 'template-breadcrumbs.html' %} {% include 'template-breadcrumbs.html' %}
{% endblock %} {% endblock %}

2
tool/template-breadcrumbs.html
View File

@@ -1,4 +1,4 @@
<nav class="breadcrumbs-wrap" aria-label="breacrumb"> <nav class="breadcrumbs-wrap px-3 px-sm-5" aria-label="breacrumb">
<ul class="breadcrumb bg-white"> <ul class="breadcrumb bg-white">
<li class="breadcrumb-item"><a href="index.html">Home</a></li> <li class="breadcrumb-item"><a href="index.html">Home</a></li>
{% if currentpage.funnel and currentpage != pages|selectattr('funnel', 'equalto', currentpage.funnel)|first %} {% if currentpage.funnel and currentpage != pages|selectattr('funnel', 'equalto', currentpage.funnel)|first %}

2
tool/template-footer.html
View File

@@ -1,5 +1,5 @@
<footer class="ripple-footer" role="contentinfo"> <footer class="ripple-footer" role="contentinfo">
<section class="container-fluid px-5 pt-3 pb-0"> <section class="container-fluid px-1 px-sm-5 pt-3 pb-0">
<div class="row"> <div class="row">
{% set funnels = [] %} {% set funnels = [] %}
{% for page in pages %} {% for page in pages %}

196
tool/template-home.html
View File

@@ -10,12 +10,13 @@
{% endblock %} {% endblock %}
{% block bodyclasses %}landing no-sidebar{% endblock %} {% block bodyclasses %}no-sidebar{% endblock %}
{% block mainclasses %}landing{% endblock %}
{% block breadcrumbs %}{% endblock %} {% block breadcrumbs %}{% endblock %}
{% block main %} {% block main %}
<section class="container-fluid p-5 splash-head"> <section class="container-fluid py-3 p-sm-5 splash-head">
<h1>Learn. Experiment. Integrate. Contribute.</h1> <h1>Learn. Experiment. Integrate. Contribute.</h1>
<div class="row"> <div class="row">
<div class="blurb col-sm-12"> <div class="blurb col-sm-12">
@@ -25,7 +26,7 @@
</div> </div>
</section> </section>
<section class="container-fluid p-5 bg-white" id="home_first_shortcuts"> <section class="container-fluid py-3 p-sm-5 bg-white" id="home_first_shortcuts">
<div class="card-deck mb-4"> <div class="card-deck mb-4">
<div class="card"> <div class="card">
@@ -76,11 +77,11 @@
</section> </section>
<section class="container-fluid bg-light p-5"> <section class="container-fluid bg-light py-3 p-sm-5">
<div class="row"> <div class="row">
<div class="col-sm-6"> <div class="col-sm-6">
<div class="card"> <div class="card mb-4">
<div class="card-header"> <div class="card-header">
<h3 class="card-title">New and Updated Documentation</h3> <h3 class="card-title">New and Updated Documentation</h3>
</div><!--/.card-header--> </div><!--/.card-header-->
@@ -114,7 +115,7 @@
</div><!--/.row--> </div><!--/.row-->
</section> </section>
<section class="container-fluid p-5" id="xrp_ledger_intro"> <section class="container-fluid py-3 p-sm-5" id="xrp_ledger_intro">
<h2><a href="xrp-ledger-overview.html">XRP Ledger: A decentralized cryptographic ledger</a></h2> <h2><a href="xrp-ledger-overview.html">XRP Ledger: A decentralized cryptographic ledger</a></h2>
<div class="row"> <div class="row">
<div class="blurb col-sm-12"> <div class="blurb col-sm-12">
@@ -123,87 +124,90 @@
</div> </div>
</div> </div>
<div class="card-deck mb-4"> <div class="container">
<a href="xrp-ledger-overview.html#the-best-digital-asset"><div class="card m-3"> <div class="card-deck mb-4">
<img class="card-img-top" src="assets/img/triskellion.svg" alt="(XRP triskellion)" />
<div class="card-body">
<!-- <p>XRP is a digital asset native to the XRP Ledger. Anyone with a cryptographic key and an internet connection can receive, hold, and send XRP to anyone else.</p> -->
</div><!--/.card-body-->
<div class="card-footer"><h3>The Digital Asset for Payments</h3></div>
</div><!--/.card--></a>
<a href="xrp-ledger-overview.html#censorship-resistant-transaction-processing"><div class="card m-3"> <a href="xrp-ledger-overview.html#the-best-digital-asset" class="card m-3">
<img class="card-img-top" src="assets/img/dollar-arrow.svg" alt="(money moving)" /> <img class="card-img-top" src="assets/img/triskellion.svg" alt="(XRP triskellion)" />
<div class="card-body"> <div class="card-body">
<!-- <p>No single party decides which XRP transactions succeed or fail, and no one can "roll back" a transaction after it completes.</p> --> <!-- <p>XRP is a digital asset native to the XRP Ledger. Anyone with a cryptographic key and an internet connection can receive, hold, and send XRP to anyone else.</p> -->
</div><!--/.card-body--> </div><!--/.card-body-->
<div class="card-footer"><h3>Censorship-Resistant Transaction Processing</h3></div> <div class="card-footer"><h3>The Digital Asset for Payments</h3></div>
</div><!--/.card--></a> </a><!--/.card-->
<div class="w-100 d-none d-sm-block d-md-none"><!-- wrap every 2 on sm --></div> <a href="xrp-ledger-overview.html#censorship-resistant-transaction-processing" class="card m-3">
<img class="card-img-top" src="assets/img/dollar-arrow.svg" alt="(money moving)" />
<div class="card-body">
<!-- <p>No single party decides which XRP transactions succeed or fail, and no one can "roll back" a transaction after it completes.</p> -->
</div><!--/.card-body-->
<div class="card-footer"><h3>Censorship-Resistant Transaction Processing</h3></div>
</a><!--/.card-->
<a href="xrp-ledger-overview.html#fast-efficient-consensus-algorithm"><div class="card m-3"> <div class="w-100 d-none d-sm-block d-md-none"><!-- wrap every 2 on sm --></div>
<img class="card-img-top" src="assets/img/network.svg" alt="(consensus network)" />
<div class="card-body">
<!-- <p>The XRP Ledger's consensus algorithm settles transactions in 4 to 5 seconds, processing at a throughput of up to 1500 transactions per second.</p> -->
</div><!--/.card-body-->
<div class="card-footer"><h3>Fast, Efficient Consensus Algorithm</h3></div>
</div><!--/.card--></a>
<div class="w-100 d-none d-md-block d-lg-none"><!-- wrap every 3 on md --></div> <a href="xrp-ledger-overview.html#fast-efficient-consensus-algorithm" class="card m-3">
<img class="card-img-top" src="assets/img/network.svg" alt="(consensus network)" />
<div class="card-body">
<!-- <p>The XRP Ledger's consensus algorithm settles transactions in 4 to 5 seconds, processing at a throughput of up to 1500 transactions per second.</p> -->
</div><!--/.card-body-->
<div class="card-footer"><h3>Fast, Efficient Consensus Algorithm</h3></div>
</a><!--/.card-->
<a href="xrp-ledger-overview.html#finite-xrp-supply"><div class="card m-3"> <div class="w-100 d-none d-md-block d-lg-none"><!-- wrap every 3 on md --></div>
<img class="card-img-top" src="assets/img/line-graph.svg" alt="(price graph)" />
<div class="card-body">
<!-- <p>When the XRP Ledger began, 100 billion XRP were created, and no more XRP will ever be created.</p> -->
</div><!--/.card-body-->
<div class="card-footer"><h3>Finite XRP Supply</h3></div>
</div><!--/.card--></a>
<div class="w-100 d-none d-sm-block d-md-none"><!-- wrap every 2 on sm --></div> <a href="xrp-ledger-overview.html#finite-xrp-supply" class="card m-3">
<div class="w-100 d-none d-lg-block"><!-- wrap every 4 on lg/xl --></div> <img class="card-img-top" src="assets/img/line-graph.svg" alt="(price graph)" />
<div class="card-body">
<!-- <p>When the XRP Ledger began, 100 billion XRP were created, and no more XRP will ever be created.</p> -->
</div><!--/.card-body-->
<div class="card-footer"><h3>Finite XRP Supply</h3></div>
</a><!--/.card-->
<a href="xrp-ledger-overview.html#responsible-software-governance"><div class="card m-3"> <div class="w-100 d-none d-sm-block d-md-none"><!-- wrap every 2 on sm --></div>
<img class="card-img-top" src="assets/img/scales.svg" alt="(scales of justice)" /> <div class="w-100 d-none d-lg-block"><!-- wrap every 4 on lg/xl --></div>
<div class="card-body">
<!-- <p>A team of full-time, world-class developers at Ripple maintain and continually improve the XRP Ledger's underlying software.</p> -->
</div><!--/.card-body-->
<div class="card-footer"><h3>Responsible Software Governance</h3></div>
</div><!--/.card--></a>
<a href="xrp-ledger-overview.html#secure-adaptable-cryptography"><div class="card m-3"> <a href="xrp-ledger-overview.html#responsible-software-governance" class="card m-3">
<img class="card-img-top" src="assets/img/lock.svg" alt="(lock)" /> <img class="card-img-top" src="assets/img/scales.svg" alt="(scales of justice)" />
<div class="card-body"> <div class="card-body">
<!-- <p>The XRP Ledger relies on industry standard digital signature systems like ECDSA and also supports modern, efficient algorithms like Ed25519.</p> --> <!-- <p>A team of full-time, world-class developers at Ripple maintain and continually improve the XRP Ledger's underlying software.</p> -->
</div><!--/.card-body--> </div><!--/.card-body-->
<div class="card-footer"><h3>Secure, Adaptable Cryptography</h3></div> <div class="card-footer"><h3>Responsible Software Governance</h3></div>
</div><!--/.card--></a> </a><!--/.card-->
<div class="w-100 d-none d-sm-block d-md-none"><!-- wrap every 2 on sm --></div> <a href="xrp-ledger-overview.html#secure-adaptable-cryptography" class="card m-3">
<div class="w-100 d-none d-md-block d-lg-none"><!-- wrap every 3 on md --></div> <img class="card-img-top" src="assets/img/lock.svg" alt="(lock)" />
<div class="card-body">
<!-- <p>The XRP Ledger relies on industry standard digital signature systems like ECDSA and also supports modern, efficient algorithms like Ed25519.</p> -->
</div><!--/.card-body-->
<div class="card-footer"><h3>Secure, Adaptable Cryptography</h3></div>
</a><!--/.card-->
<a href="xrp-ledger-overview.html#modern-features-for-smart-contracts"><div class="card m-3"> <div class="w-100 d-none d-sm-block d-md-none"><!-- wrap every 2 on sm --></div>
<img class="card-img-top" src="assets/img/gears.svg" alt="(gears)" /> <div class="w-100 d-none d-md-block d-lg-none"><!-- wrap every 3 on md --></div>
<div class="card-body">
<!-- <p>Features like Escrow, Checks, and Payment Channels support cutting-edge financial applications while safety features like Invariant Checks and Amendments provide for stable operation.</p> -->
</div><!--/.card-body-->
<div class="card-footer"><h3>Modern Features for Smart Contracts</h3></div>
</div><!--/.card--></a>
<a href="xrp-ledger-overview.html#on-ledger-decentralized-exchange"><div class="card m-3"> <a href="xrp-ledger-overview.html#modern-features-for-smart-contracts" class="card m-3">
<img class="card-img-top" src="assets/img/exchange.svg" alt="(currency exchange)" /> <img class="card-img-top" src="assets/img/gears.svg" alt="(gears)" />
<div class="card-body"> <div class="card-body">
<!-- <p>The XRP Ledger also has a fully-functional accounting system for tracking and trading obligations denominated in any way users want, and an exchange built into the protocol.</p> --> <!-- <p>Features like Escrow, Checks, and Payment Channels support cutting-edge financial applications while safety features like Invariant Checks and Amendments provide for stable operation.</p> -->
</div><!--/.card-body--> </div><!--/.card-body-->
<div class="card-footer"><h3>On-Ledger Decentralized Exchange</h3></div> <div class="card-footer"><h3>Modern Features for Smart Contracts</h3></div>
</div><!--/.card--></a> </a><!--/.card-->
</div><!--/.card-deck--> <a href="xrp-ledger-overview.html#on-ledger-decentralized-exchange" class="card m-3">
<img class="card-img-top" src="assets/img/exchange.svg" alt="(currency exchange)" />
<div class="card-body">
<!-- <p>The XRP Ledger also has a fully-functional accounting system for tracking and trading obligations denominated in any way users want, and an exchange built into the protocol.</p> -->
</div><!--/.card-body-->
<div class="card-footer"><h3>On-Ledger Decentralized Exchange</h3></div>
</a><!--/.card-->
</div><!--/.card-deck-->
</div><!--/.container-->
</section> </section>
<section class="container-fluid p-5 bg-light"> <section class="container-fluid py-3 p-sm-5 bg-light">
<h2>Built on the XRP Ledger</h2> <h2>Built on the XRP Ledger</h2>
<div class="blurb"> <div class="blurb">
<p>Learn about just a few of the types of integrations developers have built on the XRP Ledger.</p> <p>Learn about just a few of the types of integrations developers have built on the XRP Ledger.</p>
@@ -211,7 +215,7 @@
</div> </div>
<div class="container"> <div class="container">
<div class="card-deck mb-4 p-xl-5"> <div class="row card-deck mb-4 p-xl-5">
<div class="card"> <div class="card">
<div class="card-header"> <div class="card-header">
@@ -263,40 +267,36 @@
</section> </section>
<section class="container-fluid related-projects p-5 bg-white"> <section class="container-fluid related-projects py-3 p-sm-5 bg-white">
<h2>Related Projects</h2> <h2>Related Projects</h2>
<div class="row"> <div class="row">
<div class="col m-2"> <div class="col m-2">
<a class="client-portal-link" href="https://clients.ripple.com/" target="_blank"> <a class="client-portal-link card" href="https://clients.ripple.com/" target="_blank">
<div class="card"> <div class="card-body">
<div class="card-body"> <p>
<p> <img class="project-icon" src="assets/img/RippleNet-condensed.svg" />
<img class="project-icon" src="assets/img/RippleNet-condensed.svg" /> <span class="project-name">Ripple Client Portal</span>
<span class="project-name">Ripple Client Portal</span> <span class="login-required">(login required)</span>
<span class="login-required">(login required)</span> <i class="fa fa-external-link" aria-hidden="true"></i>
<i class="fa fa-external-link" aria-hidden="true"></i> </p>
</p> <p class="project-summary">For financial institutions using Ripple's proprietary solutions to send money globally.</p>
<p class="project-summary">For financial institutions using Ripple's proprietary solutions to send money globally.</p> </div><!--/.card-body-->
</div><!--/.card-body--> </a><!--/.card-->
</div><!--/.card-->
</a>
</div><!--/.col--> </div><!--/.col-->
<div class="col m-2"> <div class="col m-2">
<a class="interledger-link" href="https://interledger.org/" target="_blank"> <a class="interledger-link card" href="https://interledger.org/" target="_blank">
<div class="card"> <div class="card-body">
<div class="card-body"> <p>
<p> <img class="project-icon" src="assets/img/ilp_logo.svg" />
<img class="project-icon" src="assets/img/ilp_logo.svg" /> <span class="project-name">Interledger</span>
<span class="project-name">Interledger</span> <i class="fa fa-external-link" aria-hidden="true"></i>
<i class="fa fa-external-link" aria-hidden="true"></i> </p>
</p> <p class="project-summary">An open protocol suite for connecting all forms of digital money.</p>
<p class="project-summary">An open protocol suite for connecting all forms of digital money.</p> </div><!--/.card-body-->
</div><!--/.card-body--> </a><!--/.card-->
</div><!--/.card-->
</a>
</div><!--/.col--> </div><!--/.col-->
</div><!--/.row--> </div><!--/.row-->

12
tool/template-landing-docs.html
View File

@@ -1,14 +1,12 @@
{% extends "template-base.html" %} {% extends "template-base.html" %}
{% block bodyclasses %}landing{% endblock %} {% block mainclasses %}landing{% endblock %}
{% block main %} {% block main %}
<section class="container-fluid px-5 pb-5 pt-0"> <section class="container-fluid px-3 px-sm-5 pb-5 pt-0">
<div class="row"> <h1 class="main-page-header">XRP Ledger Documentation</h1>
<h1 class="main-page-header">XRP Ledger Documentation</h1> <div class="blurb">
<div class="blurb col-sm-12"> <p>Dive into our documentation and start integrating with the XRP Ledger.</p>
<p>Dive into our documentation and start integrating with the XRP Ledger.</p>
</div>
</div> </div>
<div class="card-deck p-2"> <div class="card-deck p-2">

2
tool/template-landing-references.html
View File

@@ -1,6 +1,6 @@
{% extends "template-base.html" %} {% extends "template-base.html" %}
{% block bodyclasses %}landing{% endblock %} {% block mainclasses %}landing{% endblock %}
{% block main %} {% block main %}
<section class="container-fluid px-5 pb-3 pt-0"> <section class="container-fluid px-5 pb-3 pt-0">