Commits

felipi  committed 2a02ba7

Finished base styles for timeline

  • Participants
  • Parent commits 825231c

Comments (0)

Files changed (3)

                                     <img src="images/fiona.jpg" />
                                 </div> 
                                 <div class="coppla_author_info">
-                                    <h5><a href="#">Angelica</a></h5>
+                                    <h5><a href="#">Fiona</a></h5>
                                     <span>postou <a href="#">um texto</a> na <a href="#">comunidade ABS</a><span class="hidden-xs"> em 21/03/2014 15:00</span></span>
                                 </div>
                             </div> 
                             <div class="coppla_item_info">
-                                <a href="#"><span class="glyphicon glyphicon-file" /> Blog - Enfermagem Psiquiatrica</a>
+                                <a href="#"><span class="glyphicon glyphicon-file"></span> Blog - Enfermagem Psiquiatrica</a>
                             </div>
                             <p>When the Pawn Hits the Conflicts He Thinks like a King What He Knows Throws the Blows When He Goes to the Fight and He'll Win the Whole Thing 'fore He Enters the Ring There's No Body to Batter When Your Mind Is Your Might so When You Go Solo, You Hold Your Own Hand and Remember That Depth Is the Greatest of Heights and If You Know Where You Stand, Then You Know Where to Land and If You Fall It Won't Matter, Cuz You'll Know That You're Right, commonly shortened to When the Pawn... is the second album by American singer-songwriter Fiona Apple, released by Epic Records in the United States on November 9, 1999.</p>
                             <div class="coppla_button_group">
                                     <img src="images/fiona3.jpg" />
                                 </div> 
                                 <div class="coppla_author_info">
-                                    <h5><a href="#">Angelica</a></h5>
+                                    <h5><a href="#">Fiona</a></h5>
                                     <span>postou <a href="#">um texto</a> na <a href="#">comunidade ABS</a><span class="hidden-xs"> em 21/03/2014 15:00</span></span>
                                 </div>
                             </div> 
                             <div class="coppla_item_info">
-                                <a href="#"><span class="glyphicon glyphicon-file" /> Blog - Enfermagem Psiquiatrica</a>
+                                <a href="#"><span class="glyphicon glyphicon-file"></span> Blog - Enfermagem Psiquiatrica</a>
                             </div>
                             <p>When the Pawn Hits the Conflicts He Thinks like a King What He Knows Throws the Blows When He Goes to the Fight and He'll Win the Whole Thing 'fore He Enters the Ring There's No Body to Batter When Your Mind Is Your Might so When You Go Solo, You Hold Your Own Hand and Remember That Depth Is the Greatest of Heights and If You Know Where You Stand, Then You Know Where to Land and If You Fall It Won't Matter, Cuz You'll Know That You're Right, commonly shortened to When the Pawn... is the second album by American singer-songwriter Fiona Apple, released by Epic Records in the United States on November 9, 1999.</p>
