From 3fc853f415f92fc69db3cb360d460f6bbb1b8c86 Mon Sep 17 00:00:00 2001
From: Melissa Wen <melissa.srw@gmail.com>
Date: Thu, 16 Jun 2016 17:10:21 -0400
Subject: [PATCH] homepage of template default on Juventude

---
 _leftbar.sass                 | 119 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 _mainblock.sass               | 194 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 _profileheader.sass           |   2 +-
 _searchbar.sass               |  49 +++++++++++++++++++++++++++++++++++++++++++++++++
 footer.html.erb               |   9 +++++++++
 icons/juventude-em-debate.png | Bin 0 -> 42817 bytes
 style.sass                    |  58 ++++++++++++++++++++++++++++++++++++++++++++++++++++------
 theme.js                      |  33 +++++++++++++++++++++++++++++++++
 8 files changed, 457 insertions(+), 7 deletions(-)
 create mode 100644 _leftbar.sass
 create mode 100644 _mainblock.sass
 create mode 100644 _searchbar.sass
 create mode 100644 icons/juventude-em-debate.png
 create mode 100644 theme.js

diff --git a/_leftbar.sass b/_leftbar.sass
new file mode 100644
index 0000000..5f1f77c
--- /dev/null
+++ b/_leftbar.sass
@@ -0,0 +1,119 @@
+.profile-image-block
+  margin: 0
+  .vcard
+    > div
+      display: none
+    .profile-info-options
+      display: block
+      margin: 0
+      padding: 0
+      ul
+        margin: 0
+      li
+        margin: 0
+      .button
+        display: none
+      .join-leave-button a.button.with-text
+        background: #CE9500 url('icons/ico-entrar.png') no-repeat 190px center
+        border: none
+        display: table-cell
+        height: 25px
+        padding: 15px 25px
+        text-align: left
+        vertical-align: middle
+        width: 180px
+        span
+          color: #FFF
+          font-family: 'Signika'
+          font-size: 14px
+          font-weight: 300
+
+
+.block-outer .link-list-block
+  margin-bottom: 5px
+  padding: 0
+  .block-title
+    background: #3D70AF
+    border-top: 5px solid #4D82CE
+    border-bottom: none
+    color: #FFF
+    span
+      display: table-cell
+      font-family: 'Signika'
+      font-size: 14px
+      font-weight: 300
+      font-variant: normal
+      height: 20px
+      padding: 20px
+      vertical-align: middle
+  ul
+    background: #FFF
+    margin: 0
+    padding: 0 10px
+    li
+      background: none
+      border-bottom: 1px solid #3D70AF
+      padding: 20px
+      &:last-child
+        border: none
+      a
+        background: none
+        color: #949494
+        font-family: 'Signika'
+        font-size: 14px
+        font-weight: 300
+        line-height: 14px
+        padding: 0
+
+.block-outer:nth-child(2) .link-list-block
+  ul
+    background: #4D82CE
+    padding: 10px
+    li
+      border-bottom: 1px solid #3D70AF
+      &:last-child
+        border: none
+      a
+        color: #FFF
+
+.block-outer:nth-child(4) .link-list-block
+  ul
+    padding: 0
+  li:last-child
+    background: #3D70AF
+    border-top: 5px solid #4D82CE
+    border-bottom: none
+    color: #FFF
+    padding: 0
+    a
+      color: #FFF
+      display: table-cell
+      font-family: 'Signika'
+      font-size: 14px
+      font-weight: 300
+      font-variant: normal
+      height: 20px
+      padding: 20px
+      vertical-align: middle
+
+.block-outer:last-child .link-list-block
+  ul
+    padding: 10px 5px
+    li
+      border: none
+      display: inline-block
+      margin: 0
+      padding: 0
+      a
+        color: transparent
+        display: block
+        height: 52px
+        width: 62px
+        &.icon-edit
+          background: url('icons/ico-facebook.png') no-repeat center center
+        &.icon-send
+          background: url('icons/ico-twitter.png') no-repeat center center
+          margin-left: 10px
+        &.icon-photos
+          background: url('icons/ico-instagram.png') no-repeat center center
+          margin-left: 10px
diff --git a/_mainblock.sass b/_mainblock.sass
new file mode 100644
index 0000000..028f085
--- /dev/null
+++ b/_mainblock.sass
@@ -0,0 +1,194 @@
+.block-title
+  background: #F3F3F3
+  border: none
+  border-left: 8px solid #000
+  color: #000
+  font-family: 'Signika'
+  font-size: 16px
+  font-variant: normal
+  font-weight: 400
+  height: 40px
+  padding-left: 40px
+  span
+    background: #F3F3F3
+    display: table-cell
+    height: 40px
+    padding-left: 10px
+    vertical-align: middle
+    width: 670px
+
+.link-list-block
+  margin: 0
+  padding: 0
+  li
+    margin: 0
+  a
+    background: url('icons/juventude-em-debate.png') no-repeat left center
+    border-radius: 0
+    color: transparent
+    height: 145px
+    margin: 0 0 20px 0
+    padding: 0
+    width: 695px
+
+.article-block
+  .block-title
+    background: #EDEDED url('icons/ico-oque-e.png') no-repeat 5px center
+    border-left: 8px solid #3D70AF
+    color: #3D70AF
+    margin-bottom: 30px
+  p
+    margin: 10px
+  .read-more
+    font-family: 'Signika'
+    font-size: 16px
+    text-align: right
+    margin: 25px 15px 0 0
+    a
+      background: url('icons/ico-leia-mais-3.png') no-repeat left center
+      color: #3D70AF
+      text-decoration: none
+      padding-left: 30px
+
+
+.display-content-block
+  border: 1px solid #EDEDED
+  .block-title
+    background: #EDEDED url('icons/ico-destaque.png') no-repeat 5px center
+    border-left: 8px solid #4EA9B6
+    color: #4EA9B6
+    margin-bottom: 20px
+  li
+    margin: 15px
+  .title
+    color: #919191
+    font-family: 'Signika'
+    font-size: 27px
+    font-weight: 400
+    margin-bottom: 20px
+    a
+      text-decoration: none
+  .image
+    margin-bottom: 20px
+    img
+      width: 660px
+  .read_more
+    font-family: 'Signika'
+    font-size: 16px
+    text-align: right
+    margin-bottom: 30px
+    a
+      background: url('icons/ico-leia-mais-1.png') no-repeat left center
+      color: #4EA9B6
+      text-decoration: none
+      padding-left: 30px
+
+.block-outer:nth-child(4) .display-content-block
+  border: none
+  .block-title
+    background: #EDEDED url('icons/ico-mais-destaques.png') no-repeat 5px center
+    border-left: 8px solid #8ABA2C
+    color: #8ABA2C
+    margin-bottom: 25px
+  ul
+    margin: 0 0 45px 0
+  li
+    border-bottom: 1px solid #EDEDED
+    display: inline-block
+    margin: 0 7px
+    min-height: 60px
+    padding: 14px 7px
+    position: relative
+    width: 100%
+    &:last-child
+      border: none
+  .image
+    border: 2px solid #EDEDED
+    float: left
+    max-height: 95px
+    margin: 0 10px 0 0
+    overflow: hidden
+    max-width: 95px
+    img
+      max-width: 95px
+  .title
+    color: #949494
+    font-family: 'Signika'
+    font-size: 16px
+    font-weight: 400
+    margin-bottom: 0px
+    a
+      color: #949494
+      text-decoration: none
+  .read_more
+    font-family: 'Signika'
+    font-size: 14px
+    margin: 10px 0 0 0
+    text-align: left
+    a
+      background: url('icons/ico-leia-mais-2.png') no-repeat left center
+      color: #8ABA2C
+      text-decoration: none
+      padding-left: 30px
+  li > .image + .title + .lead + .read_more
+    bottom: 20px
+    left: 110px
+    position: absolute
+
+.members-block
+  border: 1px solid #EDEDED
+  .block-title
+    background: #EDEDED url('icons/ico-pessoas.png') no-repeat 5px center
+    border-left: 8px solid #FA5F59
+    color: #FA5F59
+    margin-bottom: 0px
+  ul
+    display: inline-block
+    margin: 0
+    padding: 22px
+    width: 650px
+  .common-profile-list-block
+    .vcard
+      background: #FFF
+      border: none
+      .menu-submenu-trigger
+        display: none
+      .profile_link
+        height: 50px
+        margin: 2px
+        padding-top: 0
+        width: 50px
+        &:hover
+          background: #FFF
+          border: none
+      .profile-image
+        height: 50px
+      .banner-div a
+        background: #FA5F59
+        color: #FFF
+        margin: 2px
+        padding: 0
+        height: 50px
+        width: 104px
+        span
+          font-family: 'Signika'
+          font-size: 16px
+          font-weight: 500
+          line-height: 50px
+  .block-footer-content
+    display: block
+    height: 30px
+    margin: 15px 30px 20px 0
+    position: relative
+    text-align: right
+    a.view-all
+      background: #FA5F59 none
+      border-radius: 20px
+      color: #FFF
+      font-family: 'Signika'
+      font-size: 12px
+      font-weight: 400
+      padding: 7px 20px
+      position: relative
+      text-decoration: none
+      text-transform: capitalize
diff --git a/_profileheader.sass b/_profileheader.sass
index 7b9f2f7..5abc71c 100644
--- a/_profileheader.sass
+++ b/_profileheader.sass
@@ -1,5 +1,5 @@
 #profile-header
