Commit 3fc853f415f92fc69db3cb360d460f6bbb1b8c86
1 parent
1102009c
Exists in
master
homepage of template default on Juventude
Showing
8 changed files
with
457 additions
and
7 deletions
Show diff stats
| @@ -0,0 +1,119 @@ | @@ -0,0 +1,119 @@ | ||
| 1 | +.profile-image-block | ||
| 2 | + margin: 0 | ||
| 3 | + .vcard | ||
| 4 | + > div | ||
| 5 | + display: none | ||
| 6 | + .profile-info-options | ||
| 7 | + display: block | ||
| 8 | + margin: 0 | ||
| 9 | + padding: 0 | ||
| 10 | + ul | ||
| 11 | + margin: 0 | ||
| 12 | + li | ||
| 13 | + margin: 0 | ||
| 14 | + .button | ||
| 15 | + display: none | ||
| 16 | + .join-leave-button a.button.with-text | ||
| 17 | + background: #CE9500 url('icons/ico-entrar.png') no-repeat 190px center | ||
| 18 | + border: none | ||
| 19 | + display: table-cell | ||
| 20 | + height: 25px | ||
| 21 | + padding: 15px 25px | ||
| 22 | + text-align: left | ||
| 23 | + vertical-align: middle | ||
| 24 | + width: 180px | ||
| 25 | + span | ||
| 26 | + color: #FFF | ||
| 27 | + font-family: 'Signika' | ||
| 28 | + font-size: 14px | ||
| 29 | + font-weight: 300 | ||
| 30 | + | ||
| 31 | + | ||
| 32 | +.block-outer .link-list-block | ||
| 33 | + margin-bottom: 5px | ||
| 34 | + padding: 0 | ||
| 35 | + .block-title | ||
| 36 | + background: #3D70AF | ||
| 37 | + border-top: 5px solid #4D82CE | ||
| 38 | + border-bottom: none | ||
| 39 | + color: #FFF | ||
| 40 | + span | ||
| 41 | + display: table-cell | ||
| 42 | + font-family: 'Signika' | ||
| 43 | + font-size: 14px | ||
| 44 | + font-weight: 300 | ||
| 45 | + font-variant: normal | ||
| 46 | + height: 20px | ||
| 47 | + padding: 20px | ||
| 48 | + vertical-align: middle | ||
| 49 | + ul | ||
| 50 | + background: #FFF | ||
| 51 | + margin: 0 | ||
| 52 | + padding: 0 10px | ||
| 53 | + li | ||
| 54 | + background: none | ||
| 55 | + border-bottom: 1px solid #3D70AF | ||
| 56 | + padding: 20px | ||
| 57 | + &:last-child | ||
| 58 | + border: none | ||
| 59 | + a | ||
| 60 | + background: none | ||
| 61 | + color: #949494 | ||
| 62 | + font-family: 'Signika' | ||
| 63 | + font-size: 14px | ||
| 64 | + font-weight: 300 | ||
| 65 | + line-height: 14px | ||
| 66 | + padding: 0 | ||
| 67 | + | ||
| 68 | +.block-outer:nth-child(2) .link-list-block | ||
| 69 | + ul | ||
| 70 | + background: #4D82CE | ||
| 71 | + padding: 10px | ||
| 72 | + li | ||
| 73 | + border-bottom: 1px solid #3D70AF | ||
| 74 | + &:last-child | ||
| 75 | + border: none | ||
| 76 | + a | ||
| 77 | + color: #FFF | ||
| 78 | + | ||
| 79 | +.block-outer:nth-child(4) .link-list-block | ||
| 80 | + ul | ||
| 81 | + padding: 0 | ||
| 82 | + li:last-child | ||
| 83 | + background: #3D70AF | ||
| 84 | + border-top: 5px solid #4D82CE | ||
| 85 | + border-bottom: none | ||
| 86 | + color: #FFF | ||
| 87 | + padding: 0 | ||
| 88 | + a | ||
| 89 | + color: #FFF | ||
| 90 | + display: table-cell | ||
| 91 | + font-family: 'Signika' | ||
| 92 | + font-size: 14px | ||
| 93 | + font-weight: 300 | ||
| 94 | + font-variant: normal | ||
| 95 | + height: 20px | ||
| 96 | + padding: 20px | ||
| 97 | + vertical-align: middle | ||
| 98 | + | ||
| 99 | +.block-outer:last-child .link-list-block | ||
| 100 | + ul | ||
| 101 | + padding: 10px 5px | ||
| 102 | + li | ||
| 103 | + border: none | ||
| 104 | + display: inline-block | ||
| 105 | + margin: 0 | ||
| 106 | + padding: 0 | ||
| 107 | + a | ||
| 108 | + color: transparent | ||
| 109 | + display: block | ||
| 110 | + height: 52px | ||
| 111 | + width: 62px | ||
| 112 | + &.icon-edit | ||
| 113 | + background: url('icons/ico-facebook.png') no-repeat center center | ||
| 114 | + &.icon-send | ||
| 115 | + background: url('icons/ico-twitter.png') no-repeat center center | ||
| 116 | + margin-left: 10px | ||
| 117 | + &.icon-photos | ||
| 118 | + background: url('icons/ico-instagram.png') no-repeat center center | ||
| 119 | + margin-left: 10px |
| @@ -0,0 +1,194 @@ | @@ -0,0 +1,194 @@ | ||
| 1 | +.block-title | ||
| 2 | + background: #F3F3F3 | ||
| 3 | + border: none | ||
| 4 | + border-left: 8px solid #000 | ||
| 5 | + color: #000 | ||
| 6 | + font-family: 'Signika' | ||
| 7 | + font-size: 16px | ||
| 8 | + font-variant: normal | ||
| 9 | + font-weight: 400 | ||
| 10 | + height: 40px | ||
| 11 | + padding-left: 40px | ||
| 12 | + span | ||
| 13 | + background: #F3F3F3 | ||
| 14 | + display: table-cell | ||
| 15 | + height: 40px | ||
| 16 | + padding-left: 10px | ||
| 17 | + vertical-align: middle | ||
| 18 | + width: 670px | ||
| 19 | + | ||
| 20 | +.link-list-block | ||
| 21 | + margin: 0 | ||
| 22 | + padding: 0 | ||
| 23 | + li | ||
| 24 | + margin: 0 | ||
| 25 | + a | ||
| 26 | + background: url('icons/juventude-em-debate.png') no-repeat left center | ||
| 27 | + border-radius: 0 | ||
| 28 | + color: transparent | ||
| 29 | + height: 145px | ||
| 30 | + margin: 0 0 20px 0 | ||
| 31 | + padding: 0 | ||
| 32 | + width: 695px | ||
| 33 | + | ||
| 34 | +.article-block | ||
| 35 | + .block-title | ||
| 36 | + background: #EDEDED url('icons/ico-oque-e.png') no-repeat 5px center | ||
| 37 | + border-left: 8px solid #3D70AF | ||
| 38 | + color: #3D70AF | ||
| 39 | + margin-bottom: 30px | ||
| 40 | + p | ||
| 41 | + margin: 10px | ||
| 42 | + .read-more | ||
| 43 | + font-family: 'Signika' | ||
| 44 | + font-size: 16px | ||
| 45 | + text-align: right | ||
| 46 | + margin: 25px 15px 0 0 | ||
| 47 | + a | ||
| 48 | + background: url('icons/ico-leia-mais-3.png') no-repeat left center | ||
| 49 | + color: #3D70AF | ||
| 50 | + text-decoration: none | ||
| 51 | + padding-left: 30px | ||
| 52 | + | ||
| 53 | + | ||
| 54 | +.display-content-block | ||
| 55 | + border: 1px solid #EDEDED | ||
| 56 | + .block-title | ||
| 57 | + background: #EDEDED url('icons/ico-destaque.png') no-repeat 5px center | ||
| 58 | + border-left: 8px solid #4EA9B6 | ||
| 59 | + color: #4EA9B6 | ||
| 60 | + margin-bottom: 20px | ||
| 61 | + li | ||
| 62 | + margin: 15px | ||
| 63 | + .title | ||
| 64 | + color: #919191 | ||
| 65 | + font-family: 'Signika' | ||
| 66 | + font-size: 27px | ||
| 67 | + font-weight: 400 | ||
| 68 | + margin-bottom: 20px | ||
| 69 | + a | ||
| 70 | + text-decoration: none | ||
| 71 | + .image | ||
| 72 | + margin-bottom: 20px | ||
| 73 | + img | ||
| 74 | + width: 660px | ||
| 75 | + .read_more | ||
| 76 | + font-family: 'Signika' | ||
| 77 | + font-size: 16px | ||
| 78 | + text-align: right | ||
| 79 | + margin-bottom: 30px | ||
| 80 | + a | ||
| 81 | + background: url('icons/ico-leia-mais-1.png') no-repeat left center | ||
| 82 | + color: #4EA9B6 | ||
| 83 | + text-decoration: none | ||
| 84 | + padding-left: 30px | ||
| 85 | + | ||
| 86 | +.block-outer:nth-child(4) .display-content-block | ||
| 87 | + border: none | ||
| 88 | + .block-title | ||
| 89 | + background: #EDEDED url('icons/ico-mais-destaques.png') no-repeat 5px center | ||
| 90 | + border-left: 8px solid #8ABA2C | ||
| 91 | + color: #8ABA2C | ||
| 92 | + margin-bottom: 25px | ||
| 93 | + ul | ||
| 94 | + margin: 0 0 45px 0 | ||
| 95 | + li | ||
| 96 | + border-bottom: 1px solid #EDEDED | ||
| 97 | + display: inline-block | ||
| 98 | + margin: 0 7px | ||
| 99 | + min-height: 60px | ||
| 100 | + padding: 14px 7px | ||
| 101 | + position: relative | ||
| 102 | + width: 100% | ||
| 103 | + &:last-child | ||
| 104 | + border: none | ||
| 105 | + .image | ||
| 106 | + border: 2px solid #EDEDED | ||
| 107 | + float: left | ||
| 108 | + max-height: 95px | ||
| 109 | + margin: 0 10px 0 0 | ||
| 110 | + overflow: hidden | ||
| 111 | + max-width: 95px | ||
| 112 | + img | ||
| 113 | + max-width: 95px | ||
| 114 | + .title | ||
| 115 | + color: #949494 | ||
| 116 | + font-family: 'Signika' | ||
| 117 | + font-size: 16px | ||
| 118 | + font-weight: 400 | ||
| 119 | + margin-bottom: 0px | ||
| 120 | + a | ||
| 121 | + color: #949494 | ||
| 122 | + text-decoration: none | ||
| 123 | + .read_more | ||
| 124 | + font-family: 'Signika' | ||
| 125 | + font-size: 14px | ||
| 126 | + margin: 10px 0 0 0 | ||
| 127 | + text-align: left | ||
| 128 | + a | ||
| 129 | + background: url('icons/ico-leia-mais-2.png') no-repeat left center | ||
| 130 | + color: #8ABA2C | ||
| 131 | + text-decoration: none | ||
| 132 | + padding-left: 30px | ||
| 133 | + li > .image + .title + .lead + .read_more | ||
| 134 | + bottom: 20px | ||
| 135 | + left: 110px | ||
| 136 | + position: absolute | ||
| 137 | + | ||
| 138 | +.members-block | ||
| 139 | + border: 1px solid #EDEDED | ||
| 140 | + .block-title | ||
| 141 | + background: #EDEDED url('icons/ico-pessoas.png') no-repeat 5px center | ||
| 142 | + border-left: 8px solid #FA5F59 | ||
| 143 | + color: #FA5F59 | ||
| 144 | + margin-bottom: 0px | ||
| 145 | + ul | ||
| 146 | + display: inline-block | ||
| 147 | + margin: 0 | ||
| 148 | + padding: 22px | ||
| 149 | + width: 650px | ||
| 150 | + .common-profile-list-block | ||
| 151 | + .vcard | ||
| 152 | + background: #FFF | ||
| 153 | + border: none | ||
| 154 | + .menu-submenu-trigger | ||
| 155 | + display: none | ||
| 156 | + .profile_link | ||
| 157 | + height: 50px | ||
| 158 | + margin: 2px | ||
| 159 | + padding-top: 0 | ||
| 160 | + width: 50px | ||
| 161 | + &:hover | ||
| 162 | + background: #FFF | ||
| 163 | + border: none | ||
| 164 | + .profile-image | ||
| 165 | + height: 50px | ||
| 166 | + .banner-div a | ||
| 167 | + background: #FA5F59 | ||
| 168 | + color: #FFF | ||
| 169 | + margin: 2px | ||
| 170 | + padding: 0 | ||
| 171 | + height: 50px | ||
| 172 | + width: 104px | ||
| 173 | + span | ||
| 174 | + font-family: 'Signika' | ||
| 175 | + font-size: 16px | ||
| 176 | + font-weight: 500 | ||
| 177 | + line-height: 50px | ||
| 178 | + .block-footer-content | ||
| 179 | + display: block | ||
| 180 | + height: 30px | ||
| 181 | + margin: 15px 30px 20px 0 | ||
| 182 | + position: relative | ||
| 183 | + text-align: right | ||
| 184 | + a.view-all | ||
| 185 | + background: #FA5F59 none | ||
| 186 | + border-radius: 20px | ||
| 187 | + color: #FFF | ||
| 188 | + font-family: 'Signika' | ||
| 189 | + font-size: 12px | ||
| 190 | + font-weight: 400 | ||
| 191 | + padding: 7px 20px | ||
| 192 | + position: relative | ||
| 193 | + text-decoration: none | ||
| 194 | + text-transform: capitalize |
_profileheader.sass
| @@ -0,0 +1,49 @@ | @@ -0,0 +1,49 @@ | ||
| 1 | +.profile-search-block | ||
| 2 | + form | ||
| 3 | + height: 30px | ||
| 4 | + padding: 13px | ||
| 5 | + .search-label | ||
| 6 | + color: #949494 | ||
| 7 | + float: left | ||
| 8 | + text-align: right | ||
| 9 | + width: 405px | ||
| 10 | + line-height: 30px | ||
| 11 | + .search-field | ||
| 12 | + background: #FFF | ||
| 13 | + border: 1px solid #ccc | ||
| 14 | + float: right | ||
| 15 | + .formfield | ||
| 16 | + float: left | ||
| 17 | + width: 220px | ||
| 18 | + input | ||
| 19 | + background: none | ||
| 20 | + border: none | ||
| 21 | + font-family: 'Signika' | ||
| 22 | + font-size: 14px | ||
| 23 | + font-weight: 300 | ||
| 24 | + line-height: 25px | ||
| 25 | + padding-left: 5px | ||
| 26 | + #search-dropdown | ||
| 27 | + direction: rtl | ||
| 28 | + float: left | ||
| 29 | + -webkit-appearance: button-arrow-down | ||
| 30 | + -moz-appearance: button-arrow-down | ||
| 31 | + apperance: button-arrow-down | ||
| 32 | + margin: 7px | ||
| 33 | + .icon-search.submit | ||
| 34 | + background-color: #CE9500 | ||
| 35 | + background-image: none | ||
| 36 | + border: none | ||
| 37 | + color: #FFF | ||
| 38 | + display: block | ||
| 39 | + float: left | ||
| 40 | + font-family: 'Signika' | ||
| 41 | + font-size: 14px | ||
| 42 | + font-weight: 400 | ||
| 43 | + height: 30px | ||
| 44 | + line-height: 30px | ||
| 45 | + max-height: 30px | ||
| 46 | + margin: 0 | ||
| 47 | + padding: 0 | ||
| 48 | + width: 40px | ||
| 49 | + |
footer.html.erb
| @@ -0,0 +1,9 @@ | @@ -0,0 +1,9 @@ | ||
| 1 | +<script> | ||
| 2 | +var address = '/profile/<%=escape_javascript profile.identifier %>/join'; | ||
| 3 | +var banner = $('div.banner-div'); | ||
| 4 | + | ||
| 5 | +banner.children('a').attr('href', address); | ||
| 6 | +banner.children('a').addClass('join-community'); | ||
| 7 | + | ||
| 8 | +$('#profile-header img').wrap('<a href="/<%=escape_javascript profile.identifier %>">'); | ||
| 9 | +</script> |
41.8 KB
style.sass
| @@ -16,7 +16,7 @@ | @@ -16,7 +16,7 @@ | ||
| 16 | font-family: 'Signika' | 16 | font-family: 'Signika' |
| 17 | font-weight: 500 | 17 | font-weight: 500 |
| 18 | font-style: normal | 18 | font-style: normal |
| 19 | - src: url('fonts/signika/Signika-SemiBold.otf') | 19 | + src: url('fonts/signika/Signika-Semibold.otf') |
| 20 | 20 | ||
| 21 | 21 | ||
| 22 | @font-face | 22 | @font-face |
| @@ -43,15 +43,43 @@ body | @@ -43,15 +43,43 @@ body | ||
| 43 | border: none | 43 | border: none |
| 44 | margin: 0 | 44 | margin: 0 |
| 45 | padding: 0 | 45 | padding: 0 |
| 46 | - #user | ||
| 47 | - display: none | ||
| 48 | 46 | ||
| 49 | -.box-1 | ||
| 50 | - margin: 0 0 0 250px | 47 | +#user |
| 48 | + width: 960px | ||
| 49 | + position: relative | ||
| 50 | + top: 5px | ||
| 51 | + margin: 0px auto | ||
| 52 | + background: #FFF | ||
| 53 | + border-bottom: 2px solid #DFDFDF | ||
| 54 | + padding: 0px | ||
| 55 | + font-size: 0.9em | ||
| 56 | + color: #204A87 | ||
| 57 | + &.fixar-user | ||
| 58 | + z-index: 9998 | ||
| 59 | + position: fixed | ||
| 60 | + left: 0px | ||
| 61 | + top: 0px | ||
| 62 | + padding-top: 5px | ||
| 63 | + a, a strong | ||
| 64 | + color: #204A87 | ||
| 65 | + text-decoration: none | ||
| 66 | + a:focus strong, a:hover strong | ||
| 67 | + color: #CE5C00 | ||
| 68 | + form | ||
| 69 | + display: none | ||
| 70 | + .signup, .or | ||
| 71 | + display: none | ||
| 51 | 72 | ||
| 52 | @import profileheader | 73 | @import profileheader |
| 53 | 74 | ||
| 54 | -#content | 75 | +#content |
| 76 | + color: #949494 | ||
| 77 | + font-family: 'Signika' | ||
| 78 | + font-size: 14px | ||
| 79 | + font-weight: 300 | ||
| 80 | + .main-content | ||
| 81 | + border: none | ||
| 82 | + box-shadow: none | ||
| 55 | .main-content, .no-boxes, #not-found, #access-denied | 83 | .main-content, .no-boxes, #not-found, #access-denied |
| 56 | h1 | 84 | h1 |
| 57 | border: none | 85 | border: none |
| @@ -60,5 +88,23 @@ body | @@ -60,5 +88,23 @@ body | ||
| 60 | font-size: 22px | 88 | font-size: 22px |
| 61 | font-variant: normal | 89 | font-variant: normal |
| 62 | 90 | ||
| 91 | +#content | ||
| 92 | + .box-1 | ||
| 93 | + margin: 0 0 0 265px | ||
| 94 | + .blocks | ||
| 95 | + width: 695px | ||
| 96 | + .block | ||
| 97 | + margin-bottom: 25px | ||
| 98 | + @import mainblock | ||
| 99 | + .box-2 | ||
| 100 | + width: 230px | ||
| 101 | + @import leftbar | ||
| 102 | + .box-3 | ||
| 103 | + float: right | ||
| 104 | + width: 730px | ||
| 105 | + .block | ||
| 106 | + margin: 0 | ||
| 107 | + @import searchbar | ||
| 108 | + | ||
| 63 | #boxes | 109 | #boxes |
| 64 | margin-top: 0px | 110 | margin-top: 0px |
| @@ -0,0 +1,33 @@ | @@ -0,0 +1,33 @@ | ||
| 1 | +// Aplicar class para fixar o menu #user ao topo | ||
| 2 | +jQuery("document").ready(function($){ | ||
| 3 | + var nav = $('#user'); | ||
| 4 | + $(window).scroll(function () { | ||
| 5 | + if ($(this).scrollTop() > 220) { | ||
| 6 | + nav.addClass("fixar-user"); | ||
| 7 | + } else { | ||
| 8 | + nav.removeClass("fixar-user"); | ||
| 9 | + } | ||
| 10 | + }); | ||
| 11 | +}); | ||
| 12 | + | ||
| 13 | +jQuery("document").ready(function($){ | ||
| 14 | + var dropdown = $('<select name="where" id="search-dropdown">'); | ||
| 15 | + | ||
| 16 | + var searchOp = $('<option>'); | ||
| 17 | + $($('.box-3 .search-field div').children()).each(function(i, e) { | ||
| 18 | + if ($(this).is('input')){ | ||
| 19 | + searchOp.attr('value', $(this).val()); | ||
| 20 | + } else { | ||
| 21 | + searchOp.text($(this).text()).appendTo(dropdown); | ||
| 22 | + searchOp = $('<option>'); | ||
| 23 | + } | ||
| 24 | + }); | ||
| 25 | + | ||
| 26 | + dropdown.insertBefore('.box-3 .search-field .icon-search.submit'); | ||
| 27 | + $('.box-3 .search-field div').remove(); | ||
| 28 | + | ||
| 29 | + $('<span class="search-label">Busca:</span>').insertBefore('.box-3 .search-field'); | ||
| 30 | + $('.box-3 .search-field .icon-search.submit').attr('value', 'OK'); | ||
| 31 | + $('input#q').attr('placeholder', 'Tipo de conteúdo'); | ||
| 32 | + | ||
| 33 | +}); |