diff --git a/src/styles/_homepage.sass b/src/styles/_homepage.sass index 2076520..513e1c8 100644 --- a/src/styles/_homepage.sass +++ b/src/styles/_homepage.sass @@ -407,50 +407,56 @@ > li +container-box display: flex - padding: 15px - margin-bottom: 15px + flex-direction: column + margin-bottom: 50px + + &:before + height: 1px + background-color: $color-background-dark + position: absolute + bottom: -26px + left: 25px + right: 25px + content: ' ' - &:first-child - border-top: none &:last-child - border: - bottom-left-radius: 3px - bottom-right-radius: 3px + margin-bottom: 0 + + &:before + display: none + + a.title + font-size: 1.6em + padding: 5px 15px + display: block + color: $color-text + + &:hover + color: $color-primary + + a.blog-stream__thumbnail + display: block + position: relative + + img + border-top-left-radius: 3px + border-top-right-radius: 3px + width: 100% + + ul.meta + +list-meta + font-size: .9em + padding: 15px 15px 5px + &.blog-non-featured border-radius: 0 margin: 0 - &.more - font-size: .9em - justify-content: space-between - - a - color: $color-text-dark-secondary - - .blog-stream__list-thumbnail - display: block - position: relative - width: 50px - min-width: 50px - height: 50px - min-height: 50px - margin-right: 15px - background-color: $node-type-post - border-radius: 3px - overflow: hidden - - img - width: 100% - - i - +position-center-translate - font-size: 1.6em - color: $color-text-light-primary .description +node-details-description - padding: 5px 15px + padding: 10px 15px .blog-stream__list-details .title @@ -472,32 +478,18 @@ &:before left: -5px - &.featured - flex-direction: column - padding: 0 + .more + text-align: center - a.title - font-size: 1.5em - padding: 20px 0 0 15px - display: block - color: $color-text-dark-primary - &:hover - color: $color-primary - - a.blog-stream__thumbnail - display: block - position: relative - - img - border-top-left-radius: 3px - border-top-right-radius: 3px - width: 100% - - ul.meta - +list-meta - font-size: .9em - padding: 5px 15px 10px + a + color: $color-text + display: block + padding: 25px 0 + text-decoration: underline + width: 100% + &:hover + color: $color-primary section.random-asset border-bottom: thin solid $color-background-dark @@ -593,7 +585,8 @@ font-size: 1.1em padding: 10px 0 5px display: block - color: $color-text-dark-primary + color: $color-text + &:hover color: $color-primary diff --git a/src/templates/homepage.pug b/src/templates/homepage.pug index e897c21..53bc1f2 100644 --- a/src/templates/homepage.pug +++ b/src/templates/homepage.pug @@ -25,41 +25,37 @@ meta(name="twitter:image", content="{% if main_project.picture_header %}{{ main_ ul.blog-stream__list | {% if latest_posts %} | {% for n in latest_posts %} - li.blog-stream__list-item.featured + li | {% if n.picture %} a.blog-stream__thumbnail( href="{{ n.url }}") img(src="{{ n.picture.thumbnail('l', api=api) }}") | {% endif %} - a.title(href="{{ n.url }}") - | {{ n.name }} - ul.meta + li.where-project + a.project(href="{{ url_for('projects.view', project_url=n.project.url) }}") {{ n.project.name }} li.when a(href="{{ n.url }}", title="Updated {{ n._updated | pretty_date }}") | {{ n._created | pretty_date }} - li.where-project - a.project(href="{{ url_for('projects.view', project_url=n.project.url) }}") {{ n.project.name }} + + a.title(href="{{ n.url }}") + | {{ n.name }} .description | {{ n.properties.content | markdown }} | {% endfor %} | {% else %} - li.blog-stream__list-item + li .blog-stream__list-details ul.meta li.when No blog entries... yet! | {% endif %} - li.blog-stream__list-item.more - a( - href="{{ url_for('main.feeds_blogs') }}", - title="Blender Cloud & Projects Blog Feed") - | RSS Feed - a(href="{{ url_for('main.main_blog') }}") - | See All Blog Posts + .more + a(href="{{ url_for('main.main_blog') }}") + | See All Blog Posts a.feed( href="{{ url_for('main.feeds_blogs') }}", @@ -265,12 +261,12 @@ script. $(function () { /* cleanup mentions in comments */ - $('.activity-stream__list-details a.title').each(function(){ + $('.comment-content').each(function(){ $(this).text($(this).text().replace(/\*|\@|\<(.*?)\>/g, '')); }); /* Click on the whole asset/comment row to go */ - $('li.activity-stream__list-item.asset, li.activity-stream__list-item.comment').click(function(e){ + $('.activity-stream__list li, .comments ul li').click(function(e){ window.location.href = $(this).data('url'); $(this).addClass('active'); });