+                            <div class="coppla_timeline_comments">
+                                <div class="coppla_timeline_commentary">
+                                    <div class="coppla_authorbox">
+                                        <div class="coppla_author_image image_container"> 
+                                            <img src="images/fiona3.jpg" />
+                                        </div> 
+                                        <div class="coppla_author_info">
+                                            <h5><a href="#">Fiona</a></h5>
+                                            <span class="sticky-right">18/07/2014 16:20</span>
+                                        </div>
+                                    </div>
+                                    <p>A new era of shoot and loot is about to begin. Play as one of four new vault hunters facing off against a massive new world of creatures, psychos and the evil mastermind, Handsome Jack. Make new friends, arm them with a bazillion weapons and fight alongside them in 4 player co-op on a relentless quest for revenge and redemption across the undiscovered and unpredictable living planet.</p>
+                                </div>
+                                <div class="coppla_timeline_commentary">
+                                    <div class="coppla_authorbox">
+                                        <div class="coppla_author_image image_container"> 
+                                            <img src="images/fiona3.jpg" />
+                                        </div> 
+                                        <div class="coppla_author_info">
+                                            <h5><a href="#">Fiona</a></h5>
+                                            <span class="sticky-right">18/07/2014 16:20</span>
+                                        </div>
+                                    </div>
+                                    <p>A new era of shoot and loot is about to begin. Play as one of four new vault hunters facing off against a massive new world of creatures, psychos and the evil mastermind, Handsome Jack. Make new friends, arm them with a bazillion weapons and fight alongside them in 4 player co-op on a relentless quest for revenge and redemption across the undiscovered and unpredictable living planet.</p>
+                                </div>
+                                <div class="coppla_timeline_commentary">
+                                    <div class="coppla_authorbox">
+                                        <div class="coppla_author_image image_container"> 
+                                            <img src="images/fiona3.jpg" />
+                                        </div> 
+                                        <div class="coppla_author_info">
+                                            <h5><a href="#">Fiona</a></h5>
+                                            <span class="sticky-right">18/07/2014 16:20</span>
+                                        </div>
+                                    </div>
+                                    <p>A new era of shoot and loot is about to begin. Play as one of four new vault hunters facing off against a massive new world of creatures, psychos and the evil mastermind, Handsome Jack. Make new friends, arm them with a bazillion weapons and fight alongside them in 4 player co-op on a relentless quest for revenge and redemption across the undiscovered and unpredictable living planet.</p>
+                                </div>
+                                <div class="coppla_comments_seall">
+                                    <a href="#">ver todos os comentarios</a>
+                                </div>
+                            </div>
+
                             <div class="coppla_button_group">
                                 <button type="button" class="btn btn-xs btn-default">comentar</button>
                                 <button type="button" class="btn btn-xs btn-default">denunciar</button>
                                     <img src="images/fiona2.jpg" />
                                 </div> 
                                 <div class="coppla_author_info">
-                                    <h5><a href="#">Angelica</a></h5>
+                                    <h5><a href="#">Fiona</a></h5>
                                     <span>postou <a href="#">um texto</a> na <a href="#">comunidade ABS</a><span class="hidden-xs"> em 21/03/2014 15:00</span></span>
                                 </div>
                             </div> 
                             <div class="coppla_item_info">
-                                <a href="#"><span class="glyphicon glyphicon-camera" /> Blog - Enfermagem Psiquiatrica</a>
+                                <a href="#"><span class="glyphicon glyphicon-camera"></span> Blog - Enfermagem Psiquiatrica</a>
                             </div>
-                            <img class="coppla_timeline_preview" src="images/megaman.jpg"/>
+                            <a href="#" class="coppla_overlay">
+                                <img class="coppla_timeline_preview" src="images/megaman.jpg"/>
+                            </a>
                             <p>When the Pawn Hits the Conflicts He Thinks like a King What He Knows Throws the Blows When He Goes to the Fight and He'll Win the Whole Thing 'fore He Enters the Ring There's No Body to Batter When Your Mind Is Your Might so When You Go Solo, You Hold Your Own Hand and Remember That Depth Is the Greatest of Heights and If You Know Where You Stand, Then You Know Where to Land and If You Fall It Won't Matter, Cuz You'll Know That You're Right, commonly shortened to When the Pawn... is the second album by American singer-songwriter Fiona Apple, released by Epic Records in the United States on November 9, 1999.</p>
                             <div class="coppla_button_group">
                                 <button type="button" class="btn btn-xs btn-default">comentar</button>

File sass/styles.scss

 
     .coppla_item_info {
         @include responsive-margin;
+
+        &, & > a {
+            color: #3777F6;
+            text-decoration: underline;
+        }
     }
 
     img.coppla_timeline_preview {
 }
 
 .coppla_authorbox {
+    position: relative;
     .coppla_author_image {
         width: 30px;
         height: 30px;
         margin-left: 18px;
         vertical-align: top;
 
+        .sticky-right {
+            position: absolute;
+            top: -2px;
+            right: 0px;
+        }
+
         h5 {
             margin: 0;
             font-size: 0.85em;
     }
 }
 
+.coppla_timeline_comments {
+    margin-bottom: 6px;
+    .coppla_timeline_commentary {
+        padding: 10px 15px;
+    }
+    .coppla_comments_seall, .coppla_comments_seall > a {
+        text-align: center;
+        font-size: 0.9em;
+        color: #000;
+        padding: 3px;
+    }
+    .coppla_timeline_commentary, .coppla_comments_seall {
+        margin-bottom: 4px;
+        background-color: #FFF;
+        @include border-radius(4px);
+        .coppla_author_image {
+            width: 34px;
+            height: 34px;
+        }
+        p {
+            margin-left: 56px;
+            margin-top: -18px;
+        }
+    }
+}

File stylesheets/styles.css

     margin: 14px auto 14px 48px;
   }
 }
