Add flutter/angular links to front page of pub

[email protected]

Review URL: https://codereview.chromium.org/2560433002 .

Author: mkustermann

app/views/index.mustache

@@ -3,7 +3,7 @@
     BSD-style license that can be found in the LICENSE file. }}
 
 <div class="intro">
-  <h1>Welcome to pub.dartlang.org!</h1>
+  <h2>Welcome to pub.dartlang.org!</h2>
   <p>
     This is your friendly repository of packages of software for the
     <a href="http://dartlang.org">Dart programming language</a>. Explore
@@ -15,6 +15,31 @@
     Get started
   </a>
 </div>
+<div class="framework_links">
+  <div class="flutter_framework_link">
+    <a href="https://flutter.io/">
+      <img class="framework_image" src="/static/flutter.png" />
+    </a>
+
+    <h2>Mobile development?</h2>
+    <a class="get-started" href="https://flutter.io/">
+      Try Flutter!
+    </a>
+    <br/>
+    &nbsp;
+  </div>
+  <div class="angular_framework_link">
+    <a href="https://webdev.dartlang.org/angular/guide">
+      <img class="framework_image" src="/static/angulardart.png" />
+    </a>
+    <h2>Web development?</h2>
+    <a class="get-started" href="https://webdev.dartlang.org/angular/guide">
+      Try Angular!
+    </a>
+    <br/>
+    Using the <a href="/packages/angular2">angular2</a> package.
+  </div>
+</div>
 <h2>Recently updated packages</h2>
 <table>
   <thead>

static/style.css

@@ -2599,6 +2599,29 @@ table .span24 {
   -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
   box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
 }
+.framework_links {
+  overflow: auto;
+}
+.flutter_framework_link, .angular_framework_link {
+  margin: 20px;
+  padding: 10px;
+  background-color: #f5f5f5;
+  border: 1px solid #eee;
+  border: 1px solid rgba(0, 0, 0, 0.05);
+  border-radius: 4px;
+  text-align: center;
+}
+.flutter_framework_link {
+  width: 44%;
+  float: left;
+}
+.angular_framework_link {
+  width: 44%;
+  overflow: hidden;
+}
+.framework_image {
+  float: left;
+}
 .well blockquote, footer blockquote, .intro blockquote, ol.toc blockquote {
   border-color: #ddd;
   border-color: rgba(0, 0, 0, 0.15);
@@ -2679,7 +2702,7 @@ button.close {
   *zoom: 1;
   padding: 4px 10px 4px;
   margin-bottom: 0;
-  font-size: 14px;
+  font-size: 20px;
   line-height: 24px;
   *line-height: 20px;
   color: #333333;