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

more stuff

nin-v2
myleneb 9 years ago
parent
54c5c7197c
commit
8d70e256bd
14 changed files with 300 additions and 156 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. 237
      css/style.css
  2. 13
      js/theme_option.js
  3. 5
      sass/base/_commons.sass
  4. 15
      sass/base/_fonts.sass
  5. 6
      sass/base/_var.sass
  6. 9
      sass/layout/_dm.sass
  7. 15
      sass/layout/_menu.sass
  8. 6
      sass/layout/_modal.sass
  9. 21
      sass/layout/_postboard.sass
  10. 33
      sass/layout/_profile.sass
  11. 51
      sass/layout/_responsive.sass
  12. 6
      sass/layout/_wrapper.sass
  13. 11
      sass/pages/_network.sass
  14. 28
      sass/style.sass

237
css/style.css
Unescape View File

@ -107,7 +107,7 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, @@ -107,7 +107,7 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu,
font-weight: normal;
font-style: normal;
}
.ion:before, .userMenu > ul li > a:before, .modal-header span:before, .prompt-wrapper .modal-header span:before, .post-context span:before, .post-interactions span:before, .post-stats li.stat-count:before, ul.userMenu-search-profiles button:before, ul.userMenu-search-profiles .show-more-followers:before, .mini-profile-indicators .userMenu-connections a:before, .mini-profile-indicators .userMenu-messages a:before, .mini-profile-indicators .userMenu-user a:before, .twister-user-remove:before, .refresh-toptrends:before, .twistday-reminder .refresh:before, .refresh-users:before, .ion-after:after, .isFollowing:after {
.ion:before, .userMenu li.userMenu-config > a:before, .modal-header span:before, .prompt-wrapper .modal-header span:before, .bitmessage-ctc:before, .tox-ctc:before, .profile-modal .profile-tox:before, .profile-modal .profile-bitmessage:before, .post-context span:before, .post-interactions span:before, .post-stats li.stat-count:before, ul.userMenu-search-profiles button:before, ul.userMenu-search-profiles .show-more-followers:before, .mini-profile-indicators .userMenu-connections a:before, .mini-profile-indicators .userMenu-messages a:before, .mini-profile-indicators .userMenu-user a:before, .twister-user-remove:before, .refresh-toptrends:before, .twistday-reminder .refresh:before, .refresh-users:before, .view-all-users:before, .ion-after:after, .isFollowing:after {
display: inline-block;
font-family: "Ionicons";
speak: none;
@ -121,11 +121,15 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, @@ -121,11 +121,15 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu,
-moz-osx-font-smoothing: grayscale;
}
.ion:after, .userMenu > ul li > a:after, .modal-header span:after, .prompt-wrapper .modal-header span:after, .post-context span:after, .post-interactions span:after, .post-stats li.stat-count:after, ul.userMenu-search-profiles button:after, ul.userMenu-search-profiles .show-more-followers:after, .mini-profile-indicators .userMenu-connections a:after, .mini-profile-indicators .userMenu-messages a:after, .mini-profile-indicators .userMenu-user a:after, .twister-user-remove:after, .refresh-toptrends:after, .twistday-reminder .refresh:after, .refresh-users:after, .ion-after:before, .isFollowing:before {
.ion:before, .userMenu li.userMenu-config > a:before, .modal-header span:before, .prompt-wrapper .modal-header span:before, .bitmessage-ctc:before, .tox-ctc:before, .profile-modal .profile-tox:before, .profile-modal .profile-bitmessage:before, .post-context span:before, .post-interactions span:before, .post-stats li.stat-count:before, ul.userMenu-search-profiles button:before, ul.userMenu-search-profiles .show-more-followers:before, .mini-profile-indicators .userMenu-connections a:before, .mini-profile-indicators .userMenu-messages a:before, .mini-profile-indicators .userMenu-user a:before, .twister-user-remove:before, .refresh-toptrends:before, .twistday-reminder .refresh:before, .refresh-users:before, .view-all-users:before {
padding: 0 3px;
}
.ion:after, .userMenu li.userMenu-config > a:after, .modal-header span:after, .prompt-wrapper .modal-header span:after, .bitmessage-ctc:after, .tox-ctc:after, .profile-modal .profile-tox:after, .profile-modal .profile-bitmessage:after, .post-context span:after, .post-interactions span:after, .post-stats li.stat-count:after, ul.userMenu-search-profiles button:after, ul.userMenu-search-profiles .show-more-followers:after, .mini-profile-indicators .userMenu-connections a:after, .mini-profile-indicators .userMenu-messages a:after, .mini-profile-indicators .userMenu-user a:after, .twister-user-remove:after, .refresh-toptrends:after, .twistday-reminder .refresh:after, .refresh-users:after, .view-all-users:after, .ion-after:before, .isFollowing:before {
display: none;
}
.ion-alert:before, .post-interactions span.post-favorite:before, .refresh-toptrends:before, .twistday-reminder .refresh:before, .refresh-users:before {
.ion-alert:before, .post-interactions span.post-favorite:before {
content: "";
}
@ -137,7 +141,7 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, @@ -137,7 +141,7 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu,
content: "";
}
.ion-shuffle:before, .post-context span:before, .post-interactions span.post-propagate:before, .post-stats li.stat-count:before {
.ion-shuffle:before, .post-context span:before, .post-interactions span.post-propagate:before, .post-stats li.stat-count:before, .refresh-toptrends:before, .twistday-reminder .refresh:before, .refresh-users:before {
content: "";
}
@ -149,7 +153,7 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, @@ -149,7 +153,7 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu,
content: "";
}
.ion-profile:before, .userMenu li.userMenu-profile a:before, .mini-profile-indicators .userMenu-user a:before {
.ion-profile:before, .mini-profile-indicators .userMenu-user a:before {
content: "";
}
@ -177,14 +181,30 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, @@ -177,14 +181,30 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu,
content: "";
}
.ion-home:before, .userMenu li.userMenu-home a:before {
.ion-home:before {
content: "";
}
.ion-network:before, .userMenu li.userMenu-network a:before {
.ion-network:before {
content: "";
}
.ion-eye:before, .view-all-users:before {
content: "";
}
.ion-tox:before, .profile-modal .profile-tox:before, .profile-modal .profile-bitmessage:before {
content: "";
}
.ion-copy:before, .bitmessage-ctc:before, .tox-ctc:before {
content: "";
}
.ion-search:after {
content: "";
}
/* FONTS */
* {
outline: none !important;
@ -204,6 +224,8 @@ html, body { @@ -204,6 +224,8 @@ html, body {
html {
font-size: 15px;
background-color: #ddd;
background-image: url('../img/bg.png?1438449671');
background-attachment: fixed;
}
body {
@ -212,8 +234,6 @@ body { @@ -212,8 +234,6 @@ body {
font-family: "Roboto", sans-serif;
font-weight: 400;
overflow-y: scroll !important;
background-image: url('../img/bg.png?1438449671');
background-attachment: fixed;
}
a {
@ -311,7 +331,7 @@ h3 .isFollowing:after { @@ -311,7 +331,7 @@ h3 .isFollowing:after {
box-shadow: 0 8px 13px rgba(17, 17, 17, 0);
}
.clear-fix:after, .userMenu > ul:after, .wrapper:after, .dashboard > .module:after, .dashboard > .module ol:after, .modal-wrapper.following-modal a:after, .modal-wrapper .modal-content:after, .modal-header:after, .prompt-wrapper .modal-header:after, .twister-user:after, .direct-messages-thread .post:after, .forEdition.profile-card:after, #postboard-top:after, #postboard-top .post-area:after, .expanded-content:after, .following .following-list li a:after, .network.singleBlock:after, .options .tab-content:after, ul.userMenu-search-profiles li:after, .mini-profile .post-area:after, .mini-profile-indicators:after, .profile-data:after {
.clear-fix:after, .userMenu > ul:after, .wrapper:after, .dashboard > .module:after, .dashboard > .module ol:after, .modal-wrapper.following-modal a:after, .modal-wrapper .modal-content:after, .modal-header:after, .prompt-wrapper .modal-header:after, .twister-user:after, .direct-messages-thread .post:after, .forEdition.profile-card:after, #postboard-top:after, #postboard-top .post-area:after, .expanded-content:after, .following .following-list li a:after, .network.singleBlock:after, .network.singleBlock .module:after, .options .tab-content:after, ul.userMenu-search-profiles li:after, .mini-profile .post-area:after, .mini-profile-indicators:after, .profile-data:after {
content: "";
display: table;
clear: both;
@ -398,7 +418,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover { @@ -398,7 +418,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
left: 0;
margin: 0;
background-color: #3E3C42;
z-index: 2;
z-index: 40;
}
.userMenu > ul {
-moz-box-sizing: border-box;
@ -407,13 +427,13 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover { @@ -407,13 +427,13 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
max-width: 100%;
width: 1200px;
margin: auto;
background: url('../img/logo.png?1437893891') no-repeat 50% 50%;
background: url('../img/logo.png?1438462463') no-repeat 50% 50%;
background-size: 20px;
}
.userMenu > ul li {
position: relative;
display: inline-block;
margin-right: 20px;
margin: 0 10px;
}
.userMenu > ul li > a {
line-height: 52px;
@ -429,8 +449,6 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover { @@ -429,8 +449,6 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
}
.userMenu > ul li > a:before {
padding-right: 5px;
font-size: 1.5rem;
line-height: 1rem;
}
.userMenu > ul li > a span {
display: inline-block;
@ -474,7 +492,6 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover { @@ -474,7 +492,6 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
.userMenu li.userMenu-config, .userMenu li.userMenu-search {
float: right;
position: relative;
margin-right: 0;
color: white;
}
.userMenu li.userMenu-config + a, .userMenu li.userMenu-search + a {
@ -483,6 +500,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover { @@ -483,6 +500,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
.userMenu li.userMenu-search > input {
border: 1px solid rgba(255, 255, 255, 0.3);
line-height: 26px;
margin-top: 13px;
font-size: 12px;
padding: 0 7px;
background: rgba(255, 255, 255, 0.1);
@ -503,7 +521,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover { @@ -503,7 +521,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
width: 1200px;
max-width: 100%;
margin: auto;
padding-top: 62px;
padding-top: 70px;
position: relative;
z-index: 1;
}
@ -511,20 +529,20 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover { @@ -511,20 +529,20 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
.dashboard.left {
top: 52px;
float: left;
width: 170px;
width: 168px;
min-height: 700px;
}
.dashboard.left > .module {
width: 150px;
position: fixed;
top: 62px;
top: 70px;
}
.dashboard.right {
float: left;
top: 52px;
overflow: hidden;
width: 330px;
padding-left: 20px;
width: 362px;
padding-left: 18px;
padding-right: 3px;
}
.dashboard > .module {
@ -704,6 +722,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover { @@ -704,6 +722,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
line-height: 52px;
font-weight: 500;
font-size: 1rem;
float: left;
color: white;
}
.modal-header span, .prompt-wrapper .modal-header span {
@ -725,7 +744,10 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover { @@ -725,7 +744,10 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
right: 10px;
}
.modal-header span.mark-all-as-read {
right: 70px;
position: static;
float: left;
margin-left: 10px;
display: none;
}
.modal-header span.modal-back {
right: 35px;
@ -929,6 +951,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover { @@ -929,6 +951,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
left: 0;
margin: 0px 10px 20px 10px;
cursor: default;
position: relative;
}
.direct-messages-thread .post .post-info-time {
float: none;
@ -959,8 +982,8 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover { @@ -959,8 +982,8 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
}
.direct-messages-thread .post .post-text {
background: white;
margin-right: 60px;
margin-left: 60px;
margin-right: 58px;
margin-left: 58px;
position: relative;
display: inline-block;
max-width: 300px;
@ -975,7 +998,9 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover { @@ -975,7 +998,9 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
.direct-messages-thread .post .post-photo {
position: absolute;
left: 0;
top: 35px;
top: 30px;
float: none;
margin: 0;
}
.direct-messages-thread .post.sent .post-text:after {
border-top: solid 7px transparent;
@ -1120,28 +1145,12 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover { @@ -1120,28 +1145,12 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
}
.bitmessage-ctc, .tox-ctc {
font-size: 13px;
line-height: 15px;
cursor: pointer;
color: #222;
}
.bitmessage-ctc:hover, .tox-ctc:hover {
color: #A1B775;
}
.bitmessage-ctc:after, .tox-ctc:after {
font-family: "Ionicons";
content: "";
font-style: normal;
font-weight: normal;
speak: none;
background: #999;
color: white;
font-size: 1rem;
display: inline-block;
text-decoration: inherit;
width: 1em;
text-align: center;
font-variant: normal;
text-transform: none;
line-height: 1em;
padding: 10px;
line-height: 1rem;
}
.profile-modal .profile-tox, .profile-modal .profile-bitmessage {
@ -1151,6 +1160,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover { @@ -1151,6 +1160,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
}
.profile-modal .profile-tox:hover, .profile-modal .profile-bitmessage:hover {
color: #A1B775;
text-decoration: none;
}
.profile-modal .modal-buttons {
@ -1160,7 +1170,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover { @@ -1160,7 +1170,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
.forEdition.profile-card {
margin: 0;
width: 700px;
width: 670px;
background: none;
padding: 0;
}
@ -1222,7 +1232,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover { @@ -1222,7 +1232,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
position: relative;
margin-bottom: 10px;
transition: height 0.3s linear;
padding: 10px;
padding: 15px;
background: white;
overflow: hidden;
background: #FDFCFA;
@ -1238,9 +1248,6 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover { @@ -1238,9 +1248,6 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
-o-transition-timing-function: ease-out;
-webkit-transition-timing-function: ease-out;
transition-timing-function: ease-out;
-moz-border-radius: 11px;
-webkit-border-radius: 11px;
border-radius: 11px;
top: 0;
z-index: 120;
}
@ -1251,7 +1258,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover { @@ -1251,7 +1258,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
}
#postboard-top.fixed {
position: fixed;
width: 330px;
width: 362px;
top: 52px;
}
#postboard-top .profile-photo {
@ -1286,7 +1293,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover { @@ -1286,7 +1293,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
/************* POSTBOARD ************ */
.postboard {
width: 700px;
width: 670px;
float: left;
}
.postboard h2, .postboard .postboard-news {
@ -1342,7 +1349,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover { @@ -1342,7 +1349,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
color: #4b484f;
}
.postboard-posts .post .post-data {
padding: 12px 15px;
padding: 15px;
background: #FDFCFA;
}
.postboard-posts > .post {
@ -1376,6 +1383,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover { @@ -1376,6 +1383,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
vertical-align: middle;
overflow: hidden;
width: 48px;
margin: 0 15px 15px 0;
}
.post-photo img {
width: 100%;
@ -1383,12 +1391,12 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover { @@ -1383,12 +1391,12 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
}
.post-info-name {
font-weight: 600;
font-weight: 500;
color: inherit;
text-decoration: none;
display: inline-block;
font-size: 1rem;
float: left;
margin-left: 10px;
}
.post-info-name:hover {
text-decoration: none;
@ -1402,6 +1410,14 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover { @@ -1402,6 +1410,14 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
display: inline-block;
}
.post-info-sent {
display: block;
position: absolute;
top: 0;
left: 3px;
font-size: 15px;
}
.post-info-time {
position: absolute;
font-size: 0.8rem;
@ -1464,10 +1480,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover { @@ -1464,10 +1480,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
.post-interactions span:before {
padding: 3px;
}
.post-interactions span.post-favorite {
display: none !important;
}
.post:hover .post-interactions .post-reply, .post:hover .post-interactions .post-propagate {
.post:hover .post-interactions .post-reply, .post:hover .post-interactions .post-propagate, .post:hover .post-interactions .post-favorite {
display: inline-block;
}
@ -1579,7 +1592,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover { @@ -1579,7 +1592,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
}
.following {
width: 700px;
width: 670px;
float: left;
}
.following h2 {
@ -1707,7 +1720,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover { @@ -1707,7 +1720,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
/********** LOGIN AND NETWORK PAGES ****** */
.network.singleBlock ul {
line-height: 2rem;
padding: 2rem;
padding: 1rem 2rem;
}
.network.singleBlock .module {
background: #F3F2F0;
@ -1715,6 +1728,12 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover { @@ -1715,6 +1728,12 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
-webkit-box-shadow: 0 1px 1px rgba(85, 85, 85, 0.1);
box-shadow: 0 1px 1px rgba(85, 85, 85, 0.1);
margin-bottom: 50px;
width: 49%;
float: left;
margin-right: 1%;
}
.network.singleBlock .module:last-child {
margin-right: 0;
}
.network.singleBlock .module:last-child h2 {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuMCIgeTE9IjAuNSIgeDI9IjEuMCIgeTI9IjAuNSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ExYjc3NSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzVlODBhMiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
@ -1978,15 +1997,6 @@ ul.userMenu-search-profiles button, ul.userMenu-search-profiles .show-more-follo @@ -1978,15 +1997,6 @@ ul.userMenu-search-profiles button, ul.userMenu-search-profiles .show-more-follo
right: 5px;
}
.userMenu-search input[type="text"] {
float: right;
padding: 3px 10px;
margin: 10px 20px 0 0;
border: none;
background: #F3F2F0;
box-sizing: border-box;
}
.userMenu-search-sugestions a {
color: rgba(0, 0, 0, 0.7);
padding: 10x 20px;
@ -2264,7 +2274,7 @@ img.twister-user-photo { @@ -2264,7 +2274,7 @@ img.twister-user-photo {
float: left;
display: block;
float: left;
width: 32px;
width: 36px;
height: auto;
margin: 0 10px 0 0;
}
@ -2322,28 +2332,28 @@ img.twister-user-photo { @@ -2322,28 +2332,28 @@ img.twister-user-photo {
}
.refresh-toptrends, .twistday-reminder .refresh, .refresh-users {
color: #222;
color: #6f6f6f;
cursor: pointer;
font-size: 11px;
font-size: 0.7rem;
font-weight: 500;
text-transform: none;
letter-spacing: 0;
float: right;
display: block;
margin: 5px;
margin: 10px;
position: relative;
}
.view-all-users {
color: #222;
color: #6f6f6f;
cursor: pointer;
font-size: 11px;
font-size: 0.7rem;
font-weight: 500;
text-transform: none;
letter-spacing: 0;
float: right;
display: block;
margin: 5px;
margin: 10px;
position: relative;
}
@ -2568,7 +2578,7 @@ ul.dropdown-menu li > li > a { @@ -2568,7 +2578,7 @@ ul.dropdown-menu li > li > a {
.postboard, #postboard-top.onTop {
position: absolute;
left: 135px;
left: 168px;
right: 20px;
width: auto;
}
@ -2577,9 +2587,76 @@ ul.dropdown-menu li > li > a { @@ -2577,9 +2587,76 @@ ul.dropdown-menu li > li > a {
width: 85%;
}
.modal-wrapper .postboard {
width: 700px;
width: 670px;
float: left;
position: relative;
left: 0;
}
}
@media (max-width: 700px) {
.network.singleBlock .module {
margin-bottom: 50px;
width: 98%;
margin: 0 auto 50px auto;
float: none;
margin-right: auto;
}
.dashboard.left {
top: 52px;
float: none;
width: 100%;
}
.dashboard.left > .module {
width: 100%;
position: fixed;
top: 52px;
z-index: 2;
}
.promoted-posts-only {
display: none;
}
.postboard {
float: none;
width: 100%;
margin: 0;
top: 122px;
left: 0;
z-index: 1;
}
.modal-wrapper .postboard {
top: auto;
}
.mini-profile-info {
display: none;
}
.mini-profile-indicators li {
width: 25%;
float: left;
position: relative;
z-index: 2;
}
#postboard-top {
position: fixed;
bottom: 0;
width: 100%;
top: auto;
margin: 0;
-moz-box-shadow: 0px -5px 13px rgba(17, 17, 17, 0.2);
-webkit-box-shadow: 0px -5px 13px rgba(17, 17, 17, 0.2);
box-shadow: 0px -5px 13px rgba(17, 17, 17, 0.2);
}
.userMenu .userMenu-profile {
display: none;
}
.userMenu ul {
background-image: none;
}
}

13
js/theme_option.js
Unescape View File

@ -6,7 +6,10 @@ $(window).resize(function() @@ -6,7 +6,10 @@ $(window).resize(function()
$(document).ready(function()
{
var windowHeight = $(window).height();
prout();
// make right modules expendables
//slideUpModules();
reOrganizeTemplates()
$('#postboard-top textarea').on('blur',function(){$('#postboard-top').removeClass('on');});
@ -56,9 +59,7 @@ $(document).ready(function() @@ -56,9 +59,7 @@ $(document).ready(function()
});
function prout() {
var modulWrap =
function slideUpModules() {
$(document).on( 'click', 'h3', function() {
var thisList = $(this).parents('.module').find('ol');
@ -89,9 +90,9 @@ function reOrganizeTemplates() { // for nin's templating @@ -89,9 +90,9 @@ function reOrganizeTemplates() { // for nin's templating
$('.post-context').each(function(){ $(this).prependTo($(this).parent()); }); // puts context on top of post
// menu
$('.userMenu li > a').wrapInner('<span class="inner"></span>');
//$('.userMenu li > a').wrapInner('<span class="inner"></span>');
///// page following
///// page profile
$('.forEdition h2').detach().prependTo($('.forEdition'));
//loader

5
sass/base/_commons.sass
Unescape View File

@ -14,14 +14,15 @@ html, body @@ -14,14 +14,15 @@ html, body
html
font-size: $global-font-size
background-color: #ddd
background-image: image-url("bg.png")
background-attachment: fixed
body
font-size: $main-font-size
line-height : $main-line-height
font-family : $main-font-family
font-weight: 400
overflow-y: scroll!important
background-image: image-url("bg.png")
background-attachment: fixed

15
sass/base/_fonts.sass
Unescape View File

@ -58,6 +58,7 @@ @@ -58,6 +58,7 @@
font-style: normal
.ion:before, .ion-after:after
display: inline-block
font-family: "Ionicons"
@ -70,6 +71,8 @@ @@ -70,6 +71,8 @@
line-height: inherit
-webkit-font-smoothing: antialiased
-moz-osx-font-smoothing: grayscale
.ion:before
padding: 0 3px
.ion:after, .ion-after:before
display: none
@ -118,3 +121,15 @@ @@ -118,3 +121,15 @@
.ion-network:before
content: "\f2b5"
.ion-eye:before
content: "\f133"
.ion-tox:before
content: "\f200"
.ion-copy:before
content: "\f381"
.ion-search:after
content: "\f21f"

6
sass/base/_var.sass
Unescape View File

@ -1,13 +1,13 @@ @@ -1,13 +1,13 @@
//these are the main variables used in the sass file
$site-width : 1200px
$gut : 20
$postboardWidth : 700px
$gut : 18px
$postboardWidth : 670px
$miniProfileWidth : $site-width/8
$leftWidth : $miniProfileWidth + $gut
$rightWidth : $site-width - ($leftWidth + $postboardWidth)
$micro-usr-img : 32px
$micro-usr-img : 36px
$mini-usr-img : 48px
$usr-img : 64px

9
sass/layout/_dm.sass
Unescape View File

@ -85,6 +85,7 @@ @@ -85,6 +85,7 @@
left: 0
margin: 0px 10px 20px 10px
cursor: default
position: relative
.post-info-time
float: none
display: block
@ -116,8 +117,8 @@ @@ -116,8 +117,8 @@
.post-text
background: white
margin-right: 60px
margin-left: 60px
margin-right: $mini-usr-img + 10
margin-left: $mini-usr-img + 10
position: relative
display: inline-block
max-width: 300px
@ -132,7 +133,9 @@ @@ -132,7 +133,9 @@
.post-photo
position: absolute
left: 0
top: 35px
top: 30px
float: none
margin: 0

15
sass/layout/_menu.sass
Unescape View File

@ -12,7 +12,7 @@ $menuBgColor : $dark-grey @@ -12,7 +12,7 @@ $menuBgColor : $dark-grey
//background-color: #FFAF1C
//+background-image(linear-gradient(to right , $color-green, #5E80A2) )
background-color: $menuBgColor
z-index: 2
z-index: 40
> ul
@extend .clear-fix
+box-sizing(border-box)
@ -24,7 +24,7 @@ $menuBgColor : $dark-grey @@ -24,7 +24,7 @@ $menuBgColor : $dark-grey
li
position: relative
display: inline-block
margin-right: 20px
margin: 0 10px
> a
line-height: $menu-height
display: inline-block
@ -32,15 +32,12 @@ $menuBgColor : $dark-grey @@ -32,15 +32,12 @@ $menuBgColor : $dark-grey
font-size: 1rem
position: relative
font-size: 1rem
@extend .ion
&:hover
color: $menu-font-color!important
text-decoration: none
&:before
padding-right: 5px
font-size: 1.5rem
line-height: 1rem
span
display: inline-block
@ -55,7 +52,6 @@ $menuBgColor : $dark-grey @@ -55,7 +52,6 @@ $menuBgColor : $dark-grey
&.userMenu-home
a
@extend .ion-home
.label
display: inline-block!important
@ -78,11 +74,7 @@ $menuBgColor : $dark-grey @@ -78,11 +74,7 @@ $menuBgColor : $dark-grey
color: white
&.show
display: block
&.userMenu-network a
@extend .ion-network
&.userMenu-profile a
@extend .ion-profile
&.userMenu-dhtindicator, &.userMenu-connections, &.userMenu-messages
display: none!important
@ -90,7 +82,6 @@ $menuBgColor : $dark-grey @@ -90,7 +82,6 @@ $menuBgColor : $dark-grey
&.userMenu-config, &.userMenu-search
float: right
position: relative
margin-right: 0
color: $menu-font-color
+ a
color: $main-color-dark
@ -98,6 +89,7 @@ $menuBgColor : $dark-grey @@ -98,6 +89,7 @@ $menuBgColor : $dark-grey
> input
border: 1px solid rgba(white,.3)
line-height: $menu-height/2
margin-top: $menu-height/4
font-size: 12px
padding: 0 7px
background: rgba(white,.1)
@ -106,6 +98,7 @@ $menuBgColor : $dark-grey @@ -106,6 +98,7 @@ $menuBgColor : $dark-grey
&:focus
border-color: rgba(white,.7)
&.userMenu-config > a
@extend .ion
@extend .ion-gear
font-size: 1.5rem

6
sass/layout/_modal.sass
Unescape View File

@ -152,6 +152,7 @@ $header-modal-height : $menu-height @@ -152,6 +152,7 @@ $header-modal-height : $menu-height
line-height: $header-modal-height
font-weight: 500
font-size: 1rem
float: left
color: white
span
@ -174,7 +175,10 @@ $header-modal-height : $menu-height @@ -174,7 +175,10 @@ $header-modal-height : $menu-height
right: 10px
&.mark-all-as-read
@extend .ion-checkmark
right: 70px
position: static
float: left
margin-left: 10px
display: none
&.modal-back
@extend .ion-back
right: 35px

21
sass/layout/_postboard.sass
Unescape View File

@ -4,7 +4,7 @@ @@ -4,7 +4,7 @@
@extend .clear-fix
margin-bottom: 10px
transition: height .3s linear
padding: 10px
padding: 15px
background: white
overflow: hidden
background: $bloc-light-color
@ -12,7 +12,6 @@ @@ -12,7 +12,6 @@
+transition-property( top)
+transition-duration(.1s)
+transition-timing-function(ease-out)
+border-radius(11px)
top: 0
&.on
+box-shadow(1px 2px 2px rgba(#111, 0.1))
@ -94,7 +93,7 @@ @@ -94,7 +93,7 @@
&:hover
color: lighten($dark-grey,5%)
.post-data
padding: 12px 15px
padding: 15px
background: $bloc-light-color
@ -125,17 +124,18 @@ @@ -125,17 +124,18 @@
vertical-align: middle
overflow: hidden
width: $mini-usr-img
margin: 0 15px 15px 0
img
width: 100%
height: auto!important
.post-info-name
font-weight: 600
font-weight: 500
color: inherit
text-decoration: none
display: inline-block
font-size: 1rem
float: left
margin-left: 10px
&:hover
text-decoration: none
color: black
@ -146,6 +146,14 @@ @@ -146,6 +146,14 @@
margin-top: 4px
display: inline-block
.post-info-sent
display: block
position: absolute
top: 0
left: 3px
font-size: 15px
.post-info-time
position: absolute
font-size: .8rem
@ -214,11 +222,10 @@ @@ -214,11 +222,10 @@
&.post-propagate
@extend .ion-shuffle
&.post-favorite
display: none!important //maybe one day
@extend .ion-alert
.post:hover &
.post-reply, .post-propagate //, .post-favorite maybe one day
.post-reply, .post-propagate , .post-favorite
display: inline-block

33
sass/layout/_profile.sass
Unescape View File

@ -133,27 +133,18 @@ $modal-postboard-post-height: 100% @@ -133,27 +133,18 @@ $modal-postboard-post-height: 100%
+border-radius(2px)
.bitmessage-ctc, .tox-ctc
font-size: 13px
line-height: 15px
cursor: pointer
color: $main-color-dark
&:hover
color: $main-color-color
.bitmessage-ctc:after, .tox-ctc:after
font-family: $symbol-font-family
content: ''
font-style: normal
font-weight: normal
speak: none
background: #999
color: white
font-size: 1rem
display: inline-block
text-decoration: inherit
width: 1em
text-align: center
font-variant: normal
text-transform: none
line-height: 1em
padding: 10px
line-height: 1rem
@extend .ion-copy
@extend .ion
.profile-modal
.profile-tox, .profile-bitmessage
@ -162,7 +153,9 @@ $modal-postboard-post-height: 100% @@ -162,7 +153,9 @@ $modal-postboard-post-height: 100%
font-size: 13px
&:hover
color: $main-color-color
text-decoration: none
@extend .ion-tox
@extend .ion
.profile-modal .modal-buttons
display: none

51
sass/layout/_responsive.sass
Unescape View File

@ -7,7 +7,7 @@ @@ -7,7 +7,7 @@
padding: 0
.postboard, #postboard-top.onTop
position: absolute
left: 135px
left: $leftWidth
right: 20px
width: auto
@ -19,5 +19,52 @@ @@ -19,5 +19,52 @@
position: relative
left: 0
@media (max-width: 600px)
@media (max-width: 700px)
.network
&.singleBlock
.module
margin-bottom: 50px
width: 98%
margin: 0 auto 50px auto
float: none
margin-right: auto
.dashboard
&.left
top: $menu-height
float: none
width: 100%
> .module
width: 100%
position: fixed
top: $menu-height
z-index: 2
.promoted-posts-only
display: none
.postboard
float: none
width: 100%
margin: 0
top: $menu-height +70
left: 0
z-index: 1
.modal-wrapper &
top: auto
.mini-profile-info
display: none
.mini-profile-indicators li
width: 25%
float: left
position: relative
z-index: 2
#postboard-top
position: fixed
bottom: 0
width: 100%
top: auto
margin: 0
+box-shadow(0px -5px 13px rgba(17, 17, 17, 0.2))
.userMenu .userMenu-profile
display: none
.userMenu ul
background-image: none

6
sass/layout/_wrapper.sass
Unescape View File

@ -6,7 +6,7 @@ @@ -6,7 +6,7 @@
width: $site-width
max-width: 100%
margin: auto
padding-top: $menu-height + $gut/2
padding-top: $menu-height + $gut
position: relative
z-index: 1
@extend .clear-fix
@ -19,14 +19,14 @@ @@ -19,14 +19,14 @@
> .module
width: $miniProfileWidth
position: fixed
top: $menu-height + $gut/2
top: $menu-height + $gut
&.right
float: left
top: $menu-height
overflow: hidden
width: $rightWidth
padding-left: 20px
padding-left: $gut
padding-right: 3px
> .module
width: 100%

11
sass/pages/_network.sass
Unescape View File

@ -3,9 +3,10 @@ @@ -3,9 +3,10 @@
&.singleBlock
@extend .clear-fix
ul
line-height: 2rem
padding: 2rem
padding: 1rem 2rem
.module
@ -13,11 +14,19 @@ @@ -13,11 +14,19 @@
background: $bloc-background-color
+box-shadow(0 1px 1px rgba(#555, .1))
margin-bottom: 50px
width: 49%
float: left
margin-right: 1%
@extend .clear-fix
&:last-child
margin-right: 0
&:last-child
h2
+background-image(linear-gradient(to right , $color-green, #5E80A2) )
.spam-msg
resize: none
width: 100%

28
sass/style.sass
Unescape View File

@ -79,8 +79,7 @@ @@ -79,8 +79,7 @@
display: block
padding: 10px
ul.userMenu-search-profiles
width: 100%
@ -146,13 +145,7 @@ ul.userMenu-search-profiles @@ -146,13 +145,7 @@ ul.userMenu-search-profiles
.userMenu-search input[type="text"]
float: right
padding: 3px 10px
margin: 10px 20px 0 0
border: none
background: $bloc-background-color
box-sizing: border-box
.userMenu-search-sugestions a
color: rgba(0, 0, 0, 0.7)
@ -478,31 +471,32 @@ img.twister-user-photo @@ -478,31 +471,32 @@ img.twister-user-photo
opacity: 1
.refresh-toptrends, .twistday-reminder .refresh, .refresh-users
@extend .ion-alert
@extend .ion-shuffle
@extend .ion
color: $main-color-dark
color: lighten($main-color-dark,30%)
cursor: pointer
font-size: 11px
font-size: .7rem
font-weight: 500
text-transform: none
letter-spacing: 0
float: right
display: block
margin: 5px
margin: 10px
position: relative
.view-all-users
color: $main-color-dark
color: lighten($main-color-dark,30%)
cursor: pointer
font-size: 11px
font-size: .7rem
font-weight: 500
text-transform: none
letter-spacing: 0
float: right
display: block
margin: 5px
margin: 10px
position: relative
@extend .ion-eye
@extend .ion
.refresh-toptrends:hover, .twistday-reminder .refresh:hover, .refresh-users:hover, .view-all-users:hover
color: $main-color-color
text-decoration: none

Write Preview
Loading…
Cancel
Save