steve
/
factor
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

webapps.planet: more responsive css.

master
John Benediktsson 2020-03-01 14:35:04 -08:00
parent 77fd680475
commit 70fba55732
2 changed files with 59 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
extra/webapps/planet/planet.css
View File

@ -2,15 +2,25 @@
padding-left: 15px; padding-left: 15px;
padding-right: 15px; padding-right: 15px;
padding-bottom: 15px; padding-bottom: 15px;
position: relative;
} }
h1.planet-title { .posts {
font-size: 300%; max-width: 755px;
margin-right: 215px;
}
.infobox {
position: absolute;
top: 0;
left: calc(100% - 215px);
width: 200px;
padding: 10px;
} }
.posting-title { .posting-title {
padding: 10px; padding: 10px;
background-color:#f5f5f5; background-color:#f5f5f5;
} }
.posting-body { .posting-body {
@ -18,14 +28,20 @@ h1.planet-title {
} }
.posting-date { .posting-date {
text-align: right; text-align: right;
font-size: 90%; font-size: 90%;
} }
pre, code { pre, code {
color: #000000; color: #000000;
} }
.infobox { @media screen and (max-width: 600px) {
padding-left: 10px; .infobox {
display: none;
}
.posts {
margin-right: 0;
}
} }

73
extra/webapps/planet/planet.xml
View File

@ -4,55 +4,52 @@
<t:atom t:href="$planet/feed.xml">[ planet-factor ]</t:atom> <t:atom t:href="$planet/feed.xml">[ planet-factor ]</t:atom>
<t:title>[ planet-factor ]</t:title> <div class="posts">
<table width="100%"> <t:title>[ planet-factor ]</t:title>
<tr>
<td>
<t:bind-each t:name="postings"> <t:bind-each t:name="postings">
<h2 class="posting-title"> <h2 class="posting-title">
<t:a t:value="url"><t:label t:name="title" /></t:a> <t:a t:value="url"><t:label t:name="title" /></t:a>
</h2> </h2>
<div class="posting-body"> <div class="posting-body">
<t:html t:name="description" /> <t:html t:name="description" />
</div> </div>
<p class="posting-date"> <p class="posting-date">
<t:a t:value="url"><t:label t:name="date" /></t:a> <t:a t:value="url"><t:label t:name="date" /></t:a>
</p> </p>
</t:bind-each> </t:bind-each>
</td> </div>
<td valign="top" width="25%" class="infobox"> <div class="infobox">
<h2>Blogroll</h2> <h2>Blogroll</h2>
<ul> <ul>
<t:each t:name="blogroll"> <t:each t:name="blogroll">
<li> <li>
<t:link t:name="value"/> <t:link t:name="value"/>
</li> </li>
</t:each> </t:each>
</ul> </ul>
<hr/> <hr/>
<p> <p>
<strong>planet-factor</strong> is an Atom/RSS aggregator that collects the <strong>planet-factor</strong> is an Atom/RSS aggregator that collects the
contents of <a href="http://factorcode.org/">Factor</a>-related blogs. It is inspired by contents of <a href="http://factorcode.org/">Factor</a>-related blogs. It is inspired by
<a href="http://planet.lisp.org">Planet Lisp</a>. <a href="http://planet.lisp.org">Planet Lisp</a>.
</p> </p>
<p> <p>
<img src="http://planet.factorcode.org/icons/feed-icon-14x14.png" /> <img src="http://planet.factorcode.org/icons/feed-icon-14x14.png" />
<t:a t:href="$planet/feed.xml">Syndicate</t:a> <t:a t:href="$planet/feed.xml">Syndicate</t:a>
</p> </p>
</td>
</tr> </div>
</table>
</t:chloe> </t:chloe>