-/* line 241, ../sass/styles.scss */
+/* line 240, ../sass/styles.scss */
+.coppla_timeline_item .coppla_item_info, .coppla_timeline_item .coppla_item_info > a {
+  color: #3777F6;
+  text-decoration: underline;
+}
+/* line 246, ../sass/styles.scss */
 .coppla_timeline_item img.coppla_timeline_preview {
   max-width: 200px;
   margin: 14px 0;
 }
 @media screen and (min-width: 768px) {
-  /* line 241, ../sass/styles.scss */
+  /* line 246, ../sass/styles.scss */
   .coppla_timeline_item img.coppla_timeline_preview {
     margin: 14px auto 14px 48px;
   }
 }
-/* line 246, ../sass/styles.scss */
+/* line 251, ../sass/styles.scss */
 .coppla_timeline_item p {
   font-size: 0.8em;
   text-align: justify;
 }
 
-/* line 253, ../sass/styles.scss */
+/* line 258, ../sass/styles.scss */
 .coppla_button_group button {
   font-size: 0.8em;
   color: #747475;
 }
 
-/* line 260, ../sass/styles.scss */
+/* line 264, ../sass/styles.scss */
+.coppla_authorbox {
+  position: relative;
+}
+/* line 266, ../sass/styles.scss */
 .coppla_authorbox .coppla_author_image {
   width: 30px;
   height: 30px;
   -o-border-radius: 2px;
   border-radius: 2px;
 }
-/* line 269, ../sass/styles.scss */
+/* line 275, ../sass/styles.scss */
 .coppla_authorbox .coppla_author_info {
   display: inline-block;
   margin-left: 18px;
   vertical-align: top;
 }
-/* line 274, ../sass/styles.scss */
+/* line 280, ../sass/styles.scss */
+.coppla_authorbox .coppla_author_info .sticky-right {
+  position: absolute;
+  top: -2px;
+  right: 0px;
+}
+/* line 286, ../sass/styles.scss */
 .coppla_authorbox .coppla_author_info h5 {
   margin: 0;
   font-size: 0.85em;
   color: #0D448D;
 }
-/* line 280, ../sass/styles.scss */
+/* line 292, ../sass/styles.scss */
 .coppla_authorbox .coppla_author_info > span {
   font-size: 0.7em;
   color: #898989;
 }
-/* line 285, ../sass/styles.scss */
+/* line 297, ../sass/styles.scss */
 .coppla_authorbox .coppla_author_info h5 a, .coppla_authorbox .coppla_author_info span a {
   color: inherit;
 }
+
+/* line 303, ../sass/styles.scss */
+.coppla_timeline_comments {
+  margin-bottom: 6px;
+}
+/* line 305, ../sass/styles.scss */
+.coppla_timeline_comments .coppla_timeline_commentary {
+  padding: 10px 15px;
+}
+/* line 308, ../sass/styles.scss */
+.coppla_timeline_comments .coppla_comments_seall, .coppla_timeline_comments .coppla_comments_seall > a {
+  text-align: center;
+  font-size: 0.9em;
+  color: #000;
+  padding: 3px;
+}
+/* line 314, ../sass/styles.scss */
+.coppla_timeline_comments .coppla_timeline_commentary, .coppla_timeline_comments .coppla_comments_seall {
+  margin-bottom: 4px;
+  background-color: #FFF;
+  -webkit-border-radius: 4px;
+  -moz-border-radius: 4px;
+  -ms-border-radius: 4px;
+  -o-border-radius: 4px;
+  border-radius: 4px;
+}
+/* line 318, ../sass/styles.scss */
+.coppla_timeline_comments .coppla_timeline_commentary .coppla_author_image, .coppla_timeline_comments .coppla_comments_seall .coppla_author_image {
+  width: 34px;
+  height: 34px;
+}
+/* line 322, ../sass/styles.scss */
+.coppla_timeline_comments .coppla_timeline_commentary p, .coppla_timeline_comments .coppla_comments_seall p {
+  margin-left: 56px;
+  margin-top: -18px;
+}