lxbfYeaa/PayPal-PHP-SDK
Archived
Template
1
0
Fork 0
forked from LiveCarta/PayPal-PHP-SDK
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

More Sample UI Changes

Browse Source 
- Making it pretty
- Have a footer now, with links to useful data
This commit is contained in:
japatel
2014-11-17 19:36:11 -06:00
parent f6947f3b06
commit affd4dbd8f
3 changed files with 117 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
sample/common.php
View File

@@ -52,9 +52,9 @@ class ResultPrinter
if (self::$printResultCounter == 0) {
include "header.html";
echo '<br />
<div class="row"><div class="col-md-2 pull-left"><a href="../index.html"><h4>&#10094;&#10094; Back to Samples</h4></a><br /><br /></div>
<div class="col-md-1 pull-right"><img src="../images/pp_v_rgb.png" height="70" /></div> </div><div class="clearfix visible-xs-block"></div>';
echo '
<div class="row header"><div class="col-md-3 pull-left"><br /><a href="../index.html"><h3>&#10094;&#10094; Back to Samples</h3></a><br /><br /></div> <br />
<div class="col-md-2 pull-right"><img src="../images/pp_v_rgb.png" height="70" /></div> </div><div class="clearfix visible-xs-block"></div><br />';
echo '<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">';
}
self::$printResultCounter++;

38
sample/header.html
View File

@@ -44,6 +44,43 @@
margin-right: 0px;
margin-left: 0px;
}
.header {
background: -webkit-linear-gradient(-9deg, #428bca 75%, white 35%);
color: #EEE;
}
.header a:link, .header a:visited, .header a:hover, .header a:active {
text-decoration: none;
color: #EEE;
}
/* Sticky footer styles
-------------------------------------------------- */
html {
position: relative;
min-height: 100%;
}
body {
/* Margin bottom by footer height */
margin-bottom: 60px;
}
.footer {
position: absolute;
bottom: 0;
width: 100%;
/* Set the fixed height of the footer here */
min-height: 60px;
background: -webkit-linear-gradient(-9deg, #428bca 70%, white 25%);
}
.footer .footer-links, .footer .footer-links li {
display: inline-block;
padding: 5px 8px;
font-size: 110%;
}
.footer a {
color: #EEE;
text-decoration: none;
}
/*
.string { color: green; }
.number { color: darkorange; }
@@ -65,6 +102,7 @@
$( document ).ready(function() {
$("#accordion .panel-collapse:last").collapse('toggle');
$(document.body).append('<footer class="footer"> <div class="container"> <div class="footer-div"> <ul class="footer-links"> <li> <a href="https://github.com/paypal/PayPal-PHP-SDK" target="_blank"><i class="fa fa-github"></i> Github</a></li><li> <a href="https://developer.paypal.com/webapps/developer/docs/api/" target="_blank"><i class="fa fa-book"></i> REST API Reference</a> </li><li> <a href="https://github.com/paypal/PayPal-PHP-SDK/issues" target="_blank"><i class="fa fa-exclamation-triangle"></i> Report Issues </a> </li></ul> </div></div></footer>');
/*
$(".prettyprint").each(function() {

80
sample/index.html
View File

@@ -18,6 +18,62 @@
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
}
@media (max-width: 992px) {
.jumbotron {
background: white;
color: #000;
}
.footer {
background: #428bca;
color: #000;
}
}
@media (min-width: 992px) {
.jumbotron {
background: -webkit-linear-gradient(-9deg, white 30%, #428bca 25%);
color: #EEE;
}
}
@media (max-width: 1600px) {
.logo {
position: relative;
}
}
@media (min-width: 1600px) {
.logo {
position: fixed;
top: 40px;
}
}
html {
position: relative;
min-height: 100%;
}
body {
/* Margin bottom by footer height */
margin-bottom: 60px;
}
.footer {
position: absolute;
bottom: 0;
width: 100%;
min-height: 60px;
background: -webkit-linear-gradient(-9deg, #428bca 70%, white 25%);
}
.footer .footer-links, .footer .footer-links li {
display: inline-block;
padding: 5px 8px;
font-size: 110%;
}
.footer a {
color: #EEE;
text-decoration: none;
}
</style>
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
@@ -29,12 +85,12 @@
<body>
<!-- Main component for a primary marketing message or call to action -->
<div class="jumbotron">
<div class="container">
<div class="container-fluid">
<div class="row">
<div class="col-md-3">
<img src="images/pp_v_rgb.png" height="200" />
<div class="col-md-4 pull-left">
<img src="images/pp_v_rgb.png" class="logo" height="200" />
</div>
<div class="col-md-9">
<div class="col-md-8 pull-right">
<h1> REST API Samples</h1>
<p>These examples are created to experiment with the PayPal-PHP-SDK capabilities. Each examples are designed to demonstrate the default use-cases in each segment.
Many examples should be executable, and should allow you to experience the default behavior of our sdk, to expedite your integration experience.</p>
@@ -521,7 +577,23 @@
</div>
</div>
</div> <!-- /container -->
<footer class="footer">
<div class="container">
<div class="footer-div">
<ul class="footer-links">
<li>
<a href="https://github.com/paypal/PayPal-PHP-SDK" target="_blank"><i class="fa fa-github"></i> Github</a></li>
<li>
<a href="https://developer.paypal.com/webapps/developer/docs/api/" target="_blank"><i class="fa fa-book"></i> REST API Reference</a>
</li>
<li>
<a href="https://github.com/paypal/PayPal-PHP-SDK/issues" target="_blank"><i class="fa fa-exclamation-triangle"></i> Report Issues </a>
</li>
</ul>
</div>
</div>
</footer>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->