Make event header a list, align icons

This commit is contained in:
Stefan Schlott 2013-08-27 11:47:41 +02:00
parent c273939cbd
commit ca3b00f0bb
2 changed files with 67 additions and 49 deletions

View file

@ -113,7 +113,7 @@ ul.horizontal {
} }
} }
div.commaseparated { div.commaseparated, li.commaseparated {
clear: both; clear: both;
ul { ul {
display: inline; display: inline;
@ -131,6 +131,21 @@ div.commaseparated {
} }
} }
ul.iconlist {
margin: 0;
> li {
display: block;
padding-left: 20px;
font-family: $baseFontFamily;
}
> li:before {
width: 17px;
display: inline-block;
margin-left: -20px;
font-family: FontAwesome;
}
}
div.planetpost { div.planetpost {
h2 { h2 {
font-size: $baseFontSize * 1.25; font-size: $baseFontSize * 1.25;

View file

@ -1,4 +1,4 @@
<header> <header class="event">
<% if heading %> <% if heading %>
<% if link %> <% if link %>
<h1 itemprop="name"><a itemProp="url" href="<%= item.path() %>"><%= item[:title] %></a></h1> <h1 itemprop="name"><a itemProp="url" href="<%= item.path() %>"><%= item[:title] %></a></h1>
@ -6,14 +6,18 @@
<h1 itemprop="name"><%= item[:title] %></h1> <h1 itemprop="name"><%= item[:title] %></h1>
<% end %> <% end %>
<% end %> <% end %>
<i class="icon-calendar" title="Datum"></i> <ul class="iconlist">
<li class="icon-calendar" title="Datum">
<span itemprop="startDate" content="<%= @item[:startdate].strftime("%Y-%m-%d") %>T19:30"><%= @item[:startdate].strftime("%d.%m.%Y") %>, 19:30 Uhr</span> <span itemprop="startDate" content="<%= @item[:startdate].strftime("%Y-%m-%d") %>T19:30"><%= @item[:startdate].strftime("%d.%m.%Y") %>, 19:30 Uhr</span>
<% if !@item[:public] %>(nicht öffentlich)<% end %> <% if !@item[:public] %>(nicht öffentlich)<% end %>
<br /> </li>
<% if !heading %><i class="icon-comment" title="Thema"></i> <span itemprop="name"><%= item[:title] %></span><br /><% end %> <% if !heading %>
<li class="icon-comment" title="Thema">
<span itemprop="name"><%= item[:title] %></span>
</li>
<% end %>
<% if @item[:speakers] %> <% if @item[:speakers] %>
<div class="commaseparated"> <li class="icon-male commaseparated" title="Referent">
<i class="icon-male" title="Referent"></i>
<ul> <ul>
<% @item[:speakers].each do |speaker| %> <% @item[:speakers].each do |speaker| %>
<li itemprop="performer" itemscope itemtype="http://schema.org/Person"> <li itemprop="performer" itemscope itemtype="http://schema.org/Person">
@ -21,21 +25,19 @@
</li> </li>
<% end %> <% end %>
</ul> </ul>
</div> </li>
<% end %> <% end %>
<% if @item[:superevent] %> <% if @item[:superevent] %>
<div itemprop="superEvent" itemscope itemtype="http://schema.org/Event"> <li class="icon-comments-alt" itemprop="superEvent" itemscope itemtype="http://schema.org/Event" title="Veranstaltung">
<i class="icon-comments-alt" title="Veranstaltung"></i>
<% if @item[:superevent][:url] %> <% if @item[:superevent][:url] %>
<a itemprop="url" href="<%= @item[:superevent][:url] %>"><span itemprop="name"><%= @item[:superevent][:title] %></span></a> <a itemprop="url" href="<%= @item[:superevent][:url] %>"><span itemprop="name"><%= @item[:superevent][:title] %></span></a>
<% else %> <% else %>
<span itemprop="name"><%= @item[:superevent][:title] %></span> <span itemprop="name"><%= @item[:superevent][:title] %></span>
<% end %> <% end %>
</div> </li>
<% end %> <% end %>
<% if @item[:location] %> <% if @item[:location] %>
<div class="commaseparated"> <li class="icon-compass commaseparated" title="Ort">
<i class="icon-compass" title="Ort"></i>
<ul itemprop="location" itemscope itemtype="http://schema.org/Location"> <ul itemprop="location" itemscope itemtype="http://schema.org/Location">
<li itemprop="name"><% if item[:location][:url] %><a itemprop="url" href="<%= item[:location][:url] %>"><%= item[:location][:name] %></a><% else %><%= item[:location][:name] %><% end %> <li itemprop="name"><% if item[:location][:url] %><a itemprop="url" href="<%= item[:location][:url] %>"><%= item[:location][:name] %></a><% else %><%= item[:location][:name] %><% end %>
<% if item[:location][:details] %><li><%= item[:location][:details] %><% end %> <% if item[:location][:details] %><li><%= item[:location][:details] %><% end %>
@ -52,7 +54,8 @@
(<a itemprop="map" href="http://www.openstreetmap.org/?mlat=<%= item[:location][:lat] %>&mlon=<%= item[:location][:lon] %>&zoom=18#map=16/<%= item[:location][:lat] %>/<%= item[:location][:lon] %>">Karte</a>) (<a itemprop="map" href="http://www.openstreetmap.org/?mlat=<%= item[:location][:lat] %>&mlon=<%= item[:location][:lon] %>&zoom=18#map=16/<%= item[:location][:lat] %>/<%= item[:location][:lon] %>">Karte</a>)
<% end %> <% end %>
</ul> </ul>
</div> </li>
<% end %> <% end %>
</ul>
</header> </header>