Skip to content

Commit

Permalink
Add Open GApps "News" Card
Browse files Browse the repository at this point in the history
Fix some various CSS
Remove Raul's left-over tabs
  • Loading branch information
mfonville committed Apr 3, 2016
1 parent fef02be commit 1c41ede
Show file tree
Hide file tree
Showing 3 changed files with 52 additions and 45 deletions.
14 changes: 9 additions & 5 deletions _includes/homestyles.css
Original file line number Diff line number Diff line change
Expand Up @@ -4,18 +4,18 @@ a{color:#009688;text-decoration:none}
img{max-width:100%}
.dt{border:0px;float:left;width:110px}
.dt td{border-bottom:0px}
.dt th{text-align:center}
.dt th{text-align:center !important}
#tp td,#tp th,#tv td,#tv th{padding-left:10px;padding-right:0}
a.wikilink i.material-icons{font-size:12px;vertical-align:middle}
:not(.is-small-screen) .container{text-align:center;max-width:800px;margin:0 auto}
:not(.is-small-screen) .advertisement{width:336px;max-width:100%;float:right;margin-top:10px;margin-bottom:10px}
:not(.is-small-screen) .advertisement{width:336px;max-width:100%;float:right;margin:10px 0}
:not(.is-small-screen) .dform{width:330px;float:left}
.footer-advertisement-container{width:auto;float:right}
.footer-container{float:right;display:flex;flex-direction:column}
.is-small-screen .container,.is-small-screen .footer-container{max-width:1024px;width:100%;float:left}
.is-small-screen .advertisement{float:none;margin:10px auto 10px;width:inherit}
.is-small-screen .advertisement{float:none;margin:10px auto;width:inherit}
.is-small-screen .dform{display:inline-block;float:none;width:330px;margin:0 auto}
.mdl-layout__content{flex-shrink:0}
.mdl-menu__item{text-align:right}
.mdl-menu .mdl-menu__item{text-align:right}
.link{opacity:.8}
.link:hover{opacity:1}
.tab:hover{color:rgba(255,255,255,0.85)}
Expand All @@ -34,6 +34,10 @@ a.wikilink i.material-icons{font-size:12px;vertical-align:middle}
.mdsection{max-width:800px;margin:0 auto;padding:30px}
.mdl-mini-footer{position:absolute;bottom:0;right:0;left:0;white-space:nowrap;max-height:96px}
@media screen and (max-width:532px){.mdl-mini-footer{padding:16px}}
.mdl-card{margin:20px auto;display:inline-block;order:0;min-height:0}
.post-hr{border-top:1px solid rgba(0,0,0,.1)}
.is-small-screen .mdl-card{order:9}
#bota{order:5}
.mdl-layout:not(.is-small-screen) #adlabelfooter,.mdl-layout:not(.is-small-screen) #adlabelheader{text-align:center;font-style:italic}
.is-small-screen #adlabelfooter,.is-small-screen #adlabelheader,.mdl-layout__tab-bar-button{display:none}
#donatebox a:hover{text-decoration:underline}
Expand Down
74 changes: 35 additions & 39 deletions blog/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,50 +4,46 @@
---
<div class="home">
<div class="post-list">
{% for post in paginator.posts %}
<div class="article mdl-shadow--2dp">
<div class="content-limit article-center">
<div class="post-header">
<p class="post-meta mdl-color-text--grey-700 mdl-typography--subhead">{{ post.date | date: "%b %-d, %Y" | upcase }}{% if post.author %} - by {{ post.author }}{% endif %}</p>
<p class="post-title mdl-typography--display-3">{{ post.title }}</p>
</div>
{% for post in paginator.posts %}
<div class="article mdl-shadow--2dp">
<div class="content-limit article-center">
<div class="post-header">
<p class="post-meta mdl-color-text--grey-700 mdl-typography--subhead">{{ post.date | date: "%b %-d, %Y" | upcase }}{% if post.author %} - by {{ post.author }}{% endif %}</p>
<p class="post-title mdl-typography--display-3">{{ post.title }}</p>
</div>
<div class="post-content mdl-color-text--grey-700">
{{ post.content }}
<div class="gradientback"></div>
{{ post.content }}
<div class="gradientback"></div>
</div>
</div>
</div>
<div class="post-hr">
<a class="readmorebutton mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect" href="{{ post.url | prepend: site.baseurl }}">
Read more
</a>
</div>
<div class="post-hr"><a class="readmorebutton mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect" href="{{ post.url | prepend: site.baseurl }}">Read more</a></div>
</div>
{% endfor %}
{% if paginator.total_pages > 1 %}
{% endfor %}
{% if paginator.total_pages > 1 %}
<div class="pagination">
{% if paginator.previous_page %}
<a href="{{ paginator.previous_page_path | prepend: site.baseurl }}" class="previous"><button class="mdl-button mdl-js-button mdl-button--icon"><i class="material-icons">arrow_back</i></button></a>
{% else %}
<span class="previous"><button class="mdl-button mdl-js-button mdl-button--icon" disabled><i class="material-icons">arrow_back</i></button></span>
{% endif %}
<div class="paginator-align">
{% for page in (1..paginator.total_pages) %}
{% if page == paginator.page %}
<span class="mdl-typography--headline">{{ page }}</span>
{% elsif page == 1 %}
<a href="{{ '/' | prepend: site.blogurl | replace: '//', '/' }}" class="mdl-typography--headline">{{ page }}</a>
{% else %}
<a href="{{ site.paginate_path | prepend: site.baseurl | replace: '//', '/' | replace: ':num', page }}" class="mdl-typography--headline">{{ page }}</a>
{% endif %}
{% endfor %}
</div>
{% if paginator.next_page %}
<a href="{{ paginator.next_page_path | prepend: site.baseurl }}" class="next"><button class="mdl-button mdl-js-button mdl-button--icon"><i class="material-icons">arrow_forward</i></button></a>
{% else %}
<span class="next"><button class="mdl-button mdl-js-button mdl-button--icon" disabled><i class="material-icons">arrow_forward</i></button></span>
{% endif %}
{% if paginator.previous_page %}
<a href="{{ paginator.previous_page_path | prepend: site.baseurl }}" class="previous"><button class="mdl-button mdl-js-button mdl-button--icon"><i class="material-icons">arrow_back</i></button></a>
{% else %}
<span class="previous"><button class="mdl-button mdl-js-button mdl-button--icon" disabled><i class="material-icons">arrow_back</i></button></span>
{% endif %}
<div class="paginator-align">
{% for page in (1..paginator.total_pages) %}
{% if page == paginator.page %}
<span class="mdl-typography--headline">{{ page }}</span>
{% elsif page == 1 %}
<a href="{{ '/' | prepend: site.blogurl | replace: '//', '/' }}" class="mdl-typography--headline">{{ page }}</a>
{% else %}
<a href="{{ site.paginate_path | prepend: site.baseurl | replace: '//', '/' | replace: ':num', page }}" class="mdl-typography--headline">{{ page }}</a>
{% endif %}
{% endfor %}
</div>
{% if paginator.next_page %}
<a href="{{ paginator.next_page_path | prepend: site.baseurl }}" class="next"><button class="mdl-button mdl-js-button mdl-button--icon"><i class="material-icons">arrow_forward</i></button></a>
{% else %}
<span class="next"><button class="mdl-button mdl-js-button mdl-button--icon" disabled><i class="material-icons">arrow_forward</i></button></span>
{% endif %}
</div>
{% endif %}
{% endif %}
</div>
<br />
<p class="feed-subscribe"><a href="{{ '/feed.xml' | prepend: site.blogurl }}"><i class="material-icons">rss_feed</i>RSS</a> <a href="{{ site.pushbullet | append:'opengappsblog' }}"><i class="material-icons">notifications</i>Pushbullet</a></p>
Expand Down
9 changes: 8 additions & 1 deletion index.html
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,14 @@
<a id="bolderlink"><button id="bolder" class="mdl-button mdl-js-button mdl-button--accent" disabled>Older Releases</button></a>
</div>
</div>
<div class="footer-container"><div id="bota" class="advertisement"><div class="mdl-typography--caption-color-contrast" id="adlabelfooter">Advertisement</div><ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-9489060368971640" data-ad-slot="2525609473" data-ad-format="auto"></ins></div></div>
<div class="footer-container">
{% assign blog = site.posts.first %}
<div class="mdl-card mdl-shadow--2dp"><div class="mdl-card__title mdl-typography--title">Open GApps News</div>
<div class="mdl-card__supporting-text mdl-typography--text-justify">Latest blog post:<br/><a href="{{ blog.url }}"><span class="mdl-typography--title">{{ blog.title }}</span></a></div>
<div class="post-hr"><div class="mdl-card__actions mdl-typography--text-left"><a class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect" href="{{ site.blogurl }}">Visit Blog</a></div></div>
</div><br />
<div id="bota" class="advertisement"><div class="mdl-typography--caption-color-contrast" id="adlabelfooter">Advertisement</div><ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-9489060368971640" data-ad-slot="2525609473" data-ad-format="auto"></ins></div>
</div>
</div>
</section>
<section class="mdl-layout__tab-panel mdsection" id="supportsection">{% capture support %}{% include support.md %}{% endcapture %}{{support | markdownify}}</section>
Expand Down

0 comments on commit 1c41ede

Please sign in to comment.