-  height: 205px
+  height: 200px
   margin: 0
   width: 100%
   p
diff --git a/_searchbar.sass b/_searchbar.sass
new file mode 100644
index 0000000..de0968a
--- /dev/null
+++ b/_searchbar.sass
@@ -0,0 +1,49 @@
+.profile-search-block 
+  form
+    height: 30px
+    padding: 13px
+  .search-label
+    color: #949494
+    float: left
+    text-align: right
+    width: 405px
+    line-height: 30px
+  .search-field
+    background: #FFF
+    border: 1px solid #ccc
+    float: right
+    .formfield
+      float: left
+      width: 220px
+      input
+        background: none
+        border: none
+        font-family: 'Signika'
+        font-size: 14px
+        font-weight: 300
+        line-height: 25px
+        padding-left: 5px
+    #search-dropdown
+      direction: rtl
+      float: left
+      -webkit-appearance: button-arrow-down
+      -moz-appearance: button-arrow-down
+      apperance: button-arrow-down
+      margin: 7px
+    .icon-search.submit
+      background-color: #CE9500
+      background-image: none
+      border: none
+      color: #FFF
+      display: block
+      float: left
+      font-family: 'Signika'
+      font-size: 14px
+      font-weight: 400
+      height: 30px
+      line-height: 30px
+      max-height: 30px
+      margin: 0
+      padding: 0
+      width: 40px
+
diff --git a/footer.html.erb b/footer.html.erb
index e69de29..c161bab 100644
--- a/footer.html.erb
+++ b/footer.html.erb
@@ -0,0 +1,9 @@
+<script>
+var address = '/profile/<%=escape_javascript profile.identifier %>/join';
+var banner = $('div.banner-div');
+
+banner.children('a').attr('href', address);
+banner.children('a').addClass('join-community');
+
+$('#profile-header img').wrap('<a href="/<%=escape_javascript profile.identifier %>">');
+</script>
diff --git a/icons/juventude-em-debate.png b/icons/juventude-em-debate.png
new file mode 100644
index 0000000..869fbce
Binary files /dev/null and b/icons/juventude-em-debate.png differ
diff --git a/style.sass b/style.sass
index 91314b9..ea06563 100644
--- a/style.sass
+++ b/style.sass
@@ -16,7 +16,7 @@
   font-family: 'Signika'
   font-weight: 500
   font-style: normal
