Dave Jarvis' Repositories

git clone https://repo.autonoma.ca/repo/delibero.git
delibero / Commits / c975a16

Layout for discussion page complete.

Author Dave Jarvis <email>
Date 2013-11-11 16:23:46 GMT-0800
Commit c975a16962be0213d56171054b14f1d9c266b5da
Parent 474366c
css/discuss.css
+div.policy-implication-vote-active {
+ color: #46A5E5;
+}
+
+div.policy-implication-vote-inactive {
+ color: #888;
+}
+
+div.policy-overview-text {
+ border-top: 1px solid #182945;
+ border-bottom: 1px solid #182945;
+}
+
+div.policy-implication {
+ clear: both;
+ padding-top: 1em;
+}
+
+div.policy-implication-tally {
+ float: left;
+ padding-right: 1em;
+ line-height: 1em;
+ vertical-align: middle;
+}
+
+div.policy-implication-text {
+ display: inline-block;
+ width: 85%;
+}
+
+div.policy-implication-type {
+ float: left;
+ padding-right: 1em;
+}
+
+div.policy-implication-type-pro,
+div.policy-implication-type-con {
+ font-size: 10pt;
+}
+
+div.policy-implication-type-pro {
+ color: #A1C436;
+}
+
+div.policy-implication-type-con {
+ color: #A50E19;
+}
+
+div.policy-implication-text p {
+ margin: 0;
+ padding: 0;
+}
+
+div.policy-implication-type-flag, a.policy-implication-counter-flag {
+ color: #888;
+ font-size: 10pt;
+ text-align: center;
+}
+
+div.policy-implication-counter {
+ padding-top: 0.5em;
+}
+
+div.policy-implication-counter-mark {
+ float: left;
+ margin-right: 1em;
+ color: #FF7343;
+ text-align: center;
+}
+
+div.policy-implication-counter-text p {
+ display: inline-block;
+ width: 85%;
+}
+
css/summary.css
}
-ol.policy-implication li a, a.internal-link {
- color: #46A5E5;
- text-decoration: none;
-}
-
-a.external-link {
- text-decoration: none;
- color: #FF7343;
-}
-
-a:hover {
- text-decoration: underline;
-}
-
-
css/theme.css
}
+a {
+ text-decoration: none;
+ color: #46A5E5;
+}
+
+a:hover {
+ text-decoration: underline;
+}
+
+a.external-link {
+ color: #FF7343;
+}
+
discuss.html
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="utf-8">
+ <title>World Politics: A System for Rational, Moderated Debate</title>
+
+ <link rel="stylesheet" media="screen" type="text/css"
+ href="http://cdn.aloha-editor.org/latest/css/aloha.css" />
+
+ <link rel="stylesheet" media="screen" href="css/theme.css" />
+ <link rel="stylesheet" media="screen" href="css/discuss.css">
+ <link rel="stylesheet" media="screen" href="tour/tour.css" />
+
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <meta name="author" content="Dave Jarvis">
+ <meta name="description" content="A website for engaging the public about upcoming policies.">
+ <meta name="robots" content="all">
+</head>
+<body id="world-politics">
+
+<div id="header">
+</div>
+
+<div id="main" class="main">
+ <div id="policy-header" class="policy-header">
+ <h1 id="policy-title" class="policy-title">Water Sustainability Act</h1>
+ </div>
+
+ <div id="policy-summary" class="policy-summary">
+ <div id="policy-overview" class="policy-overview">
+ <div id="policy-overview-text" class="policy-overview-text">
+<p>
+We all need water for drinking, washing, cooking, and growing food. Water supports every aspect of a <a class="internal-link" href="">healthy environment</a>, a <a class="internal-link" href="">growing economy</a>, and <a class="internal-link" href="">prosperous communities</a>.
+</p>
+<p>
+While British Columbia has almost 300 unique watersheds (fish-bearing rivers, spectacular lakes, and exceptional wetlands), our water supply is finite. Under growing <a class="internal-link" href="">population pressures</a>, a <a class="internal-link" href="">changing climate</a>, and expanding development, we must ensure that fresh, clean water is sustainably managed for today's needs and for future generations.
+</p>
+<p>
+The Water Sustainability Act replaces the existing <a class="external-link" href="http://www.bclaws.ca/Recon/document/ID/freeside/00_96483_01">Water Act</a>.
+</p>
+ </div>
+ </div>
+ </div>
+
+ <div id="policy-implications" class="policy-implications">
+ <div class="policy-implication">
+ <div class="policy-implication-tally">
+ <div class="policy-implication-vote-active">
+ &#x25B2;
+ </div>
+ <div class="policy-implication-vote-inactive">
+ &#x25BC;
+ </div>
+ </div>
+ <div class="policy-implication-type">
+ <div class="policy-implication-type-pro">
+ [Pro]
+ </div>
+ <div class="policy-implication-type-flag">
+ flag
+ </div>
+ </div>
+ <div class="policy-implication-text">
+ <p>
+ Gather metrics on <a href="support.html">status and usage</a>
+ of aquifers.
+ </p>
+ </div>
+ </div>
+
+ <div class="policy-implication">
+ <div class="policy-implication-tally">
+ <div class="policy-implication-vote-active">
+ &#x25B2;
+ </div>
+ <div class="policy-implication-vote-inactive">
+ &#x25BC;
+ </div>
+ </div>
+ <div class="policy-implication-type">
+ <div class="policy-implication-type-pro">
+ [Pro]
+ </div>
+ <div class="policy-implication-type-flag">
+ flag
+ </div>
+ </div>
+ <div class="policy-implication-text">
+ <p>
+ Well owner information will <a href="">improve understanding</a> of
+ how aquifers interact with lakes and streams.
+ </p>
+ </div>
+ </div>
+
+ <div class="policy-implication">
+ <div class="policy-implication-tally">
+ <div class="policy-implication-vote-inactive">
+ &#x25B2;
+ </div>
+ <div class="policy-implication-vote-active">
+ &#x25BC;
+ </div>
+ </div>
+ <div class="policy-implication-type">
+ <div class="policy-implication-type-pro">
+ [Pro]
+ </div>
+ <div class="policy-implication-type-flag">
+ flag
+ </div>
+ </div>
+ <div class="policy-implication-text">
+ <p>
+ Improve aquifer management.
+ </p>
+
+ <div class="policy-implication-counter">
+ <div class="policy-implication-counter-mark">
+ [Counter]<br />
+ <a class="policy-implication-counter-flag" href="">flag</a>
+ </div>
+ <div class="policy-implication-counter-text">
+ Hypothesis requires further research to quantify how much
+ economic improvement is expected.
+ </div>
+ </div>
+ </div>
+
+ <div class="policy-implication">
+ <div class="policy-implication-tally">
+ <div class="policy-implication-vote-inactive">
+ &#x25B2;
+ </div>
+ <div class="policy-implication-vote-active">
+ &#x25BC;
+ </div>
+ </div>
+ <div class="policy-implication-type">
+ <div class="policy-implication-type-con">
+ [Con]
+ </div>
+ <div class="policy-implication-type-flag">
+ flag
+ </div>
+ </div>
+ <div class="policy-implication-text">
+ <p>
+ Short-term increased tax-payer costs to
+ <a href="">implement infrastructure</a> for trend analysis.
+ </p>
+
+ </div>
+ </div>
+ </div>
+
+ <div class="policy-implication">
+ <div class="policy-implication-tally">
+ <div class="policy-implication-vote-active">
+ &#x25B2;
+ </div>
+ <div class="policy-implication-vote-inactive">
+ &#x25BC;
+ </div>
+ </div>
+ <div class="policy-implication-type">
+ <div class="policy-implication-type-con">
+ [Con]
+ </div>
+ <div class="policy-implication-type-flag">
+ flag
+ </div>
+ </div>
+ <div class="policy-implication-text">
+ <p>
+ Small-volume license holders would be required to measure,
+ record, and report water use in <a href="">certain circumstances</a>
+ under the <a href="">Area-Based Regulations Act</a>.
+ </p>
+
+ <div class="policy-implication-counter">
+ <div class="policy-implication-counter-mark">
+ [Counter]<br />
+ <a class="policy-implication-counter-flag" href="">flag</a>
+ </div>
+ <div class="policy-implication-counter-text">
+ <p>
+ Long-term cost savings of improved infrastructure will be
+ ear-marked for installation of
+ <a href="">automatic recording devices</a> to reduce impact
+ on small-volume license holders and help homogeneous data
+ collection.
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="policy-implication">
+ <div class="policy-implication-tally">
+ <div class="policy-implication-vote-inactive">
+ &#x25B2;
+ </div>
+ <div class="policy-implication-vote-inactive">
+ &#x25BC;
+ </div>
+ </div>
+ <div class="policy-implication-type">
+ <div class="policy-implication-type-pro">
+ [Pro]
+ </div>
+ <div class="policy-implication-type-flag">
+ flag
+ </div>
+ </div>
+ <div class="policy-implication-text">
+ <p>
+ Increase <a href="">water use efficiency</a>.
+ </p>
+ </div>
+ </div>
+
+ <div class="policy-implication">
+ <div class="policy-implication-tally">
+ <div class="policy-implication-vote-inactive">
+ &#x25B2;
+ </div>
+ <div class="policy-implication-vote-inactive">
+ &#x25BC;
+ </div>
+ </div>
+ <div class="policy-implication-type">
+ <div class="policy-implication-type-pro">
+ [Pro]
+ </div>
+ <div class="policy-implication-type-flag">
+ flag
+ </div>
+ </div>
+ <div class="policy-implication-text">
+ <p>
+ Protect <a href="">critical environment flows</a> to ensure water
+ availability for essential household use.
+ </p>
+ </div>
+ </div>
+
+ <div class="policy-implication">
+ <div class="policy-implication-tally">
+ <div class="policy-implication-vote-inactive">
+ &#x25B2;
+ </div>
+ <div class="policy-implication-vote-inactive">
+ &#x25BC;
+ </div>
+ </div>
+ <div class="policy-implication-type">
+ <div class="policy-implication-type-pro">
+ [Pro]
+ </div>
+ <div class="policy-implication-type-flag">
+ flag
+ </div>
+ </div>
+ <div class="policy-implication-text">
+ <p>
+ Provide area-based approach for <a href="">effective management</a>
+ of low streamflows and high water demand.
+ </p>
+ </div>
+ </div>
+
+ <div class="policy-implication">
+ <div class="policy-implication-tally">
+ <div class="policy-implication-vote-inactive">
+ &#x25B2;
+ </div>
+ <div class="policy-implication-vote-inactive">
+ &#x25BC;
+ </div>
+ </div>
+ <div class="policy-implication-type">
+ <div class="policy-implication-type-pro">
+ [Pro]
+ </div>
+ <div class="policy-implication-type-flag">
+ flag
+ </div>
+ </div>
+ <div class="policy-implication-text">
+ <p>
+ <a href="">Increased certainty</a> of water availability, especially
+ in areas of intensive water use subject to chronic water scarcity.
+ </p>
+ </div>
+ </div>
+
+ <div class="policy-implication">
+ <div class="policy-implication-tally">
+ <div class="policy-implication-vote-inactive">
+ &#x25B2;
+ </div>
+ <div class="policy-implication-vote-inactive">
+ &#x25BC;
+ </div>
+ </div>
+ <div class="policy-implication-type">
+ <div class="policy-implication-type-pro">
+ [Pro]
+ </div>
+ <div class="policy-implication-type-flag">
+ flag
+ </div>
+ </div>
+ <div class="policy-implication-text">
+ <p>
+ Wider <a href="">participation</a> in decisions and water governance
+ approaches.
+ </p>
+ </div>
+ </div>
+
+ </div>
+</div>
+
+<div id="footer">
+</div>
+
+<script type="text/javascript"
+ src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
+
+<script type="text/javascript" src="tour/tour.js"></script>
+<script type="text/javascript" src="js/discuss.js"></script>
+</body>
+</html>
+
index.html
<title>World Politics: A System for Rational, Moderated Debate</title>
- <link rel="stylesheet" media="screen" href="css/interest.css">
- <link rel="stylesheet" media="screen" href="css/theme.css">
-
+ <link rel="stylesheet" media="screen" href="css/theme.css" />
+ <link rel="stylesheet" media="screen" href="css/interest.css" />
<link rel="stylesheet" media="screen" href="tour/tour.css" />
</div>
-<script type="text/javascript"
- src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
+<script
+ src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="tour/tour.js"></script>
<script type="text/javascript" src="js/interest.js"></script>
js/discuss.js
+var index = 0;
+var tours = [
+ {
+ "a": 85,
+ "e": "body",
+ "t": 'This page ...'
+ },
+];
+
+function nextTour() {
+ $(tours[index].e).grumble({
+ text: tours[index].t,
+ angle: tours[index].a,
+ distance: tours[index].d,
+ hideOnClick: true,
+ onHide: function( grumble, button ) {
+ index++;
+
+ if( index < tours.length ) {
+ nextTour();
+ }
+ }
+ });
+}
+
+$(document).ready( function() {
+ nextTour();
+});
js/summary.js
"d": -120,
"e": "div.policy-overview-text",
- "t": 'Introduction text explains why the policy is needed.'
+ "t": 'Introduction text explains why the policy is needed. Users can directly edit the text to propose changes (subject to moderation).'
},
{
"d": -5,
"e": "a#policy-feedback-edit",
- "t": 'Users can submit moderated changes to introduction text and policy tags. Edits are made using a WYSIWYG word processor.'
+ "t": 'Users can enable direct editing of introductory text and tags.'
},
{
"a": 180,
"d": -5,
"e": "a#policy-feedback-flag",
- "t": 'Users can flag the policy for moderator attention.'
+ "t": 'Users can raise issues with the introductory text that require moderator attention or intervention.'
},
{
"a": 180,
"d": -5,
"e": "div.policy-implications-pro ol.policy-implication li:first",
- "t": 'Positive policy implications are displayed sorted by most advantageous.'
+ "t": 'The highest-rated positive policy implications are displayed, sorted by most advantageous.'
},
{
"a": 180,
"d": -5,
"e": "div.policy-implications-con ol.policy-implication li:first",
- "t": 'Negative policy implications are displayed sorted by most disadvantageous.'
+ "t": 'The highest-rated negative policy implications are displayed, sorted by most disadvantageous.'
},
{
"a": 180,
"d": -5,
"e": "a.proposal",
- "t": 'Provides the complete proposal text (such as legislation).'
+ "t": 'Provides the complete proposal text. Legislative text is presented alongside its layperson translation.'
},
{
"a": 180,
"d": -5,
"e": "a#policy-feedback-discuss",
- "t": 'Link to the discussion page where benefits and drawbacks are debated. Continue to the discussion page using the discuss link.'
+ "t": 'Link to the discussion page where all benefits and drawbacks are debated. Select the discuss link to view the debate page.'
},
];
nextTour();
});
+
summary.html
<title>World Politics: A System for Rational, Moderated Debate</title>
+ <link rel="stylesheet" media="screen" href="css/theme.css" />
<link rel="stylesheet" media="screen" href="css/summary.css">
- <link rel="stylesheet" media="screen" href="css/theme.css">
-
<link rel="stylesheet" media="screen" href="tour/tour.css" />
</div>
</div>
- <div id="policy-overview-text" class="policy-overview-text">
+ <div id="policy-overview-text" class="policy-overview-text editable">
<p>
We all need water for drinking, washing, cooking, and growing food. Water supports every aspect of a <a class="internal-link" href="">healthy environment</a>, a <a class="internal-link" href="">growing economy</a>, and <a class="internal-link" href="">prosperous communities</a>.
Protect <a href="">critical environment flows</a> to ensure water
availability for essential household use.
- </li>
- <li>
- Provide area-based approach for <a href="">effective management</a>
- of low streamflows and high water demand.
- </li>
- <li>
- <a href="">Increased certainty</a> of water availability, especially
- in areas of intensive water use subject to chronic water scarcity.
- </li>
- <li>
- Wider <a href="">participation</a> in decisions and water governance
- approaches.
</li>
</ol>
<script type="text/javascript"
- src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
+ src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
+
<script type="text/javascript" src="tour/tour.js"></script>
<script type="text/javascript" src="js/summary.js"></script>
Delta 468 lines added, 43 lines removed, 425-line increase