adding featured posts sign

delitestudio · Jun 4, 2015 · f47a9d4 · f47a9d4
1 parent 78cb928
commit f47a9d4
Show file tree

Hide file tree

Showing 5 changed files with 67 additions and 6 deletions.
diff --git a/lib/directives/posts/posts.html b/lib/directives/posts/posts.html
@@ -4,10 +4,18 @@
             <div class="item item-image" ng-if="::post.featured_image.is_image" wphc-img-background-cache="{{post.featured_image.attachment_meta.sizes.medium.url}}">
                 <div class="img-border"></div>
                 <h1 class="item-title" ng-bind-html="::post.title"></h1>
+                <div ng-if="::post.sticky" class="sticky-post badge badge-stable">
+                    <i class="icon ion-star"></i>
+                    <span>{{'posts.featured' | translate}}</span>
+                </div>
                 <!-- <img ng-src="{{post.featured_image.attachment_meta.sizes.medium.url}}"> -->
             </div>
             <div class="item item-text-wrap" ng-if="::!post.featured_image.is_image">
                 <h1 class="item-title" ng-bind-html="::post.title"></h1>
+                <div ng-if="::post.sticky" class="sticky-post badge badge-stable">
+                    <i class="icon ion-star"></i>
+                    <span>{{'posts.featured' | translate}}</span>
+                </div>
             </div>
             <div class="item item-author" ng-class="::{'item-avatar' : post.author.avatar}">
                 <img wphc-img-cache ng-src="{{::post.author.avatar}}" ng-if="::post.author.avatar">

diff --git a/lib/directives/posts/style.scss b/lib/directives/posts/style.scss
@@ -8,4 +8,10 @@ wphc-posts {
         box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
         @include post-item("../../img/post-img-border.png");
     }
-}
+    .sticky-post{
+        right: 16px !important;
+        > i{
+            margin-right: 5px;
+        }
+    }
+}
diff --git a/lib/scss/_helpers.scss b/lib/scss/_helpers.scss
@@ -6,4 +6,49 @@
 }
 .bg-gray-lighter {
     background-color: $gray-lighter;
-}
+}
+
+// Clearfix.
+.clearfix {
+    @include clearfix;
+}
+
+// Add/remove floats.
+.float-right {
+    float: right !important;
+}
+.float-left {
+    float: left !important;
+}
+.float-none {
+    float: none !important;
+}
+
+// Text alignment.
+.text-left {
+    text-align: left !important;
+}
+.text-center {
+    text-align: center !important;
+}
+.text-right {
+    text-align: right !important;
+}
+
+// Display block.
+.display-block {
+    display: block;
+}
+
+// Hide content off-screen without resorting to `display:none;`.
+.visuallyhidden,
+%visuallyhidden {
+    border: 0 !important;
+    clip: rect(0 0 0 0) !important;
+    height: 1px !important;
+    margin: -1px !important;
+    overflow: hidden !important;
+    padding: 0 !important;
+    position: absolute !important;
+    width: 1px !important;
+}
diff --git a/lib/translations/en.json b/lib/translations/en.json
@@ -37,7 +37,8 @@
     },
     "posts": {
         "title": "Home",
-        "empty": "There is no posts here!"
+        "empty": "There is no posts here!",
+        "featured": "Featured"
     },
     "post": {
         "openInBrowser": "Open in browser"
@@ -63,4 +64,4 @@
         "x-large": "Xlarge",
         "xx-large": "XXlarge"
     }
-}
+}
diff --git a/lib/translations/fr.json b/lib/translations/fr.json
@@ -37,7 +37,8 @@
     },
     "posts": {
         "title": "Accueil",
-        "empty": "La liste est vide!"
+        "empty": "La liste est vide!",
+        "featured": "A la Une"
     },
     "post": {
         "openInBrowser": "Ouvrir dans un navigateur"
@@ -63,4 +64,4 @@
         "x-large": "XLarge",
         "xx-large": "XXLarge"
     }
-}
+}