rollup and roll down big posts. fix some button css

This commit is contained in:
Dan Ballard 2016-01-09 08:32:39 -08:00
parent b45d101657
commit 94221611c1
5 changed files with 40 additions and 6 deletions

View File

@ -38,10 +38,28 @@ body {
font-size: 12px;
}
.post-preview {
.post-content {
font-size: 12px;
min-height: 5em;
height: 5em;
overflow: hidden;
padding-bottom: 10px;
}
.post-content blockquote {
font-size: 12px;
font-family: serif;
}
.content-slider {
text-align: center;
font-weight: bold;
font-size: 16px;
border-radius: 3px;
padding: 0px;
}
.post-delete, .post-edit {
font-size: 12px;
}

View File

@ -42,4 +42,16 @@ $(document).ready( function () {
form.submit();
}
});
$(".content-slider").click(function (e) {
var contentDiv = $(this).parents('.news-row').find('.post-content');
if (contentDiv.hasClass("state-up")) {
contentDiv.removeClass('state-up').addClass('state-down').animate({height: '100%'});
$(this).html('^');
} else {
contentDiv.removeClass('state-down').addClass('state-up').animate({height: '5em'});
$(this).html('v');
}
});
});

View File

@ -41,7 +41,7 @@
<ul class="nav navbar-nav navbar-right">
{{if .user}}
<li><a href="">{{.user.Username}}</a></li>
<li><form method="POST" action="/logout">{{ .csrfField }}<input type="submit" value="Logout" class="btn btn-sm btn-primary btn-block" /></form></li>
<li><form method="POST" action="/logout">{{ .csrfField }}<input type="submit" value="Logout" class="btn-sm btn-primary btn-block" /></form></li>
{{else}}
<li><a href="/login">Log in</a></li>
{{end}}

View File

@ -35,7 +35,7 @@ new category select
</div>
<div class="col-xs-1">
<form method="POST" action="/categories/{{.category.Id}}/delete" class="cat-delete">{{ $.csrfField }}
<input type="submit" class="btn btn-sm btn-block" value="Delete" />
<input type="submit" class="btn btn-default btn-sm btn-block" value="Delete" />
</form>
</div>
<div class="col-xs-3">

View File

@ -39,17 +39,21 @@
<div class="col-xs-8 post-url">
<a href="{{.post.Url}}">{{truncate .post.Url 100}}</a>
</div>
<div class="col-xs-2 post-edit"><a href="/news/{{.post.Id}}/edit" class="btn btn-sm btn-block">Edit</a></div>
<div class="col-xs-2 post-edit"><a href="/news/{{.post.Id}}/edit" class="btn btn-default btn-sm btn-block">Edit</a></div>
</div>
<div class="row">
<div class="col-xs-2">&nbsp;</div>
<div class="col-xs-8 post-content"> {{ .post.HTMLNotes }}</div>
<div class="col-xs-8 post-content state-up"> {{ .post.HTMLNotes }}</div>
<div class="col-xs-2 post-delete">
<form method="POST" action="/news/{{.post.Id}}/delete" class="confirm-news-delete">{{ .csrfField }}
<input type="submit" class="btn btn-sm btn-block" value="Delete" />
<input type="submit" class="btn btn-default btn-sm btn-block" value="Delete" />
</form>
</div>
</div>
<div class="row">
<div class="col-xs-2">&nbsp;</div>
<div class="col-xs-8 btn-default btn content-slider state-up">v</div>
</div>
</div>
{{end}}