twisterarmy
/
theme_nin
mirror of https://github.com/twisterarmy/theme_nin.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Cleaning .sass

nin-v2
Mylene 9 years ago
parent
c10d6892a2
commit
087d4f41d0
11 changed files with 194 additions and 212 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 235
      css/style.css
  2. 6
      sass/base/_commons.sass
  3. 6
      sass/base/_utils.sass
  4. 16
      sass/base/_var.sass
  5. 4
      sass/layout/_menu.sass
  6. 56
      sass/layout/_modal.sass
  7. 10
      sass/layout/_postboard.sass
  8. 4
      sass/layout/_profile.sass
  9. 1
      sass/layout/_tabs.sass
  10. 16
      sass/pages/_following.sass
  11. 52
      sass/style.sass

235
css/style.css
Unescape View File

@ -249,56 +249,56 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, @@ -249,56 +249,56 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu,
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.col.last, .following, .following-list li.last, .following-list li.following, .following-list li:nth-child(4n), .following-list li.dashboard.right, .following-list .network.singleBlock li.module:nth-child(4n), .network.singleBlock .following-list li.module:nth-child(4n), .login .last.module, .login .module.following, .login .module.dashboard.right, .network.singleBlock .last.module, .network.singleBlock .module.following, .network.singleBlock .module:last-child, .network.singleBlock .module.dashboard.right, .network.singleBlock .module.twister-user:nth-child(4n), .col.dashboard.right, .dashboard.right.following, .dashboard.right.twister-user, .last.twister-user, .twister-user:nth-child(4n) {
.col.last, .following, .following-list li.last, .following-list li.following, .following-list li:nth-child(4n), .following-list .network.singleBlock li.module:nth-child(4n), .network.singleBlock .following-list li.module:nth-child(4n), .login .last.module, .login .module.following, .network.singleBlock .last.module, .network.singleBlock .module.following, .network.singleBlock .module:last-child, .network.singleBlock .module.twister-user:nth-child(4n), .last.twister-user, .twister-user:nth-child(4n) {
margin-right: 0;
}
.col-1 {
width: 6.04167%;
width: 1.875%;
}
.col-2 {
width: 14.58333%;
width: 6.25%;
}
.col-3, .following-list li, .twister-user {
width: 23.125%;
width: 10.625%;
}
.col-4 {
width: 31.66667%;
width: 15%;
}
.col-5 {
width: 40.20833%;
width: 19.375%;
}
.col-6, .login .module, .network.singleBlock .module {
width: 48.75%;
width: 23.75%;
}
.col-7 {
width: 57.29167%;
width: 28.125%;
}
.col-8 {
width: 65.83333%;
width: 32.5%;
}
.col-9, .following {
width: 74.375%;
width: 36.875%;
}
.col-10 {
width: 82.91667%;
width: 41.25%;
}
.col-11 {
width: 91.45833%;
width: 45.625%;
}
.col-12 {
width: 100%;
width: 50%;
}
/* FONTS */
@ -307,6 +307,7 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, @@ -307,6 +307,7 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu,
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
list-style: none;
}
html, body {
@ -319,13 +320,13 @@ html, body { @@ -319,13 +320,13 @@ html, body {
html {
font-size: 15px;
background-color: #e9e9e9;
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuMCIgeTE9IjEuMCIgeDI9IjEuMCIgeTI9IjAuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2FhYWFhYSIvPjxzdG9wIG9mZnNldD0iMjUlIiBzdG9wLWNvbG9yPSIjZTllOWU5Ii8+PHN0b3Agb2Zmc2V0PSI1MCUiIHN0b3AtY29sb3I9IiNlOWU5ZTkiLz48c3RvcCBvZmZzZXQ9Ijc1JSIgc3RvcC1jb2xvcj0iI2U5ZTllOSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2FhYWFhYSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-color: #dddddd;
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuMCIgeTE9IjEuMCIgeDI9IjEuMCIgeTI9IjAuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIvPjxzdG9wIG9mZnNldD0iNTAlIiBzdG9wLWNvbG9yPSIjZGRkZGRkIi8+PHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjZmZmZmZmIi8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0idXJsKCNncmFkKSIgLz48L3N2Zz4g');
background-size: 100%;
background-image: -webkit-gradient(linear, 0% 100%, 100% 0%, color-stop(0%, #aaaaaa), color-stop(25%, #e9e9e9), color-stop(50%, #e9e9e9), color-stop(75%, #e9e9e9), color-stop(100%, #aaaaaa));
background-image: -moz-linear-gradient(bottom, #aaaaaa, #e9e9e9, #e9e9e9, #e9e9e9, #aaaaaa);
background-image: -webkit-linear-gradient(bottom, #aaaaaa, #e9e9e9, #e9e9e9, #e9e9e9, #aaaaaa);
background-image: linear-gradient(to top right, #aaaaaa, #e9e9e9, #e9e9e9, #e9e9e9, #aaaaaa);
background-image: -webkit-gradient(linear, 0% 100%, 100% 0%, color-stop(0%, #ffffff), color-stop(50%, #dddddd), color-stop(100%, #ffffff));
background-image: -moz-linear-gradient(bottom, #ffffff, #dddddd, #ffffff);
background-image: -webkit-linear-gradient(bottom, #ffffff, #dddddd, #ffffff);
background-image: linear-gradient(to top right, #ffffff, #dddddd, #ffffff);
background-attachment: fixed;
}
@ -357,6 +358,10 @@ strong, b { @@ -357,6 +358,10 @@ strong, b {
font-weight: 600;
}
img {
background: #222;
}
h1 {
font-size: 1.1em;
text-transform: uppercase;
@ -407,13 +412,13 @@ h3 .isFollowing:after { @@ -407,13 +412,13 @@ h3 .isFollowing:after {
display: none;
}
.box-shadow, .modal-wrapper, .prompt-wrapper, .open, .mini-profile .post-area-new, #postboard-top .post-area .post-area-new, .dialog-modal, .mini-profile, .who-to-follow.module, .toptrends.module, .twistday-reminder, ul.dropdown-menu {
.box-shadow, .modal-wrapper, .prompt-wrapper, .open, .mini-profile .post-area-new, #postboard-top .post-area .post-area-new, .dialog-modal, .mini-profile, .who-to-follow.module, ol.toptrends-list a, .twistday-reminder, ul.dropdown-menu {
-moz-box-shadow: 0 8px 13px rgba(51, 51, 51, 0.1);
-webkit-box-shadow: 0 8px 13px rgba(51, 51, 51, 0.1);
box-shadow: 0 8px 13px rgba(51, 51, 51, 0.1);
}
.clear-fix:after, .col:after, .following:after, .following-list li:after, .login .module:after, .network.singleBlock .module:after, .twister-user:after, .userMenu ul:after, .modal-content:after, .modal-header:after, .direct-messages-thread .post:after, .twister-user-info:after, .forEdition.profile-card:after, .expanded-content:after, .mini-following-info: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.module li:after, .who-to-follow ol:after, .twistday-reminder:after {
.clear-fix:after, .col:after, .following:after, .following-list li:after, .login .module:after, .network.singleBlock .module:after, .twister-user:after, .userMenu ul:after, .modal-content:after, .modal-header:after, .direct-messages-thread .post:after, .mini-following-info a:after, .twister-user-info:after, .forEdition.profile-card:after, .expanded-content: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.module li:after, .who-to-follow ol:after, .twistday-reminder:after {
content: "";
display: table;
clear: both;
@ -460,13 +465,13 @@ button.disabled:hover, .mini-profile-actions span.disabled:hover, a.button.disab @@ -460,13 +465,13 @@ button.disabled:hover, .mini-profile-actions span.disabled:hover, a.button.disab
box-shadow: 1px 1px 0 rgba(68, 68, 68, 0.3);
}
button.color-1, .modal-content button.postboard-news, .modal-content .mini-profile-actions span.postboard-news, .mini-profile-actions .modal-content span.postboard-news, button.follow, .mini-profile-actions span.follow, .mini-profile-actions span.color-1, a.button.color-1, .modal-content a.button.postboard-news, a.button.follow {
background: #00AA8B;
border-color: #009076;
background: #B4C669;
border-color: #abbf57;
color: white;
font-weight: 500;
}
button.color-1:hover, .modal-content button.postboard-news:hover, .modal-content .mini-profile-actions span.postboard-news:hover, .mini-profile-actions .modal-content span.postboard-news:hover, button.follow:hover, .mini-profile-actions span.follow:hover, .mini-profile-actions span.color-1:hover, a.button.color-1:hover, .modal-content a.button.postboard-news:hover, a.button.follow:hover {
border-color: #005d4c;
border-color: #90a43e;
}
button.color-2, button.unfollow, .mini-profile-actions span.unfollow, .mini-profile-actions span.color-2, a.button.color-2, a.button.unfollow {
background: #C3C3C3;
@ -490,7 +495,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -490,7 +495,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
height: 50px;
left: 0;
margin: 0;
background-color: #F5F5F5;
background-color: #555555;
z-index: 2;
}
.userMenu ul {
@ -513,7 +518,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -513,7 +518,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
line-height: 50px;
padding: 0 0.5em;
display: inline-block;
color: rgba(68, 68, 68, 0.7) !important;
color: rgba(255, 255, 255, 0.7) !important;
font-size: 1em;
position: relative;
font-weight: 500;
@ -522,10 +527,10 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -522,10 +527,10 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
box-sizing: border-box;
}
.userMenu ul li > a:hover {
color: #444 !important;
color: white !important;
}
.userMenu ul li.current a {
color: #444 !important;
color: white !important;
}
/* Menu specific entries */
@ -565,10 +570,10 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -565,10 +570,10 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
float: right;
position: relative;
margin-right: 0;
color: #444;
color: white;
}
.userMenu li.userMenu-config + a, .userMenu li.userMenu-search + a {
color: #596073;
color: #222;
}
.userMenu li.userMenu-search {
margin: 3px;
@ -580,7 +585,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -580,7 +585,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
padding: 7px;
}
.userMenu li.userMenu-search > input:focus {
border-color: #596073;
border-color: #222;
}
.userMenu li.userMenu-config > a {
font-size: 1.5rem;
@ -595,7 +600,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -595,7 +600,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
height: 100%;
height: 100vh;
right: 0;
bottom: 0;
overflow: hidden;
@ -615,8 +620,9 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -615,8 +620,9 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
}
.modal-content {
background: #f3f3f3;
overflow: hidden;
overflow-y: auto;
background: #f6f6f6;
}
.modal-content .postboard-news {
position: absolute;
@ -630,12 +636,11 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -630,12 +636,11 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
.modal-header {
position: relative;
background: #00AA8B;
background: #222;
height: 50px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
border-bottom: 1px solid #f3f3f3;
}
.modal-header h3 {
padding-left: 20px;
@ -702,6 +707,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -702,6 +707,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
position: relative;
width: 100%;
margin: auto;
background: #dddddd;
}
.modal-content .postboard h2 {
display: block;
@ -751,12 +757,6 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -751,12 +757,6 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
text-transform: none;
}
.following-config-method-buttons .public-following {
background-color: #B4C669;
margin: 0px 2px;
padding: 6px 16px;
}
/************ RETWIST POSTS MODAL ********* */
.prompt-wrapper.reTwist.prompt-wrapper {
margin-top: -110px;
@ -764,9 +764,6 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -764,9 +764,6 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
.prompt-wrapper.reTwist .modal-content {
padding: 20px 15px;
}
.prompt-wrapper.reTwist .modal-buttons .modal-propagate {
background-color: #B4C669;
}
.prompt-wrapper.reTwist .post-expand, .prompt-wrapper.reTwist .post-interactions {
display: none;
}
@ -786,7 +783,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -786,7 +783,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
.modal-wrapper.directMessages .post-area-new {
display: none;
z-index: 5;
background: #e9e9e9;
background: #dddddd;
position: absolute;
bottom: 0;
width: 100%;
@ -949,16 +946,31 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -949,16 +946,31 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
}
/****** FOLLOWING MODAL****** */
.modal-wrapper.following-modal .modal-content {
padding: 0;
.modal-wrapper.following-modal h2 {
display: none;
}
.modal-wrapper.following-modal ol {
margin: 5px;
.mini-following-info {
border-bottom: 1px solid #dddddd;
line-height: 45px;
}
.modal-wrapper.following-modal .open-profile-modal:hover {
text-decoration: none;
.mini-following-info a {
display: block;
padding: 10px;
width: 100%;
color: #444;
}
.mini-following-info a:hover {
background: white;
}
.mini-following-info .mini-profile-photo {
height: 48px;
width: 48px;
line-height: 0;
margin: 0 1rem 0 0;
float: left;
}
.modal-wrapper.following-modal .postboard h2 {
.mini-following-info .mini-screen-name {
display: none;
}
@ -1044,7 +1056,6 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -1044,7 +1056,6 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
.profile-card {
width: 100%;
background: white;
border-bottom: 1px solid #f3f3f3;
padding: 15px;
}
@ -1131,7 +1142,6 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -1131,7 +1142,6 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
display: none;
margin: 0 15px 0 0;
font-weight: 500;
background: #f3f3f3;
padding: 2px 8px 3px 8px;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
@ -1142,7 +1152,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -1142,7 +1152,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
font-size: 13px;
line-height: 15px;
cursor: pointer;
color: #596073;
color: #222;
}
.bitmessage-ctc:hover, .tox-ctc:hover {
color: #B4C669;
@ -1182,7 +1192,6 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -1182,7 +1192,6 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: auto;
background: #f3f3f3;
}
.forEdition.profile-card .profile-card-main {
margin: 0;
@ -1191,7 +1200,6 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -1191,7 +1200,6 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 10px;
background: #f3f3f3;
}
.forEdition.profile-card .profile-card-main input {
display: block;
@ -1239,8 +1247,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -1239,8 +1247,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
/************* POST BOARD ************ */
.postboard {
float: left;
width: 50%;
width: 100%;
padding: 20px;
}
.postboard h2 {
@ -1313,10 +1320,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -1313,10 +1320,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
}
.open, .mini-profile .post-area-new, #postboard-top .post-area .post-area-new {
background: none;
}
.open:hover, .mini-profile .post-area-new:hover, #postboard-top .post-area .post-area-new:hover {
background: none;
background: none !important;
}
.post-photo {
@ -1374,7 +1378,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -1374,7 +1378,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
padding: 0;
}
.post-text samp {
background: #f3f3f3;
background: #eee;
font-size: 0.9rem;
line-height: 0.9rem;
display: inline-block;
@ -1542,7 +1546,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -1542,7 +1546,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
.user-name-tooltip {
display: none;
position: absolute;
background: #60677c;
background: #2a2a2a;
font-size: 12px;
white-space: nowrap;
padding: 3px 5px;
@ -1556,7 +1560,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -1556,7 +1560,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
width: 0;
left: 4px;
bottom: -5px;
border-top: solid 5px #60677c;
border-top: solid 5px #2a2a2a;
border-left: solid 5px transparent;
border-right: solid 5px transparent;
}
@ -1590,7 +1594,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -1590,7 +1594,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
width: 64px;
height: 64px;
overflow: hidden;
background: #e9e9e9;
background: #dddddd;
}
.following .mini-profile-view {
@ -1657,7 +1661,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -1657,7 +1661,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
right: -2em;
transition: height 0.4s linear;
transition: padding-top 0.1s linear;
background: #596073;
background: #222;
z-index: 3;
}
.mini-profile-actions:hover ul {
@ -1667,7 +1671,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -1667,7 +1671,7 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
.mini-profile-actions ul li {
text-align: left;
margin: 0;
background: #596073;
background: #222;
white-space: nowrap;
color: #aaa;
font-size: 12px;
@ -1803,23 +1807,6 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -1803,23 +1807,6 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
display: none !important;
}
.mini-following-info {
width: 45px;
height: 45px;
text-align: center;
background: white;
margin: 1%;
float: left;
}
.mini-following-info .mini-screen-name, .mini-following-info .mini-following-name {
display: none;
}
.mini-following-info .mini-profile-photo {
height: 45px;
width: 45px;
border-radius: 0;
}
.login .header-bold {
display: block;
width: 720px;
@ -2018,14 +2005,13 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -2018,14 +2005,13 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
margin: 0 5px 0 0;
padding: 5px 15px;
color: #aaa;
background: #f3f3f3;
}
.options label.tabs:hover {
color: #596073;
color: #222;
}
.options input:checked + label.tabs {
background: white;
color: #596073;
color: #222;
}
.promoted-posts-only {
@ -2041,42 +2027,48 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f @@ -2041,42 +2027,48 @@ button.small, .modal-wrapper.who-to-follow-modal button, .modal-wrapper.who-to-f
transition: color 0.1s linear;
}
.promoted-posts-only li.active {
color: #596073;
color: #222;
background: white;
cursor: default;
}
.promoted-posts-only li:hover, .promoted-posts-only li.disabled:hover {
color: #596073;
color: #222;
}
.promoted-posts-only li.disabled {
color: #aaa;
background: #f3f3f3;
background: #C3C3C3;
}
/* Wrapper and blocks */
.wrapper {
width: 100%;
width: 50%;
max-width: 100%;
margin: 0;
margin: auto;
padding-top: 50px;
position: relative;
z-index: 1;
min-height: 100%;
}
.dashboard.left, .dashboard.right {
float: left;
.dashboard.left {
position: fixed;
top: 50px;
left: 0;
height: 100vh;
overflow: hidden;
width: 25%;
position: relative;
}
.dashboard.right {
height: 0;
position: fixed;
right: 0;
top: 50px;
overflow: hidden;
width: 25%;
}
/********** CONFIG SUBMENU & SEARCH RESULTS *********** */
.dialog-modal {
display: none;
background: #596073;
background: #222;
position: absolute;
top: 45px;
right: -10px;
@ -2104,7 +2096,7 @@ ul.userMenu-search-profiles li { @@ -2104,7 +2096,7 @@ ul.userMenu-search-profiles li {
display: block;
padding: 5px 10px;
margin: 0;
border-bottom: 1px solid #e9e9e9;
border-bottom: 1px solid #dddddd;
}
ul.userMenu-search-profiles .mini-profile-name {
font-size: 12px;
@ -2141,7 +2133,7 @@ ul.userMenu-search-profiles button .follow, ul.userMenu-search-profiles .mini-pr @@ -2141,7 +2133,7 @@ ul.userMenu-search-profiles button .follow, ul.userMenu-search-profiles .mini-pr
background-color: #B4C669;
}
ul.userMenu-search-profiles button .unfollow, ul.userMenu-search-profiles .mini-profile-actions span .unfollow, .mini-profile-actions ul.userMenu-search-profiles span .unfollow {
background-color: #596073;
background-color: #222;
}
.userMenu-search input[type="text"] {
@ -2175,7 +2167,6 @@ ul.userMenu-search-profiles button .unfollow, ul.userMenu-search-profiles .mini- @@ -2175,7 +2167,6 @@ ul.userMenu-search-profiles button .unfollow, ul.userMenu-search-profiles .mini-
margin-top: 1px;
margin-bottom: 20px;
padding: 0.5em;
background: #f3f3f3;
}
.mini-profile .post-area-new {
-moz-box-shadow: none;
@ -2191,7 +2182,9 @@ ul.userMenu-search-profiles button .unfollow, ul.userMenu-search-profiles .mini- @@ -2191,7 +2182,9 @@ ul.userMenu-search-profiles button .unfollow, ul.userMenu-search-profiles .mini-
.mini-profile-indicators {
margin: 0;
text-align: center;
background-color: #fdfdfd;
border-top: 1px solid #dddddd;
border-bottom: 1px solid #dddddd;
background: white;
}
.mini-profile-indicators li {
-moz-box-sizing: border-box;
@ -2200,7 +2193,12 @@ ul.userMenu-search-profiles button .unfollow, ul.userMenu-search-profiles .mini- @@ -2200,7 +2193,12 @@ ul.userMenu-search-profiles button .unfollow, ul.userMenu-search-profiles .mini-
display: block;
position: relative;
font-size: 0.8em;
border-top: 1px solid #e9e9e9;
width: 33.3%;
float: left;
border-right: 1px solid #dddddd;
}
.mini-profile-indicators li:last-child {
border: none;
}
.mini-profile-indicators li a {
color: #444;
@ -2210,9 +2208,6 @@ ul.userMenu-search-profiles button .unfollow, ul.userMenu-search-profiles .mini- @@ -2210,9 +2208,6 @@ ul.userMenu-search-profiles button .unfollow, ul.userMenu-search-profiles .mini-
.mini-profile-indicators li a:hover {
text-decoration: underline;
}
.mini-profile-indicators li a:before {
display: none !important;
}
.messages-qtd {
position: absolute;
@ -2288,9 +2283,6 @@ ul.userMenu-search-profiles button .unfollow, ul.userMenu-search-profiles .mini- @@ -2288,9 +2283,6 @@ ul.userMenu-search-profiles button .unfollow, ul.userMenu-search-profiles .mini-
display: inline-block;
padding-right: 5px;
}
.profile-data li a:last-child {
display: none;
}
.mini-profile-info a:hover {
text-decoration: none;
@ -2303,7 +2295,6 @@ ul.userMenu-search-profiles button .unfollow, ul.userMenu-search-profiles .mini- @@ -2303,7 +2295,6 @@ ul.userMenu-search-profiles button .unfollow, ul.userMenu-search-profiles .mini-
text-align: center;
padding: 10px;
font-size: 12px;
background: white;
z-index: 10;
-moz-transition: all 0.2s linear;
-o-transition: all 0.2s linear;
@ -2330,7 +2321,7 @@ ul.userMenu-search-profiles button .unfollow, ul.userMenu-search-profiles .mini- @@ -2330,7 +2321,7 @@ ul.userMenu-search-profiles button .unfollow, ul.userMenu-search-profiles .mini-
.mini-follower-link:after {
content: "·";
font-weight: 900;
color: #596073;
color: #222;
margin-left: 1px;
}
@ -2450,7 +2441,7 @@ textarea.splited-post { @@ -2450,7 +2441,7 @@ textarea.splited-post {
.who-to-follow.module li {
width: 100%;
min-height: auto;
border-bottom: 1px solid #e9e9e9;
border-bottom: 1px solid #dddddd;
margin: 0;
padding-bottom: 10px;
margin-top: 10px;
@ -2479,7 +2470,6 @@ textarea.splited-post { @@ -2479,7 +2470,6 @@ textarea.splited-post {
background: white;
width: 100%;
min-height: auto;
border-bottom: 1px solid #f3f3f3;
}
img.twister-user-photo {
@ -2494,7 +2484,7 @@ img.twister-user-photo { @@ -2494,7 +2484,7 @@ img.twister-user-photo {
width: 48px;
height: 48px;
margin: 10px;
background: #e9e9e9;
background: #dddddd;
}
.followers {
@ -2548,7 +2538,7 @@ img.twister-user-photo { @@ -2548,7 +2538,7 @@ img.twister-user-photo {
}
.refresh-toptrends, .twistday-reminder .refresh, .refresh-users {
color: #596073;
color: #222;
cursor: pointer;
font-size: 11px;
font-weight: 500;
@ -2562,7 +2552,7 @@ img.twister-user-photo { @@ -2562,7 +2552,7 @@ img.twister-user-photo {
}
.view-all-users {
color: #596073;
color: #222;
cursor: pointer;
font-size: 11px;
font-weight: 500;
@ -2584,8 +2574,7 @@ img.twister-user-photo { @@ -2584,8 +2574,7 @@ img.twister-user-photo {
/***********TOP TRENDS************** */
.toptrends.module {
margin: 0 0 20px 0;
background: white;
padding: 20px;
padding: 0 20px;
}
.toptrends small {
display: none;
@ -2606,15 +2595,15 @@ ol.toptrends-list a { @@ -2606,15 +2595,15 @@ ol.toptrends-list a {
color: #aaa;
padding: 3px 8px;
display: inline-block;
background: #f3f3f3;
text-transform: uppercase;
font-size: 11px;
margin: 3px;
font-weight: 500;
background: white;
}
ol.toptrends-list a:hover {
background: white;
color: #596073;
background: rgba(255, 255, 255, 0.4);
color: #222;
}
/********* TWISTDAY REMINDER ****** */

6
sass/base/_commons.sass
Unescape View File

@ -1,6 +1,7 @@ @@ -1,6 +1,7 @@
*
outline: none!important
+box-sizing(border-box)
list-style: none
html, body
@ -13,7 +14,7 @@ html, body @@ -13,7 +14,7 @@ html, body
html
font-size: $global-font-size
background-color: $main-background-color
+background-image(linear-gradient(to top right, #aaa, $main-background-color,$main-background-color,$main-background-color, #aaa) )
+background-image(linear-gradient(to top right, #fff, $main-background-color, #fff) )
background-attachment: fixed
body
@ -40,6 +41,9 @@ i, em @@ -40,6 +41,9 @@ i, em
strong, b
font-weight: 600
img
background: $main-color-dark
h1
font-size: 1.1em
text-transform: uppercase

6
sass/base/_utils.sass
Unescape View File

@ -42,12 +42,12 @@ button, a.button @@ -42,12 +42,12 @@ button, a.button
color: #666
+box-shadow(1px 1px 0 rgba(#444, .3))
&.color-1
background: $color-blue
border-color: darken($color-blue, 5%)
background: $main-color-color
border-color: darken($main-color-color, 5%)
color: white
font-weight: 500
&:hover
border-color: darken($color-blue, 15%)
border-color: darken($main-color-color, 15%)
&.color-2
background: #C3C3C3
border-color: darken(#C3C3C3, 5%)

16
sass/base/_var.sass
Unescape View File

@ -4,7 +4,7 @@ @@ -4,7 +4,7 @@
// G R I D
$grid_width : 100% // grid width %
$grid_width : 50% // grid width %
$grid_max_width : 100% // max width
$grid_cols : 12 // cols number
$grid_gut : 2.5% // gut width %
@ -31,22 +31,20 @@ $gut-width : $grid_gut @@ -31,22 +31,20 @@ $gut-width : $grid_gut
$space : 1rem
// colors
$light-grey: #e9e9e9
$dark-blue: #38434E
$color-yellow: #E6953C
$color-pink: #BF6B6C
$light-grey: #C3C3C3
$color-green: #B4C669
$color-red: #EF5D43
$color-blue: #00AA8B
$color-blue: #39434F
$dark-grey : #444
$main-color-light: #aaa
$main-color-dark: #596073
$main-color-dark: #222
$main-color-color: $color-green
$main-background-color: $light-grey
$main-background-color: lighten($light-grey, 10% )
$bloc-light-color : lighten($light-grey, 20% )
$bloc-background-color: white
$background-light: lighten($main-background-color, 4% )
$defaut-font-color: $dark-grey

4
sass/layout/_menu.sass
Unescape View File

@ -1,7 +1,7 @@ @@ -1,7 +1,7 @@
// vars for the menu
$menu-height : 50px
$menu-font-color: $defaut-font-color
$menu-font-color: white
.userMenu
width: 100%
@ -9,7 +9,7 @@ $menu-font-color: $defaut-font-color @@ -9,7 +9,7 @@ $menu-font-color: $defaut-font-color
height: $menu-height
left: 0
margin: 0
background-color: #F5F5F5
background-color: lighten($main-color-dark,20%)
//+background-image(radial-gradient(at top , $color-green,$color-blue) )
z-index: 2

56
sass/layout/_modal.sass
Unescape View File

@ -15,7 +15,7 @@ $header-modal-height : $menu-height @@ -15,7 +15,7 @@ $header-modal-height : $menu-height
position: fixed
+box-sizing(border-box)
@extend .box-shadow
height: 100%
height: 100vh
right: 0
bottom: 0
overflow: hidden
@ -33,7 +33,7 @@ $header-modal-height : $menu-height @@ -33,7 +33,7 @@ $header-modal-height : $menu-height
.modal-content
@extend .clear-fix
background: $background-light
overflow: hidden
overflow-y: auto
.postboard-news
position: absolute
@ -43,6 +43,7 @@ $header-modal-height : $menu-height @@ -43,6 +43,7 @@ $header-modal-height : $menu-height
@extend .color-1
h2 span
display: none
background: $bloc-light-color
@ -50,11 +51,10 @@ $header-modal-height : $menu-height @@ -50,11 +51,10 @@ $header-modal-height : $menu-height
.modal-header
position: relative
background: $color-blue
height: $header-modal-height
background: $main-color-dark
height: $header-modal-height
+box-sizing(border-box)
@extend .clear-fix
border-bottom: 1px solid $background-light
h3
padding-left: 20px
@ -124,8 +124,10 @@ $header-modal-height : $menu-height @@ -124,8 +124,10 @@ $header-modal-height : $menu-height
position: relative
width: 100%
margin: auto
background: $main-background-color
h2
display: block
.post-text
margin: 0 0 0 40px
.post-photo
@ -166,11 +168,7 @@ $header-modal-height : $menu-height @@ -166,11 +168,7 @@ $header-modal-height : $menu-height
display: none
h2
text-transform: none
.following-config-method-buttons
.public-following
background-color: $color-green
margin: 0px 2px
padding: 6px 16px
/************ RETWIST POSTS MODAL **********/
@ -179,9 +177,7 @@ $header-modal-height : $menu-height @@ -179,9 +177,7 @@ $header-modal-height : $menu-height
margin-top: -110px
.modal-content
padding: 20px 15px
.modal-buttons
.modal-propagate
background-color: $color-green
.post-expand, .post-interactions
display: none
@ -363,18 +359,32 @@ $header-modal-height : $menu-height @@ -363,18 +359,32 @@ $header-modal-height : $menu-height
/****** FOLLOWING MODAL*******/
.modal-wrapper.following-modal
h2
display: none
.mini-following-info
border-bottom: 1px solid $main-background-color
line-height: 45px
.modal-content
padding: 0
ol
margin: 5px
.open-profile-modal
&:hover
text-decoration: none
.postboard
h2
display: none
a
display: block
padding: 10px
width: 100%
@extend .clear-fix
color: $defaut-font-color
&:hover
background: $bloc-background-color
.mini-profile-photo
height: 48px
width: 48px
line-height: 0
margin: 0 $space 0 0
float: left
.mini-screen-name
display: none
/******* WHO TO FOLLOW MODAL*******/

10
sass/layout/_postboard.sass
Unescape View File

@ -7,8 +7,7 @@ $avatar-width : 48px @@ -7,8 +7,7 @@ $avatar-width : 48px
.postboard
float: left
width: 50%
width: 100%
padding: 20px
h2
display: none
@ -71,12 +70,9 @@ $avatar-width : 48px @@ -71,12 +70,9 @@ $avatar-width : 48px
.open
background: none
background: none!important
@extend .box-shadow
&:hover
background: none
.post-photo
margin: 0
display: inline-block
@ -127,7 +123,7 @@ $avatar-width : 48px @@ -127,7 +123,7 @@ $avatar-width : 48px
min-height: $avatar-width
padding: 0
samp
background: $background-light
background: #eee
font-size: .9rem
line-height: .9rem
display: inline-block

4
sass/layout/_profile.sass
Unescape View File

@ -59,7 +59,6 @@ $modal-postboard-post-height: 100% @@ -59,7 +59,6 @@ $modal-postboard-post-height: 100%
.profile-card
width: 100%
background: white
border-bottom: 1px solid $background-light
padding: $modal-gut
.profile-card-main
position: relative
@ -146,7 +145,6 @@ $modal-postboard-post-height: 100% @@ -146,7 +145,6 @@ $modal-postboard-post-height: 100%
display: none
margin: 0 15px 0 0
font-weight: 500
background: $background-light
padding: 2px 8px 3px 8px
+border-radius(2px)
@ -191,13 +189,11 @@ $modal-postboard-post-height: 100% @@ -191,13 +189,11 @@ $modal-postboard-post-height: 100%
+box-sizing(border-box)
@extend .clear-fix
width: auto
background: $background-light
.profile-card-main
margin: 0
width: 330px
+box-sizing(border-box)
padding: 10px
background: $background-light
input
display: block
margin: 5px auto

1
sass/layout/_tabs.sass
Unescape View File

@ -61,7 +61,6 @@ @@ -61,7 +61,6 @@
margin: 0 5px 0 0
padding: 5px 15px
color: $main-color-light
background: $background-light
input:checked + label.tabs
background: $bloc-background-color

16
sass/pages/_following.sass
Unescape View File

@ -15,6 +15,7 @@ @@ -15,6 +15,7 @@
@extend .last
.following .mini-profile
margin-bottom: 10px
@ -225,18 +226,3 @@ @@ -225,18 +226,3 @@
.swarm-status
display: none!important
.mini-following-info
width: 45px
height: 45px
text-align: center
background: $bloc-background-color
margin: 1%
float: left
&:after
@extend .clear-fix
.mini-screen-name, .mini-following-name
display: none
.mini-profile-photo
height: 45px
width: 45px
border-radius: 0

52
sass/style.sass
Unescape View File

@ -47,7 +47,7 @@ @@ -47,7 +47,7 @@
color: $main-color-dark
&.disabled
color: $main-color-light
background: $background-light
background: $light-grey
@ -56,22 +56,28 @@ @@ -56,22 +56,28 @@
/* Wrapper and blocks */
.wrapper
width: $site-width
width: 50%
max-width: 100%
margin: 0
margin: auto
padding-top: $menu-height
position: relative
z-index: 1
min-height: 100%
.dashboard
&.left, &.right
float: left
&.left
position: fixed
top: $menu-height
left: 0
height: 100vh
overflow: hidden
width: 25%
position: relative
&.right
@extend .last
height: 0
position: fixed
right: 0
top: $menu-height
overflow: hidden
width: 25%
@ -182,7 +188,6 @@ ul.userMenu-search-profiles @@ -182,7 +188,6 @@ ul.userMenu-search-profiles
margin-top: 1px
margin-bottom: 20px
padding: .5em
background: $background-light
@extend .clear-fix
.post-area-new
@extend .open
@ -196,14 +201,20 @@ ul.userMenu-search-profiles @@ -196,14 +201,20 @@ ul.userMenu-search-profiles
margin: 0
text-align: center
@extend .clear-fix
background-color: lighten($background-light,4%)
border-top: 1px solid $main-background-color
border-bottom: 1px solid $main-background-color
background: white
li
+box-sizing(border-box)
display: block
position: relative
font-size: .8em
border-top: 1px solid $main-background-color
width: 33.3%
float: left
border-right: 1px solid $main-background-color
&:last-child
border: none
a
color: $dark-grey
@ -212,8 +223,6 @@ ul.userMenu-search-profiles @@ -212,8 +223,6 @@ ul.userMenu-search-profiles
&:hover
text-decoration: underline
&:before
display: none!important
.userMenu-connections a
@extend .icon-bell
@ -290,8 +299,7 @@ ul.userMenu-search-profiles @@ -290,8 +299,7 @@ ul.userMenu-search-profiles
&.posts-count, &.following-count, &.followers-count
display: inline-block
padding-right: 5px
&:last-child
display: none
.mini-profile-info a:hover
text-decoration: none
@ -303,7 +311,6 @@ ul.userMenu-search-profiles @@ -303,7 +311,6 @@ ul.userMenu-search-profiles
text-align: center
padding: 10px
font-size: 12px
background: lighten($background-light, 5%)
z-index: 10
+transition(all .2s linear)
@ -468,7 +475,6 @@ textarea.splited-post @@ -468,7 +475,6 @@ textarea.splited-post
@extend .col-3
width: 100%
min-height: auto
border-bottom: 1px solid $background-light
&:nth-child(4n)
@extend .last
@ -571,9 +577,7 @@ img.twister-user-photo @@ -571,9 +577,7 @@ img.twister-user-photo
.toptrends
&.module
margin: 0 0 20px 0
background: white
padding: 20px
@extend .box-shadow
padding: 0 20px
small
display: none
h3
@ -591,14 +595,14 @@ ol.toptrends-list @@ -591,14 +595,14 @@ ol.toptrends-list
color: $main-color-light
padding: 3px 8px
display: inline-block
background: $background-light
text-transform: uppercase
font-size: 11px
margin: 3px
font-weight: 500
background: white
@extend .box-shadow
&:hover
background: white
background: rgba(white,.4)
color: $main-color-dark
/********* TWISTDAY REMINDER *******/

Write Preview
Loading…
Cancel
Save