-  src: url('fonts/signika/Signika-SemiBold.otf')
+  src: url('fonts/signika/Signika-Semibold.otf')
 
 
 @font-face
@@ -43,15 +43,43 @@ body
   border: none
   margin: 0
   padding: 0
-  #user
-    display: none
 
-.box-1
-  margin: 0 0 0 250px
+#user
+  width: 960px
+  position: relative
+  top: 5px
+  margin: 0px auto
+  background: #FFF
+  border-bottom: 2px solid #DFDFDF
+  padding: 0px
+  font-size: 0.9em
+  color: #204A87
+  &.fixar-user
+    z-index: 9998
+    position: fixed
+    left: 0px
+    top: 0px
+    padding-top: 5px
+  a, a strong
+    color: #204A87
+    text-decoration: none
+  a:focus strong, a:hover strong
+    color: #CE5C00
+  form 
+    display: none
+  .signup, .or
+    display: none
 
 @import profileheader
 
-#content 
+#content
+  color: #949494
+  font-family: 'Signika'
+  font-size: 14px
+  font-weight: 300
+  .main-content
+    border: none
+    box-shadow: none
   .main-content, .no-boxes, #not-found, #access-denied
     h1
       border: none
@@ -60,5 +88,23 @@ body
       font-size: 22px
       font-variant: normal
 
+#content
+  .box-1
+    margin: 0 0 0 265px
+    .blocks
+      width: 695px
+      .block
+        margin-bottom: 25px
+      @import mainblock
+  .box-2
+    width: 230px
+    @import leftbar
+  .box-3
+    float: right
+    width: 730px
+    .block
+      margin: 0
+    @import searchbar
+
 #boxes
   margin-top: 0px
diff --git a/theme.js b/theme.js
new file mode 100644
index 0000000..bf14ba1
--- /dev/null
+++ b/theme.js
@@ -0,0 +1,33 @@
+// Aplicar class para fixar o menu #user ao topo
+jQuery("document").ready(function($){
+  var nav = $('#user');
+  $(window).scroll(function () {
+    if ($(this).scrollTop() > 220) {
+      nav.addClass("fixar-user");
+    } else {
+      nav.removeClass("fixar-user");
+    }
+  });
+});
+
+jQuery("document").ready(function($){
+  var dropdown = $('<select name="where" id="search-dropdown">');
+
+  var searchOp = $('<option>');
+  $($('.box-3 .search-field div').children()).each(function(i, e) {
+    if ($(this).is('input')){
+      searchOp.attr('value', $(this).val());
+    } else {
+      searchOp.text($(this).text()).appendTo(dropdown);
+      searchOp = $('<option>');
+    }
+  });
+  
+  dropdown.insertBefore('.box-3 .search-field .icon-search.submit');
+  $('.box-3 .search-field div').remove();
+
+  $('<span class="search-label">Busca:</span>').insertBefore('.box-3 .search-field');
+  $('.box-3 .search-field .icon-search.submit').attr('value', 'OK');
+  $('input#q').attr('placeholder', 'Tipo de conteúdo');
+
+});
--
libgit2 0.21.2