CivicIdeas Surveys Show
by Pete Fecteau
HTML
<script src="https://buttonpresser.com/CivicIdeas_BS/js/bootstrap.min.js"></script>
<script src="https://buttonpresser.com/CivicIdeas_BS/js/faux-feed.js"></script>
<div class="standard-nav alone navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<div class="nav-collapse" id="main-menu">
<ul class="nav" id="main-menu-left">
<li class="nav-home"><a href="#">Home</a></li>
<li class="nav-ideas"><a href="#">Ideas</a></li>
<li class="nav-projects"><a href="#">Projects</a></li>
<li class="nav-discussions"><a href="#">Discussions</a></li>
<li class="nav-forums"><a href="#">Forums</a></li>
<li class="nav-meetings"><a href="#">Meetings</a></li>
<li class="nav-surveys active"><a href="#">Surveys</a></li>
</ul>
<ul class="nav pull-right" id="main-menu-right">
<li class="language">
<div id="google_translate_element"></div>
</li>
<li>
<form class="navbar-search pull-left" action="">
<input type="text" class="search-query span2" placeholder="Search" />
</form>
</li>
<li class="dropdown">
<a href="/users/sign_in" id="navbar-login">Login or Register</a>
<ul class="dropdown-menu" id="swatch-menu">
<li><a href="../default">Log Out</a></li>
<li class="divider"></li>
<li><a href="#">Edit Profile</a></li>
<li><a href="#">My Ideas</a></li>
<li><a href="#">My Connections</a></li>
<li><a href="#">My Apps</a></li>
</ul>
</li>
...
SCSS
@import url('https://buttonpresser.com/CivicIdeas_BS/css/bootstrap.css');
@import url('https://buttonpresser.com/CivicIdeas_BS/css/bootstrap-custom.css');
@import url('https://buttonpresser.com/CivicIdeas_BS/css/global-nav.css');
@import url('https://buttonpresser.com/CivicIdeas_BS/css/global-sidebar.css');
@import url('https://buttonpresser.com/CivicIdeas_BS/css/global-footer.css');
body {background:#DEDFE0;}
section.survey {
border-bottom: 1px solid #DEDFE0;
padding-bottom:20px;
&:last-child {
border:none;
}
h2 {
margin-top:35px;
}
.badge.date {
margin-top:-36px;
}
.body {
margin:0 0 20px 0;
padding-top:10px;
.image {
max-width:220px;
margin:0 20px 10px 0;
float:left;
}
.cite {
display:block;
margin-bottom:-10px;
font-size:12px;
color:#939598;
.avatar {
max-width:220px;
max-width:20px;
max-height:20px;
margin:0 10px 0 0;
}
}
}
}
section.single-survey {
padding-top:0;
fieldset {
padding-top:20px
}
.full-survey {
height:120px;
background-color:#28a2d5;
&:after {
display:block;
content: "";
float:right;
width:0;
height:0;
line-height:0;
margin:0 0 -20px -20px;
border: 40px solid #2082aa;
border-top-color:#FFF;
border-right-color:#FFF;
}
h2 {
color:#FFF;
padding:40px 20px 20px;
float:left;
...