From 5f10a1f6eebb31d653ccbb8f676f89c5b1dded50 Mon Sep 17 00:00:00 2001 From: erqan Date: Fri, 16 May 2014 00:09:51 +0300 Subject: [PATCH] more calm theme css adaptation --- css/style.css | 26 ++------- js/interface_common.js | 2 +- theme_calm/css/profile.css | 8 ++- theme_calm/css/style.css | 105 +++++++++++++++++++++++++++++++++++-- 4 files changed, 114 insertions(+), 27 deletions(-) diff --git a/css/style.css b/css/style.css index c94c074..53781d6 100644 --- a/css/style.css +++ b/css/style.css @@ -564,6 +564,10 @@ button.disabled:hover width: 445px; display: block; transition: all .3s linear; + -webkit-transition: height 0.3s linear; + -moz-transition: height 0.3s linear; + -o-transition: height 0.3s linear; + -ms-transition: height 0.3s linear; height: 28px; border-radius: 3px; border: solid 1px rgba(0, 0, 0, .3 ); @@ -590,28 +594,6 @@ button.disabled:hover textarea.splited-post { box-shadow: none!important; height: 28px; - transition: height 1s linear; - -webkit-transition: height 0.3s linear; - -moz-transition: height 0.3s linear; - -o-transition: height 0.3s linear; - -ms-transition: height 0.3s linear; - animation-name: splited-part; - animation-duration: 0.5s; - animation-easing-function: linear; - -webkit-animation-name: sent-part; - -webkit-animation-duration: 0.5s; - -webkit-animation-easing-function: linear; - -moz-animation-name: sent-part; - -moz-animation-duration: 0.5s; - -moz-animation-easing-function: linear; -} -@keyframes splited-part { - from { - height: 0px; - } - to { - height: 80px; - } } .splited-post-counter { color: rgba(0, 0, 0, 0.3); diff --git a/js/interface_common.js b/js/interface_common.js index ae479fd..637eee2 100644 --- a/js/interface_common.js +++ b/js/interface_common.js @@ -586,7 +586,7 @@ function replyTextKeypress(e) { var $tas = tweetForm.find("textarea"); splitedPostsCount = $tas.length; if ($this.hasClass('splited-post')) - $this.css('height', '24px'); + $this.css('height', '28px'); var reply_to = $this.attr('data-reply-to'); for (var i = 0; i < $tas.length; i++) { diff --git a/theme_calm/css/profile.css b/theme_calm/css/profile.css index 8416c81..82eb816 100644 --- a/theme_calm/css/profile.css +++ b/theme_calm/css/profile.css @@ -345,11 +345,17 @@ button.follow:hover { { margin-left: 0; padding: 5px 0 5px 0; - height: 100%; + height: 60%; } .profile-modal .postboard h2 { width: auto; } +.profile-modal .postboard-posts +{ + display: block; + height: 90%; + overflow: auto; +} .profile-modal .postboard h2 span { font: 18px/40px 'Open Sans Condensed', sans-serif; padding-left: 10px; diff --git a/theme_calm/css/style.css b/theme_calm/css/style.css index db254e4..d952d2d 100644 --- a/theme_calm/css/style.css +++ b/theme_calm/css/style.css @@ -97,6 +97,10 @@ h3 font-size: 14px; color: rgba( 0, 0, 0, .5 ); } +.isFollowing:after { + color: #1a1; + content: '\2714'; +} /************************************* **************************** BUTTONS ** **************************************/ @@ -644,6 +648,28 @@ input.userMenu-search-field:focus::-ms-input-placeholder { { text-decoration: none; } +.who-follow +{ + height: auto; + background-color: rgba(69, 71, 77, 0.1); + overflow: hidden; + font-size: 12px; +} +.show-more-followers { + color: #f11; + font-weight: bold; + cursor: pointer; + float: right; +} +.mini-follower-link +{ + display: inline-block; + margin-right: 10px; +} +.mini-follower-link:before +{ + content: " \2027"; +} /*********************************** ********************* POST AREA **** ***********************************/ @@ -656,6 +682,10 @@ input.userMenu-search-field:focus::-ms-input-placeholder { width: 430px; display: block; transition: all .3s linear; + -webkit-transition: height 0.3s linear; + -moz-transition: height 0.3s linear; + -o-transition: height 0.3s linear; + -ms-transition: height 0.3s linear; height: 28px; border-radius: 3px; border: solid 1px rgba(0, 0, 0, .3 ); @@ -679,6 +709,17 @@ input.userMenu-search-field:focus::-ms-input-placeholder { border: solid 1px rgba( 118, 145, 206, .8 ); box-shadow: 0 0 10px rgba(0, 0, 0, .3 ); } +textarea.splited-post { + box-shadow: none!important; + height: 28px; +} +.splited-post-counter { + color: rgba(0, 0, 0, 0.3); + font-weight: bold; +} +.splited-post-counter:before { + content: '\2026'; +} .post-area-extras { overflow: hidden; @@ -1624,7 +1665,8 @@ input.userMenu-search-field:focus::-ms-input-placeholder { color: #fff; background: rgba( 0, 0, 0, .1 ); } -.modal-back { +.modal-back, +.mark-all-as-read { position: absolute; right: 30px; top: 0; @@ -1636,8 +1678,8 @@ input.userMenu-search-field:focus::-ms-input-placeholder { transition: all .1s linear; display: none; } -.modal-back:hover -{ +.modal-back:hover, +.mark-all-as-read:hover { color: #fff; background: rgba( 0, 0, 0, .1 ); } @@ -1778,6 +1820,12 @@ input.userMenu-search-field:focus::-ms-input-placeholder { .direct-messages-thread li.message:hover { background: none; } +.mark-all-as-read { + right: 60px; +} +.mark-all-as-read:before { + content: '\2714'; +} /************************************* ****************** NEW USER MODAL **************************************/ @@ -1877,6 +1925,7 @@ input.userMenu-search-field:focus::-ms-input-placeholder { .following-modal .modal-content { padding: 15px; + height: 400px; overflow-y: auto; } .following-modal .modal-buttons @@ -1904,6 +1953,56 @@ input.userMenu-search-field:focus::-ms-input-placeholder { text-decoration: underline; } /************************************* +******************* WHO TO FOLLOW MODAL +**************************************/ +.who-to-follow-modal .modal-wrapper +{ + width: 560px; + height: 470px; + margin: -200px 0 0 -280px; + overflow-x: hidden; +} +.who-to-follow-modal .modal-content +{ + padding: 15px; + height: 400px; + overflow-y: auto; +} +.who-to-follow-modal .modal-buttons +{ + display: none; +} +.who-to-follow-modal ol +{ + margin: 5px; +} +.who-to-follow-modal .open-profile-modal:hover +{ + text-decoration: none; +} +.who-to-follow-modal .open-profile-modal span +{ + vertical-align: middle; +} +.who-to-follow-modal .open-profile-modal span:hover +{ + text-decoration: underline; +} +.who-to-follow-modal .follow +{ + float: right; + margin: -30px 10px 0 10px; +} +.who-to-follow-modal .twister-user-info span +{ + vertical-align: bottom; +} +.who-to-follow-modal .bio +{ + font-size: 12px; + color: rgba( 0, 0, 0, .6 ); +} +/************************************* ****************** LOADER ************ **************************************/ .postboard-loading