[Bps-public-commit] RT-Extension-FeaturedTickets branch, master, updated. 2cb8bc50152e1b86a904351d09358d1998a74117
Jim Brandt
jbrandt at bestpractical.com
Thu Mar 15 15:49:56 EDT 2018
The branch, master has been updated
via 2cb8bc50152e1b86a904351d09358d1998a74117 (commit)
from 5a977fe92e380d752cf92bf44ab835c81e6866e0 (commit)
Summary of changes:
html/NoAuth/Featured/Details.html | 9 +-
html/NoAuth/Featured/index.html | 124 +++++++++++--
lib/RT/Extension/FeaturedTickets.pm | 2 +
static/css/featured-tickets.css | 244 +++++++++++++++++++++++++
static/images/rawpixel-com-250087-unsplash.jpg | Bin 0 -> 2658936 bytes
5 files changed, 363 insertions(+), 16 deletions(-)
create mode 100644 static/css/featured-tickets.css
create mode 100644 static/images/rawpixel-com-250087-unsplash.jpg
- Log -----------------------------------------------------------------
commit 2cb8bc50152e1b86a904351d09358d1998a74117
Author: Jim Brandt <jbrandt at bestpractical.com>
Date: Thu Mar 15 15:49:29 2018 -0400
Add initial design for main page
diff --git a/html/NoAuth/Featured/Details.html b/html/NoAuth/Featured/Details.html
index 2b7fd71..1dbf9d4 100644
--- a/html/NoAuth/Featured/Details.html
+++ b/html/NoAuth/Featured/Details.html
@@ -13,17 +13,20 @@
<input placeholder="Name" name="Name">
<input placeholder="Email" type="email" name="Email" required>
<input placeholder="Address" name="Address">
- <input name="ticketId" value="<% $ticketId %>" type="hidden">
+ <input name="ticket_id" value="<% $ticket_id %>" type="hidden">
<input type="submit" name="Sponsor" value="Submit">
</form>
</div>
<%init>
+# Add some code to handle no ticket id being passed.
+# Show a page with a nice message and a link back to the main page.
+
my $ticket = RT::Ticket->new(RT->SystemUser);
-my ($ret, $msg) = $ticket->Load( $ticketId );
+my ($ret, $msg) = $ticket->Load( $ticket_id );
return ($ret, $msg) unless $ret;
</%init>
<%args>
-$ticketId
+$ticket_id => undef
</%args>
diff --git a/html/NoAuth/Featured/index.html b/html/NoAuth/Featured/index.html
index 2520317..42e2f18 100644
--- a/html/NoAuth/Featured/index.html
+++ b/html/NoAuth/Featured/index.html
@@ -1,20 +1,118 @@
-<h1 align='center'>Features</h1>
+<!doctype html>
+<html lang="en">
+<head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <meta name="description" content="A list of proposed features for Request Tracker (RT) available for sponsorship.">
+ <title>Request Tracker Sponsored Features</title>
+
+ <link rel="stylesheet" href="https://unpkg.com/purecss@1.0.0/build/pure-min.css" integrity="sha384-nn4HPE8lTHyVtfCBi5yW9d20FjT8BJwUXyWZT9InLYax14RDjBj46LmSztkmNP9w" crossorigin="anonymous">
+
+ <!--[if lte IE 8]>
+ <link rel="stylesheet" href="https://unpkg.com/purecss@1.0.0/build/grids-responsive-old-ie-min.css">
+ <![endif]-->
+ <!--[if gt IE 8]><!-->
+ <link rel="stylesheet" href="https://unpkg.com/purecss@1.0.0/build/grids-responsive-min.css"
+ <!--<![endif]-->
-<ul class="cards-content">
+ <!--[if lte IE 8]>
+ <link rel="stylesheet" href="/combo/1.18.13?/css/layouts/pricing-old-ie.css">
+ <![endif]-->
+ <!--[if gt IE 8]><!-->
+ <link rel="stylesheet" href="/static/css/featured-tickets.css">
+ <!--<![endif]-->
+ <!--[if lt IE 9]>
+ <script src="http://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7/html5shiv.js"></script>
+ <![endif]-->
+<!-- Add google analytics tags here -->
+</head>
+<body>
+
+<div class="logo">
+ <a href="https://bestpractical.com" class="logo-link"><img src="https://static.bestpractical.com/bpslogo.png" alt="Best Practical Solutions logo"></a>
+</div>
+
+<div class="banner">
+ <h1 class="banner-head">
+ Request Tracker (RT)<br>
+ Sponsor a feature or fix
+ </h1>
+</div>
+<div class="l-content">
+ <div class="pricing-tables pure-g">
% while ( my $ticket = $tickets->Next ) {
- <li>
- <h2><% $ticket->Subject ? $ticket->Subject : 'Ticket: ' . $ticket->Id %></h2>
- <h3><% $ticket->FirstCustomFieldValue('Description') %></h3>
- <form action="/NoAuth/Featured/Details.html">
- <button type="submit" name="ticketId" value="<% $ticket->Id %>" class="button">READ!</button>
- </form>
- </li>
+ <div class="pure-u-1 pure-u-md-1-3">
+ <div class="pricing-table pricing-table-free">
+ <div class="pricing-table-header">
+ <h2><% $ticket->Subject ? $ticket->Subject : 'Ticket: ' . $ticket->Id %></h2>
+ <p class="feature-details"><% $ticket->FirstCustomFieldValue('Description') %></p>
+ </div>
+
+ <ul class="pricing-table-list">
+ <li>Awesome point 1</li>
+ <li>Awesome point 2</li>
% if ( $ticket->FirstCustomFieldValue('Funded') ) {
- Funded!
+ <li>Funded!</li>
% }
- </li>
-% }
-</ul>
+ </ul>
+ <form action="/NoAuth/Featured/Details.html">
+ <button type="submit" class="button-choose pure-button" name="ticket_id" value="<% $ticket->Id %>">Details</button>
+ </form>
+ </div>
+ </div>
+%}
+ </div> <!-- end pricing-tables -->
+
+ <div class="information pure-g">
+ <div class="pure-u-1 pure-u-md-1-2">
+ <div class="l-box">
+ <h3 class="information-head">Get started today</h3>
+ <p>
+ Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.
+ </p>
+ </div>
+ </div>
+
+ <div class="pure-u-1 pure-u-md-1-2">
+ <div class="l-box">
+ <h3 class="information-head">Pay monthly or annually</h3>
+ <p>
+ Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ullamco laboris nisi ut aliquip ex ea commodo
+ consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse.
+ </p>
+ </div>
+ </div>
+
+ <div class="pure-u-1 pure-u-md-1-2">
+ <div class="l-box">
+ <h3 class="information-head">24/7 customer support</h3>
+ <p>
+ Cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+ </p>
+ </div>
+ </div>
+
+ <div class="pure-u-1 pure-u-md-1-2">
+ <div class="l-box">
+ <h3 class="information-head">Cancel your plan anytime</h3>
+ <p>
+ Duis aute irure dolor in reprehenderit in voluptate velit esse
+ cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
+ </p>
+ </div>
+ </div>
+ </div> <!-- end information -->
+</div> <!-- end l-content -->
+
+<div class="footer l-box">
+ <p>
+Header image courtesy of <a href='https://unsplash.com/@rawpixel'>@rawpixel</a> on <a href='http://unsplash.com/'>Unsplash</a>.
+ </p>
+</div>
+
+</body>
+</html>
+
<%init>
my $queue = RT::Queue->new(RT->SystemUser);
my ($ret, $msg) = $queue->Load(RT->Config->Get('FeaturedTicketsQueue'));
diff --git a/lib/RT/Extension/FeaturedTickets.pm b/lib/RT/Extension/FeaturedTickets.pm
index 8cb2659..3cc01cd 100644
--- a/lib/RT/Extension/FeaturedTickets.pm
+++ b/lib/RT/Extension/FeaturedTickets.pm
@@ -4,6 +4,8 @@ package RT::Extension::FeaturedTickets;
our $VERSION = '0.01';
+RT->AddStyleSheets("featured-tickets.css");
+
=head1 NAME
RT-Extension-FeaturedTickets - [One line description of module's purpose here]
diff --git a/static/css/featured-tickets.css b/static/css/featured-tickets.css
new file mode 100644
index 0000000..04bbf0c
--- /dev/null
+++ b/static/css/featured-tickets.css
@@ -0,0 +1,244 @@
+/*
+ * -- BASE STYLES --
+ * Most of these are inherited from Base, but I want to change a few.
+ */
+body {
+ color: #526066;
+ background: #E8E8E8;
+}
+
+h2, h3 {
+ letter-spacing: 0.25em;
+ text-transform: uppercase;
+ font-weight: 600;
+}
+
+p {
+ line-height: 1.6em;
+}
+
+.logo {
+ position: absolute;
+ width 183px;
+ margin-left: -92px;
+ left: 50%;
+ border: 3px solid white;
+ background: white;
+}
+
+/*
+ * -- Layout Styles --
+ */
+.l-content {
+ margin: 0 auto;
+}
+
+.l-box {
+ padding: 0.5em 2em;
+}
+
+/*
+ * -- MENU STYLES --
+ * Make the menu have a very faint box-shadow.
+ */
+.pure-menu {
+ box-shadow: 0 1px 1px rgba(0,0,0, 0.10);
+}
+
+.pure-menu-link {
+ padding: .5em .7em;
+}
+
+
+/*
+ * -- BANNER --
+ * The top banner with the headings. By using a combination
+ * of `display: table;` and `display: table-cell;`, we can
+ * vertically center the text.
+ */
+
+.banner {
+ background: transparent
+ url('/static/images/rawpixel-com-250087-unsplash.jpg') 0 0 no-repeat fixed;
+ text-align: center;
+ background-size: cover;
+ filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/static/images/rawpixel-com-250087-unsplash.jpg', sizingMethod='scale');
+ height: 200px;
+ width: 100%;
+ margin-bottom: 3em;
+ display: table;
+}
+
+.banner-head {
+ display: table-cell;
+ vertical-align: middle;
+ margin-bottom: 0;
+ font-size: 2em;
+ color: white;
+ font-weight: 500;
+ text-shadow: 0 1px 1px black;
+}
+
+
+
+/*
+ * -- PRICING TABLE WRAPPER --
+ * This element wraps up all the pricing table elements
+ */
+ .pricing-tables,
+ .information {
+ max-width: 980px;
+ margin: 0 auto;
+ }
+.pricing-tables {
+ margin-bottom: 3.125em;
+ text-align: center;
+}
+
+/*
+ * -- PRICING TABLE --
+ * Every pricing table has the .pricing-table class
+ */
+.pricing-table {
+ border: 1px solid #ddd;
+ margin: 0 0.5em 2em;
+ padding: 0 0 3em;
+}
+
+/*
+ * -- PRICING TABLE HEADER COLORS --
+ * Choose a different color based on the type of pricing table.
+ */
+.pricing-table-free .pricing-table-header {
+ background: #519251;
+}
+
+.pricing-table-biz .pricing-table-header {
+ background: #2c4985;
+}
+
+/*
+ * -- PRICING TABLE HEADER --
+ * By default, a header is black/white, and has some styles for its <h2> name.
+ */
+.pricing-table-header {
+ background: #111;
+ color: #fff;
+ padding-bottom: 2px;
+}
+.pricing-table-header h2 {
+ margin: 0;
+ padding-top: 2em;
+ font-size: 1em;
+ font-weight: normal;
+
+}
+
+.feature-details {
+ padding-left: 2em;
+ padding-right: 2em;
+}
+
+/*
+ * -- PRICING TABLE PRICE --
+ * Styles for the price and the corresponding <span>per month</span>
+ */
+.pricing-table-price {
+ font-size: 6em;
+ margin: 0.2em 0 0;
+ font-weight: 100;
+}
+ .pricing-table-price span {
+ display: block;
+ text-transform: uppercase;
+ font-size: 0.2em;
+ padding-bottom: 2em;
+ font-weight: 400;
+ color: rgba(255, 255, 255, 0.5);
+ *color: #fff;
+ }
+
+
+
+/*
+ * -- PRICING TABLE LIST --
+ * Each pricing table has a <ul> which is denoted by the .pricing-table-list class
+ */
+.pricing-table-list {
+ list-style-type: none;
+ margin: 0;
+ padding: 0;
+ text-align: center;
+}
+
+
+/*
+ * -- PRICING TABLE LIST ELEMENTS --
+ * Styles for the individual list elements within each pricing table
+ */
+.pricing-table-list li {
+ padding: 0.8em 0;
+ background: #f7f7f7;
+ border-bottom: 1px solid #e7e7e7;
+}
+
+
+/*
+ * -- PRICING TABLE BUTTON --
+ * Styles for the "Choose" button at the bottom of a pricing table.
+ * This inherits from Pure Button.
+ */
+.button-choose {
+ border: 1px solid #ccc;
+ background: #fff;
+ color: #333;
+ border-radius: 2em;
+ font-weight: bold;
+ position: relative;
+ bottom: -1.5em;
+}
+
+.information-head {
+ color: black;
+ font-weight: 500;
+}
+
+.footer {
+ background: #111;
+ color: #888;
+ text-align: center;
+}
+ .footer a {
+ color: #ddd;
+ }
+
+
+
+/*
+ * -- TABLET MEDIA QUERIES --
+ * On tablets, we want to slightly adjust the size of the banner
+ * text and add some vertical space between the various pricing tables
+ */
+ at media(min-width: 767px) {
+
+ .banner-head {
+ font-size: 4em;
+ }
+ .pricing-table {
+ margin-bottom: 0;
+ }
+
+}
+
+/*
+ * -- PHONE MEDIA QUERIES --
+ * On phones, we want to reduce the height and font-size of the banner further
+ */
+ at media (min-width: 480px) {
+ .banner {
+ height: 400px;
+ }
+ .banner-head {
+ font-size: 3em;
+ }
+}
diff --git a/static/images/rawpixel-com-250087-unsplash.jpg b/static/images/rawpixel-com-250087-unsplash.jpg
new file mode 100644
index 0000000..27c7550
Binary files /dev/null and b/static/images/rawpixel-com-250087-unsplash.jpg differ
-----------------------------------------------------------------------
More information about the Bps-public-commit
mailing list