mirror of
https://github.com/twisterarmy/theme_nin.git
synced 2025-01-30 16:44:31 +00:00
modals views in fixed sidebar
This commit is contained in:
myleneb
parent
35d34708b6
commit
a2d3ce178d
146
css/style.css
146
css/style.css
@ -364,13 +364,13 @@ h3 .isFollowing:after {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.box-shadow, .modal-wrapper, .postboard .post, .dashboard > .module, .mini-profile, ol.toptrends-list a, ul.dropdown-menu {
|
||||
.box-shadow, .modal-wrapper, .postboard .post, .dashboard > .module, .mini-profile, ul.dropdown-menu {
|
||||
-moz-box-shadow: 0 8px 13px rgba(17, 17, 17, 0);
|
||||
-webkit-box-shadow: 0 8px 13px rgba(17, 17, 17, 0);
|
||||
box-shadow: 0 8px 13px rgba(17, 17, 17, 0);
|
||||
}
|
||||
|
||||
.clear-fix:after, .userMenu > ul:after, .modal-content:after, .modal-header:after, .direct-messages-thread .post:after, .mini-following-info a:after, .forEdition.profile-card:after, .expanded-content:after, .following .following-list li a:after, .network.singleBlock:after, .options .tab-content:after, .promoted-posts-only:after, ul.userMenu-search-profiles li:after, .mini-profile .post-area:after, .mini-profile-indicators:after, .profile-data:after, #postboard-top:after, #postboard-top .post-area:after, .who-to-follow ol:after, .twister-user:after {
|
||||
.clear-fix:after, .userMenu > ul:after, .modal-content:after, .modal-header:after, .direct-messages-thread .post:after, .mini-following-info a:after, .forEdition.profile-card:after, .expanded-content:after, .following .following-list li a:after, .network.singleBlock:after, .options .tab-content:after, .dashboard > .module:after, ul.userMenu-search-profiles li:after, .mini-profile .post-area:after, .mini-profile-indicators:after, .profile-data:after, #postboard-top:after, #postboard-top .post-area:after, .who-to-follow ol:after, .twister-user:after {
|
||||
content: "";
|
||||
display: table;
|
||||
clear: both;
|
||||
@ -462,8 +462,10 @@ button.light:hover, a.button.light:hover {
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
max-width: 70%;
|
||||
max-width: 100%;
|
||||
padding: 0 20px;
|
||||
margin: 0;
|
||||
margin: auto;
|
||||
background: url('../img/logo.png?1437893891') no-repeat 50% 50%;
|
||||
background-size: 20px;
|
||||
}
|
||||
@ -566,12 +568,9 @@ button.light:hover, a.button.light:hover {
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
overflow: hidden;
|
||||
-moz-border-radius: 20px 0 0 0;
|
||||
-webkit-border-radius: 20px;
|
||||
border-radius: 20px 0 0 0;
|
||||
-moz-box-shadow: -8px 0 13px rgba(17, 17, 17, 0.2);
|
||||
-webkit-box-shadow: -8px 0 13px rgba(17, 17, 17, 0.2);
|
||||
box-shadow: -8px 0 13px rgba(17, 17, 17, 0.2);
|
||||
-moz-box-shadow: 0 8px 13px rgba(17, 17, 17, 0.2);
|
||||
-webkit-box-shadow: 0 8px 13px rgba(17, 17, 17, 0.2);
|
||||
box-shadow: 0 8px 13px rgba(17, 17, 17, 0.2);
|
||||
}
|
||||
.modal-wrapper .postboard {
|
||||
border: none;
|
||||
@ -743,7 +742,7 @@ button.light:hover, a.button.light:hover {
|
||||
.modal-wrapper.directMessages .post-area-new {
|
||||
display: none;
|
||||
z-index: 5;
|
||||
background: #EBEBEB !important;
|
||||
background: #FDFCFA !important;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100% !important;
|
||||
@ -758,9 +757,6 @@ button.light:hover, a.button.light:hover {
|
||||
padding: 5px;
|
||||
width: 100% !important;
|
||||
}
|
||||
.modal-wrapper.directMessages .post-area-extras span {
|
||||
color: white;
|
||||
}
|
||||
.modal-wrapper.directMessages .modal-header h3 span {
|
||||
display: inline-block !important;
|
||||
padding-left: 5px;
|
||||
@ -1227,9 +1223,9 @@ button.light:hover, a.button.light:hover {
|
||||
|
||||
/************* POST BOARD ************ */
|
||||
.postboard {
|
||||
width: 40%;
|
||||
margin-left: 30%;
|
||||
padding: 20px;
|
||||
width: 55%;
|
||||
margin-left: 15%;
|
||||
padding: 7px 20px;
|
||||
}
|
||||
.postboard h2 {
|
||||
display: none;
|
||||
@ -1317,6 +1313,7 @@ button.light:hover, a.button.light:hover {
|
||||
display: inline-block;
|
||||
float: left;
|
||||
vertical-align: middle;
|
||||
overflow: hidden;
|
||||
width: 40px;
|
||||
}
|
||||
.post-photo img {
|
||||
@ -1833,27 +1830,29 @@ button.light:hover, a.button.light:hover {
|
||||
|
||||
.promoted-posts-only {
|
||||
margin: 0 0;
|
||||
float: right;
|
||||
}
|
||||
.promoted-posts-only li {
|
||||
cursor: pointer;
|
||||
display: block;
|
||||
margin: 0;
|
||||
padding: 5px 15px;
|
||||
padding: 5px;
|
||||
border-bottom: 1px solid #EBEBEB;
|
||||
text-align: center;
|
||||
font-size: 0.9em;
|
||||
transition: color 0.1s linear;
|
||||
}
|
||||
.promoted-posts-only li.active {
|
||||
color: #222;
|
||||
background: white;
|
||||
.promoted-posts-only li.disabled {
|
||||
background: #F4F3F2;
|
||||
}
|
||||
.promoted-posts-only li.active, .promoted-posts-only li.active span {
|
||||
color: #444;
|
||||
cursor: default;
|
||||
}
|
||||
.promoted-posts-only li:hover, .promoted-posts-only li.disabled:hover {
|
||||
color: #222;
|
||||
.promoted-posts-only li:hover span, .promoted-posts-only li.disabled:hover span {
|
||||
color: #444;
|
||||
}
|
||||
.promoted-posts-only li.disabled {
|
||||
color: #aaa;
|
||||
background: #C3C3C3;
|
||||
.promoted-posts-only li.disabled span {
|
||||
color: rgba(68, 68, 68, 0.3);
|
||||
}
|
||||
|
||||
/* Wrapper and blocks */
|
||||
@ -1870,10 +1869,11 @@ button.light:hover, a.button.light:hover {
|
||||
position: absolute;
|
||||
top: 50px;
|
||||
left: 0;
|
||||
width: 30%;
|
||||
width: 15%;
|
||||
}
|
||||
.dashboard.left > .module {
|
||||
float: right;
|
||||
width: 128px;
|
||||
}
|
||||
.dashboard.right {
|
||||
position: fixed;
|
||||
@ -1951,7 +1951,7 @@ ul.userMenu-search-profiles li a {
|
||||
padding: 0;
|
||||
color: #444;
|
||||
}
|
||||
ul.userMenu-search-profiles li a span, ul.userMenu-search-profiles li a b {
|
||||
ul.userMenu-search-profiles li a span, ul.userMenu-search-profiles li a b, ul.userMenu-search-profiles li a span:hover, ul.userMenu-search-profiles li a b:hover {
|
||||
display: inline-block;
|
||||
color: #444;
|
||||
font-weight: 400;
|
||||
@ -2028,8 +2028,7 @@ ul.userMenu-search-profiles button {
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
border-top: 1px solid #EBEBEB;
|
||||
border-bottom: 1px solid #EBEBEB;
|
||||
background: white;
|
||||
background: #F4F3F2;
|
||||
}
|
||||
.mini-profile-indicators li {
|
||||
-moz-box-sizing: border-box;
|
||||
@ -2038,13 +2037,8 @@ ul.userMenu-search-profiles button {
|
||||
display: block;
|
||||
position: relative;
|
||||
font-size: 0.8em;
|
||||
width: 25%;
|
||||
float: left;
|
||||
text-align: center;
|
||||
border-right: 1px solid #EBEBEB;
|
||||
}
|
||||
.mini-profile-indicators li:last-child {
|
||||
border: none;
|
||||
border-bottom: 1px solid #EBEBEB;
|
||||
}
|
||||
.mini-profile-indicators li a {
|
||||
color: #777777;
|
||||
@ -2053,6 +2047,7 @@ ul.userMenu-search-profiles button {
|
||||
}
|
||||
.mini-profile-indicators li a:hover {
|
||||
color: #444;
|
||||
background: #FDFCFA;
|
||||
}
|
||||
.mini-profile-indicators li a:before {
|
||||
display: block !important;
|
||||
@ -2084,24 +2079,22 @@ ul.userMenu-search-profiles button {
|
||||
|
||||
.mini-profile-name {
|
||||
color: #444;
|
||||
font-size: 1.3em;
|
||||
font-weight: 700;
|
||||
font-size: 1em;
|
||||
font-weight: 500;
|
||||
padding: 10px 0;
|
||||
display: block;
|
||||
text-align: center;
|
||||
margin: auto;
|
||||
}
|
||||
.mini-profile-name:hover {
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
.mini-profile-photo {
|
||||
.mini-profile-photo img {
|
||||
width: 64px;
|
||||
height: auto;
|
||||
display: block;
|
||||
margin: auto;
|
||||
}
|
||||
.mini-profile-photo img {
|
||||
width: 100%;
|
||||
margin: 32px auto 0 auto;
|
||||
}
|
||||
|
||||
.profile-data {
|
||||
@ -2132,6 +2125,16 @@ ul.userMenu-search-profiles button {
|
||||
padding-right: 5px;
|
||||
}
|
||||
|
||||
.mini-profile a span.following-count {
|
||||
display: block;
|
||||
font-weight: 900;
|
||||
font-size: 1.2rem;
|
||||
color: #777777;
|
||||
}
|
||||
.mini-profile a:hover span.following-count {
|
||||
color: #444;
|
||||
}
|
||||
|
||||
.mini-profile-info a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
@ -2197,20 +2200,41 @@ ul.userMenu-search-profiles button {
|
||||
border-bottom: solid 1px #A1B775;
|
||||
}
|
||||
|
||||
.mini-profile .post-area {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#postboard-top {
|
||||
clear: both;
|
||||
position: fixed;
|
||||
top: 50px;
|
||||
width: 30%;
|
||||
margin-bottom: 1px;
|
||||
left: 0;
|
||||
position: relative;
|
||||
margin-bottom: 10px;
|
||||
transition: height 0.3s linear;
|
||||
padding: 10px 10px 5px 10px;
|
||||
padding: 10px;
|
||||
background: white;
|
||||
overflow: hidden;
|
||||
display: none;
|
||||
background: #FDFCFA;
|
||||
-moz-box-shadow: 0 0 13px rgba(17, 17, 17, 0);
|
||||
-webkit-box-shadow: 0 0 13px rgba(17, 17, 17, 0);
|
||||
box-shadow: 0 0 13px rgba(17, 17, 17, 0);
|
||||
-moz-transition-property: box-shadow;
|
||||
-o-transition-property: box-shadow;
|
||||
-webkit-transition-property: box-shadow;
|
||||
transition-property: box-shadow;
|
||||
-moz-transition-duration: 0.2s;
|
||||
-o-transition-duration: 0.2s;
|
||||
-webkit-transition-duration: 0.2s;
|
||||
transition-duration: 0.2s;
|
||||
-moz-transition-timing-function: ease-out;
|
||||
-o-transition-timing-function: ease-out;
|
||||
-webkit-transition-timing-function: ease-out;
|
||||
transition-timing-function: ease-out;
|
||||
z-index: 120;
|
||||
}
|
||||
#postboard-top.on, #postboard-top {
|
||||
-moz-box-shadow: 0 8px 13px rgba(17, 17, 17, 0.2);
|
||||
-webkit-box-shadow: 0 8px 13px rgba(17, 17, 17, 0.2);
|
||||
box-shadow: 0 8px 13px rgba(17, 17, 17, 0.2);
|
||||
}
|
||||
#postboard-top.hide {
|
||||
display: none !important;
|
||||
}
|
||||
@ -2235,6 +2259,7 @@ ul.userMenu-search-profiles button {
|
||||
-moz-box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
background: none;
|
||||
float: right;
|
||||
}
|
||||
#postboard-top .post-area .post-area-new {
|
||||
@ -2411,8 +2436,7 @@ img.twister-user-photo {
|
||||
letter-spacing: 0;
|
||||
float: right;
|
||||
display: block;
|
||||
padding: 4px;
|
||||
margin: 0 0 0 15px;
|
||||
margin: 5px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
@ -2425,8 +2449,7 @@ img.twister-user-photo {
|
||||
letter-spacing: 0;
|
||||
float: right;
|
||||
display: block;
|
||||
padding: 4px;
|
||||
margin: 0 0 0 15px;
|
||||
margin: 5px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
@ -2437,15 +2460,16 @@ img.twister-user-photo {
|
||||
}
|
||||
|
||||
/***********TOP TRENDS************** */
|
||||
ol.toptrends-list {
|
||||
.toptrends-list {
|
||||
margin: 0;
|
||||
margin-bottom: 10px;
|
||||
clear: both;
|
||||
border-top: 1px solid #EBEBEB;
|
||||
padding: 10px;
|
||||
}
|
||||
ol.toptrends-list li {
|
||||
.toptrends-list li {
|
||||
display: inline-block;
|
||||
}
|
||||
ol.toptrends-list a {
|
||||
.toptrends-list a {
|
||||
color: #aaa;
|
||||
padding: 3px 8px;
|
||||
display: inline-block;
|
||||
@ -2454,9 +2478,11 @@ ol.toptrends-list a {
|
||||
margin: 3px;
|
||||
font-weight: 500;
|
||||
background: white;
|
||||
-moz-box-shadow: 0 5px 8px rgba(85, 85, 85, 0.2);
|
||||
-webkit-box-shadow: 0 5px 8px rgba(85, 85, 85, 0.2);
|
||||
box-shadow: 0 5px 8px rgba(85, 85, 85, 0.2);
|
||||
}
|
||||
ol.toptrends-list a:hover {
|
||||
background: rgba(255, 255, 255, 0.4);
|
||||
.toptrends-list a:hover {
|
||||
color: #222;
|
||||
}
|
||||
|
||||
|
||||
@ -4,30 +4,34 @@
|
||||
|
||||
$(window).resize(function()
|
||||
{
|
||||
|
||||
$('.module.toptrends').detach().appendTo($('.dashboard.right'));
|
||||
$('.module.who-to-follow').detach().appendTo($('.dashboard.right'));
|
||||
$('.module.twistday-reminder').detach().appendTo($('.dashboard.right'));
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
$(document).ready(function()
|
||||
{
|
||||
|
||||
$('.module.toptrends').detach().appendTo($('.dashboard.right'));
|
||||
$('.module.who-to-follow').detach().appendTo($('.dashboard.right'));
|
||||
$('.module.twistday-reminder').detach().appendTo($('.dashboard.right'));
|
||||
|
||||
$('#postboard-top textarea').on('blur',function(){$('#postboard-top').removeClass('on');});
|
||||
$('#postboard-top textarea').on('focus',function(){$('#postboard-top').addClass('on');});
|
||||
|
||||
|
||||
|
||||
var windowHeight = $(window).height();
|
||||
$('.modal-close').html('');
|
||||
//$('.mini-profile .open-following-page').parent('li').detach().appendTo($('.mini-profile-indicators'));
|
||||
$('.mini-profile .open-following-page').parent('li').detach().appendTo($('.mini-profile-indicators'));
|
||||
|
||||
$('.modal-back').html('');
|
||||
$('.twister-user-remove').html('');
|
||||
$('.profile-card-main').attr('style', '');
|
||||
$('.userMenu-search-profiles button').html('+').attr('title',polyglot.t('Follow'));
|
||||
$('.mini-profile-actions span').html('');
|
||||
$('.promoted-posts-only').detach().appendTo($('.dashboard.left'));
|
||||
$('.promoted-posts-only').detach().appendTo($('.left .mini-profile'));
|
||||
$('.mini-profile-indicators').detach().insertAfter($('.dashboard.left .profile-data'));
|
||||
$('.post-context').each(function(){
|
||||
$(this).prependTo($(this).parent());
|
||||
@ -47,11 +51,11 @@ $(document).ready(function()
|
||||
//active promoted posts tab
|
||||
$(this).children('.promoted-posts').addClass(promotedPostsOnly ? "active" : "disabled");
|
||||
$(this).children('.normal-posts').addClass(promotedPostsOnly ? "disabled" : "active");
|
||||
//$('#postboard-top').removeClass(promotedPostsOnly ? "show" : "hide");
|
||||
$('#postboard-top').removeClass(promotedPostsOnly ? "show" : "hide");
|
||||
//active normal posts
|
||||
$(this).children('.promoted-posts').removeClass(promotedPostsOnly ? "disabled" : "active");
|
||||
$(this).children('.normal-posts').removeClass(promotedPostsOnly ? "active" : "disabled");
|
||||
//$('#postboard-top').addClass(promotedPostsOnly ? "hide" : "show");
|
||||
$('#postboard-top').addClass(promotedPostsOnly ? "hide" : "show");
|
||||
});
|
||||
|
||||
|
||||
|
||||
@ -17,7 +17,6 @@ html
|
||||
background-color: $main-background-color
|
||||
//+background-image(linear-gradient(to top right, #fff, $main-background-color, #fff) )
|
||||
background-attachment: fixed
|
||||
|
||||
body
|
||||
font-size: $main-font-size
|
||||
line-height : $main-line-height
|
||||
|
||||
@ -5,7 +5,7 @@
|
||||
.post-area-new
|
||||
display: none
|
||||
z-index: 5
|
||||
background: $bloc-background-color !important
|
||||
background: $bloc-light-color !important
|
||||
position: absolute
|
||||
bottom: 0
|
||||
width: 100% !important
|
||||
@ -17,10 +17,6 @@
|
||||
padding: 5px
|
||||
width: 100%!important
|
||||
|
||||
.post-area-extras
|
||||
span
|
||||
color: white
|
||||
|
||||
|
||||
.modal-header
|
||||
h3 span
|
||||
|
||||
@ -17,8 +17,10 @@ $menu-font-color: white
|
||||
@extend .clear-fix
|
||||
+box-sizing(border-box)
|
||||
width: 100%
|
||||
max-width: 70%
|
||||
max-width: 100%
|
||||
padding: 0 20px
|
||||
margin: 0
|
||||
margin: auto
|
||||
background: image-url("logo.png") no-repeat 50% 50%
|
||||
background-size: 20px
|
||||
li
|
||||
|
||||
@ -19,8 +19,7 @@ $header-modal-height : $menu-height
|
||||
right: 0
|
||||
bottom: 0
|
||||
overflow: hidden
|
||||
+border-radius(20px 0 0 0)
|
||||
+box-shadow(-8px 0 13px rgba(#111, 0.2))
|
||||
+box-shadow(0 8px 13px rgba(#111, 0.2))
|
||||
.postboard
|
||||
border: none
|
||||
padding: 0
|
||||
|
||||
@ -6,9 +6,9 @@
|
||||
|
||||
|
||||
.postboard
|
||||
width: 40%
|
||||
margin-left: 30%
|
||||
padding: 20px
|
||||
width: 55%
|
||||
margin-left: 15%
|
||||
padding: 7px 20px
|
||||
h2
|
||||
display: none
|
||||
.postboard-posts
|
||||
@ -79,6 +79,7 @@
|
||||
display: inline-block
|
||||
float: left
|
||||
vertical-align: middle
|
||||
overflow: hidden
|
||||
width: $mini-usr-img
|
||||
img
|
||||
width: 100%
|
||||
|
||||
107
sass/style.sass
107
sass/style.sass
@ -27,25 +27,25 @@
|
||||
|
||||
.promoted-posts-only
|
||||
margin: 0 0
|
||||
@extend .clear-fix
|
||||
float: right
|
||||
|
||||
|
||||
li
|
||||
cursor: pointer
|
||||
display: block
|
||||
margin: 0
|
||||
padding: 5px 15px
|
||||
padding: 5px
|
||||
border-bottom: 1px solid $main-background-color
|
||||
text-align: center
|
||||
font-size: .9em
|
||||
transition: color .1s linear
|
||||
&.active
|
||||
color: $main-color-dark
|
||||
background: white
|
||||
&.disabled
|
||||
background: #F4F3F2
|
||||
&.active, &.active span
|
||||
color: $defaut-font-color
|
||||
cursor: default
|
||||
&:hover, &.disabled:hover
|
||||
color: $main-color-dark
|
||||
&.disabled
|
||||
color: $main-color-light
|
||||
background: $light-grey
|
||||
&:hover span, &.disabled:hover span
|
||||
color: $defaut-font-color
|
||||
&.disabled span
|
||||
color: rgba($defaut-font-color, .3)
|
||||
|
||||
|
||||
|
||||
@ -66,9 +66,10 @@
|
||||
position: absolute
|
||||
top: $menu-height
|
||||
left: 0
|
||||
width: 30%
|
||||
width: 15%
|
||||
> .module
|
||||
float: right
|
||||
width: $usr-img * 2
|
||||
&.right
|
||||
position: fixed
|
||||
right: 0
|
||||
@ -82,6 +83,7 @@
|
||||
background: $bloc-light-color
|
||||
width: 100%
|
||||
@extend .box-shadow
|
||||
@extend .clear-fix
|
||||
h3
|
||||
float: left
|
||||
padding: 20px
|
||||
@ -145,7 +147,7 @@ ul.userMenu-search-profiles
|
||||
margin: 0
|
||||
padding: 0
|
||||
color: $defaut-font-color
|
||||
span, b
|
||||
span, b, span:hover, b:hover
|
||||
display: inline-block
|
||||
color: $defaut-font-color
|
||||
font-weight: 400
|
||||
@ -154,7 +156,7 @@ ul.userMenu-search-profiles
|
||||
.mini-screen-name b,
|
||||
.mini-screen-name
|
||||
font-weight: 500
|
||||
.mini-profile-photo
|
||||
.mini-profile-photo
|
||||
width: $mini-usr-img
|
||||
height: auto
|
||||
margin: 10px
|
||||
@ -203,9 +205,7 @@ ul.userMenu-search-profiles
|
||||
|
||||
.mini-profile
|
||||
@extend .box-shadow
|
||||
.mini-profile-info
|
||||
|
||||
|
||||
|
||||
a.button
|
||||
background: $main-color-light
|
||||
margin: 1em auto
|
||||
@ -227,20 +227,15 @@ ul.userMenu-search-profiles
|
||||
text-align: center
|
||||
@extend .clear-fix
|
||||
border-top: 1px solid $main-background-color
|
||||
border-bottom: 1px solid $main-background-color
|
||||
background: white
|
||||
background: #F4F3F2
|
||||
|
||||
li
|
||||
+box-sizing(border-box)
|
||||
display: block
|
||||
position: relative
|
||||
font-size: .8em
|
||||
width: 25%
|
||||
float: left
|
||||
text-align: center
|
||||
border-right: 1px solid $main-background-color
|
||||
&:last-child
|
||||
border: none
|
||||
border-bottom: 1px solid $main-background-color
|
||||
|
||||
a
|
||||
color: lighten($dark-grey,20%)
|
||||
@ -248,6 +243,7 @@ ul.userMenu-search-profiles
|
||||
padding: 1rem 0
|
||||
&:hover
|
||||
color: $dark-grey
|
||||
background: $bloc-light-color
|
||||
&:before
|
||||
display: block!important
|
||||
width: 100%!important
|
||||
@ -283,22 +279,21 @@ ul.userMenu-search-profiles
|
||||
|
||||
.mini-profile-name
|
||||
color: $dark-grey
|
||||
font-size: 1.3em
|
||||
font-weight: 700
|
||||
font-size: 1em
|
||||
font-weight: 500
|
||||
padding: 10px 0
|
||||
display: block
|
||||
text-align: center
|
||||
margin: auto
|
||||
&:hover
|
||||
color: $main-color-light
|
||||
|
||||
|
||||
.mini-profile-photo
|
||||
.mini-profile-photo img
|
||||
width: $usr-img
|
||||
height: auto
|
||||
display: block
|
||||
margin: auto
|
||||
img
|
||||
width: 100%
|
||||
margin: 32px auto 0 auto
|
||||
|
||||
|
||||
|
||||
@ -325,7 +320,15 @@ ul.userMenu-search-profiles
|
||||
&.posts-count, &.following-count, &.followers-count
|
||||
display: inline-block
|
||||
padding-right: 5px
|
||||
|
||||
.mini-profile
|
||||
a
|
||||
span.following-count
|
||||
display: block
|
||||
font-weight: 900
|
||||
font-size: 1.2rem
|
||||
color: lighten($dark-grey,20%)
|
||||
&:hover span.following-count
|
||||
color: $dark-grey
|
||||
|
||||
.mini-profile-info a:hover
|
||||
text-decoration: none
|
||||
@ -364,6 +367,7 @@ ul.userMenu-search-profiles
|
||||
/***************** POST AREA ***************/
|
||||
|
||||
.post-area-new
|
||||
|
||||
textarea
|
||||
resize: none
|
||||
+box-sizing(border-box)
|
||||
@ -383,19 +387,26 @@ ul.userMenu-search-profiles
|
||||
&:focus
|
||||
border-bottom: solid 1px $main-color-color
|
||||
|
||||
.mini-profile .post-area
|
||||
display: none
|
||||
|
||||
#postboard-top
|
||||
clear: both
|
||||
position: fixed
|
||||
top: $menu-height
|
||||
width: 30%
|
||||
position: relative
|
||||
@extend .clear-fix
|
||||
margin-bottom: 1px
|
||||
left: 0
|
||||
margin-bottom: 10px
|
||||
transition: height .3s linear
|
||||
padding: 10px 10px 5px 10px
|
||||
padding: 10px
|
||||
background: white
|
||||
overflow: hidden
|
||||
display: none
|
||||
background: $bloc-light-color
|
||||
+box-shadow(0 0 13px rgba(#111, 0))
|
||||
+transition-property(box-shadow)
|
||||
+transition-duration(.2s)
|
||||
+transition-timing-function(ease-out)
|
||||
@extend .on
|
||||
&.on
|
||||
+box-shadow(0 8px 13px rgba(#111, 0.2))
|
||||
z-index: 120
|
||||
&.hide
|
||||
display: none!important
|
||||
@ -417,6 +428,7 @@ ul.userMenu-search-profiles
|
||||
padding-right: 0
|
||||
display: inline
|
||||
+box-sizing(border-box)
|
||||
background: none
|
||||
float: right
|
||||
.post-area-new
|
||||
@extend .open
|
||||
@ -580,8 +592,7 @@ img.twister-user-photo
|
||||
letter-spacing: 0
|
||||
float: right
|
||||
display: block
|
||||
padding: 4px
|
||||
margin: 0 0 0 15px
|
||||
margin: 5px
|
||||
position: relative
|
||||
|
||||
.view-all-users
|
||||
@ -593,8 +604,7 @@ img.twister-user-photo
|
||||
letter-spacing: 0
|
||||
float: right
|
||||
display: block
|
||||
padding: 4px
|
||||
margin: 0 0 0 15px
|
||||
margin: 5px
|
||||
position: relative
|
||||
|
||||
.refresh-toptrends:hover, .twistday-reminder .refresh:hover, .refresh-users:hover, .view-all-users:hover
|
||||
@ -604,13 +614,11 @@ img.twister-user-photo
|
||||
|
||||
/***********TOP TRENDS***************/
|
||||
|
||||
.toptrends
|
||||
|
||||
|
||||
ol.toptrends-list
|
||||
.toptrends-list
|
||||
margin: 0
|
||||
margin-bottom: 10px
|
||||
clear: both
|
||||
border-top: 1px solid $main-background-color
|
||||
padding: 10px
|
||||
|
||||
li
|
||||
display: inline-block
|
||||
@ -624,9 +632,8 @@ ol.toptrends-list
|
||||
margin: 3px
|
||||
font-weight: 500
|
||||
background: white
|
||||
@extend .box-shadow
|
||||
+box-shadow(0 5px 8px rgba(#555, 0.2))
|
||||
&:hover
|
||||
background: rgba(white,.4)
|
||||
color: $main-color-dark
|
||||
|
||||
/********* TWISTDAY REMINDER *******/
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user