Merge branch 'v2' of github.com:neocities/neocities into v2

sass/_project-sass/_project-Header.scss

@@ -299,10 +299,9 @@
     }
     
     .dropdown-menu {
+      width: 100%;
       margin-left: -1px;
-      top: 0;
       margin-top: -1px;
-      margin-right: 3px;
       
       li {
         overflow: hidden;

sass/_project-sass/_project-Main.scss

@@ -448,6 +448,11 @@
 .large-portrait {
   border: 10px solid white;
   @include box-shadow(1px 1px 2px 1px rgba(0, 0, 0, 0.15));
+  width: 322px;
+  height: 241px;
+  background-size: cover;
+  float: left;
+  margin-bottom: 20px;
 }
 .site-portrait {
   border: 5px solid white;
@@ -484,7 +489,7 @@ a.tag:hover {
   text-decoration: none;
   background: #FFEE8A;
 }
-.follower-list {
+.follower-list, .following-list {
   width: 100%;
   float: left;
   margin-bottom: 2em;
@@ -553,7 +558,6 @@ a.tag:hover {
 .news-item.tip .icon {
   background: #FFCC00;
 }
-
 .news-item.follow .icon {
   background: #3399CC;
 }
@@ -704,6 +708,15 @@ a.tag:hover {
     display: inline;
   }
 }
+.popover {
+  background-color: #5E95A1;
+  a {
+    color: white;
+  }
+}
+.popover.bottom .arrow:after {
+  border-bottom-color: #5E95A1;
+}
 .col-33 .stats .stat {
   margin-bottom: .4em;
 }
@@ -1072,7 +1085,10 @@ a.tag:hover {
 .pagination .arrow {
   vertical-align: 1px;
 }
-
+.view-all-sites {
+  font-size: 1.2em;
+  margin-top: 1em;
+}
 .interior .header-Outro.with-columns .col.filter {
   padding-top: 0px;
   padding-bottom: 4px;

sass/_project-sass/_project-Website-Gallery.scss

@@ -11,7 +11,7 @@
     float:left;
     margin-bottom:$spacing*2;
     color: #666;
-    @include box-shadow(1px 1px 2px 0px rgba(0, 0, 0, 0.15));
+    @include box-shadow(1px 1px 2px 0px rgba(0, 0, 0, 0.18));
     
     @media (max-device-width:480px), screen and (max-width:800px){
       width:50%
@@ -21,21 +21,40 @@
 //  li a {
 //    display:block;
 //  }
-  .site-info a {
+  .site-info {
+    a {
       color: #666;
       font-size: 80%;
     }
+    .username {
+      float: left;
+      overflow: hidden;
+      width: 70%;
+    }
+    .site-stats {
+      float: right;
+      overflow: hidden;
+      width: 28%;
+      text-align: right;
+    }
+    .fa-user {
+      margin-right: .45em;
+      display: inline;
+    }
+    .site-tags {
+      width: 100%;
+      height: 1.4em;
+      float: left;
+      margin-top: -4px;
+    }
+    .site-tags .fa-tag {
+      vertical-align: -2px;
+    }
+  }
   .title {
     margin-top: 8px;
     margin-bottom: 2px;
-  }
+    white-space: nowrap;
-  .site-tags {
-    width: 100%;
-    clear: both;
-    height: 1.4em;
-  }
-  .site-tags .fa-tag {
-    vertical-align: -2px;
   }
   
   &.int-Gall{
@@ -55,6 +74,19 @@
         width:49%
       }
     }
+    &.suggestions {
+      padding: .25em 0 0 0;
+      
+      li {
+        margin: 0 1.33% 12px 0;
+        width: 32%;
+        @include box-shadow(1px 1px 2px 1px rgba(0, 0, 0, 0.1));
+
+        @media (max-width:1000px){
+          width:48%
+        } 
+      }
+    }
   }
 }
 
@@ -71,6 +103,7 @@
   -webkit-background-size:cover!important;
   background-size:cover!important;
   display:block;
+  border: 1px solid #eee;
 }
 .hp-Gallery img, .neo-Screen-Shot img{
   width:100%

views/_follows.erb

@@ -1,7 +1,7 @@
 <% site_followings = site.followings %>
 <% if (!is_current_site && !site_followings.empty?) || is_current_site %>
+  <div class="following-list">
     <h3><%= is_current_site ? 'You follow' : 'This site follows' %></h3>
-  <div class="following">
     <% if site_followings.empty? %>
       <p>You are not following any sites yet. Add some by <a href="/browse">browsing sites</a> or looking at your tags.
     <% else %>
@@ -14,8 +14,8 @@
 
 <% site_follows = site.follows %>
 <% if (!is_current_site && !site_follows.empty?) || is_current_site %>
-  <h3>Followers</h3>
   <div class="follower-list">
+    <h3>Followers</h3>
     <% if site_follows.empty? %>
       No followers yet.
     <% else %>

views/browse.erb

@@ -73,18 +73,17 @@
           <a href="//<%= site.host %>" title="<%= site.title %>"><%= site.title.shorten(30) %></a>
         </div>
         <div class="site-info">
-          <div style="float: left">
+          <div class="username">
             <a href="/site/<%= site.username %>" title="Profile">
-              <i class="fa fa-user"></i>
+              <i class="fa fa-user"></i><%= site.username %>
-              <%= site.username %>
             </a>
           </div>
-          <div style="float: right">
+          <div class="site-stats">
             <a href="/site/<%= site.username %>">
               <% if params[:sort_by] == 'hits' %>
-                <%= site.hits %> hit<%= site.hits == 1 ? '' : 's' %>
+                <%= site.hits %>&nbsp;hit<%= site.hits == 1 ? '' : 's' %>
               <% else %>
-                <%= site.views %> view<%= site.views == 1 ? '' : 's' %>
+                <%= site.views %>&nbsp;view<%= site.views == 1 ? '' : 's' %>
               <% end %>
             </a>
           </div>

views/home.erb

@@ -29,27 +29,47 @@
           <div class="welcome">
             <h4>Welcome to your Neocities news feed!</h4>
             <p>
-              You aren't following any websites yet! Once you do, updates will show up here and you can like and comment on them.
+              You aren’t following any websites yet! Once you do, updates will show up here and you can like and comment on them.
 
               Here are some website suggestions for you. Want to find some sites to follow? <a href="/browse">Check out all the sites on Neocities!</a>
             </p>
           </div>
 
+          <ul class="row website-Gallery content int-Gall suggestions">
           <% @suggestions.each do |suggested_site| %>
-            <div class="site-suggestion">
+            <li>
-              <div class="site-portrait">
+              <a href="//<%= suggested_site.host %>" class="neo-Screen-Shot" target="_blank" title="<%= suggested_site.title %>">
-                <a href="//<%= suggested_site.host %>">
+                <span class="img-Holder" style="background:url(<%= suggested_site.screenshot_url('index.html', '540x405') %>) no-repeat;">
-                  <img src="<%= suggested_site.screenshot_url('index.html', '540x405') %>">
+                  <img src="/img/placeholder.png" alt="<%= suggested_site.title %>" />
-                </a>
-                <span class="caption">
-                  <a href="/site/<%= suggested_site.username %>"><%= suggested_site.title %></a>
                 </span>
+              </a>
+              <div class="title">
+                <a href="//<%= suggested_site.host %>" title="<%= suggested_site.title %>"><%= suggested_site.title.shorten(30) %></a>
               </div>
-              <% suggested_site.tags.each do |tag| %>
+              <div class="site-info">
-                <a class="tag" href="/browse?tag=<%= Rack::Utils.escape tag.name %>"><%= tag.name %></a>
+                <div class="username">
+                  <a href="/site/<%= suggested_site.username %>" title="Profile">
+                    <i class="fa fa-user"></i><%= site.username %>
+                  </a>
+                </div>
+                <div class="site-stats">
+                  <a href="/site/<%= suggested_site.username %>">
+                      <%= suggested_site.views %>&nbsp;view<%= suggested_site.views == 1 ? '' : 's' %>
+                  </a>
+                </div>
+                <div class="site-tags">
+                  <% if suggested_site.tags.count > 0 %>
+                    <i class="fa fa-tag"></i> 
+                    <% suggested_site.tags.each_with_index do |tag, index| %>
+                      <a class="" href="/browse?tag=<%= Rack::Utils.escape tag.name %>"><%= tag.name %></a><% if index != suggested_site.tags.length - 1 %>,<% end %> 
+                    <% end %>
                   <% end %>
                 </div>
+              </div>
+            </li>
           <% end %>
+        </ul>
+        <p class="view-all-sites"><a href="/browse">View all sites <i class="fa fa-angle-double-right"></i></a></p>
         <% end %>
       </div>
 
@@ -67,13 +87,12 @@
             <div><strong><%= site.views_english %></strong> unique views</div>
             <div><strong><%= site.hits_english %></strong> hits</div>
             <div><strong><%= site.follows_dataset.count %></strong> followers</div>
-            <div><strong><%= site.tips_dataset.count %></strong> tips ($<%= site.tip_amount %>)</div>
           </div>
         </div>
 
-        <a href="//<%= site.host %>"><img src="<%= site.screenshot_url('index.html', '540x405') %>" class="large-portrait"></a>
+        <a href="//<%= site.host %>" class="large-portrait" style="background-image:url(<%= site.screenshot_url('index.html', '540x405') %>);"></a>
 
-        <div style="margin-top: 20px; margin-bottom: 20px" class="txt-Center">
+        <div style="margin-top: 20px; margin-bottom: 2em" class="txt-Center">
           <a href="/site/<%= site.username %>" class="btn-Action">View Site Profile</a>
         </div>