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

Merge pull request #15 from dionyziz/visual_fixes 

Visual fixes
master
miguelfreitas 11 years ago
parent
e20e6b8623 a772fcbc74
commit
3112c522b1
6 changed files with 1714 additions and 1701 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. 424
      css/profile.css
  2. 2970
      css/style.css
  3. 4
      following.html
  4. 4
      home.html
  5. 11
      interface_common.js
  6. 2
      login.html

424
css/profile.css
Unescape View File

@ -1,210 +1,214 @@ @@ -1,210 +1,214 @@
/**************************************
********************* PROFILE PHOTO ***
***************************************/
.profile-card
{
margin: 0 0 10px 335px;
padding: 7px;
background: rgba( 255, 255, 255, .5 );
border: solid 1px rgba( 69, 71, 77, .05 );
position: relative;
}
.profile-card-main
{
width: 520px;
height: 280px;
text-align: center;
position: relative;
transition: all .2s linear;
}
.profile-card-main:before
{
content: "";
border: solid 0px #fff;
transition: all .2s linear;
position: absolute;
left: 1px;
top: 1px;
right: 1px;
bottom: 1px;
z-index: 0;
}
.profile-card-main *
{
position: relative;
z-index: 1;
}
.profile-card-photo
{
width: 74px;
height: 74px;
margin: 20px auto 5px auto;
border-radius: 15%;
border: solid 5px #fff;
box-sizing: content-box;
}
.profile-card-main h1
{
font-size: 24px;
font-weight: bold;
color: #fff;
}
.profile-card-main h2
{
color: #fff;
}
.profile-card .direct-messages,
.profile-card .direct-messages-with-user,
.profile-card .follow
{
display: block;
position: absolute;
bottom: 20px;
right: 10px;
padding: 10px;
font-size: 12px;
width: 120px;
text-align: center;
color: rgba( 0, 0, 0, .7 );
background: rgba( 0, 0, 0, .1 );
border: none;
transition: all .2s linear;
}
.profile-card .follow
{
right: 135px;
}
.profile-card .direct-messages:hover,
.profile-card .direct-messages-with-user:hover,
.profile-card .follow:hover
{
background: rgba( 0, 0, 0, .3 );
}
.profile-card.forEdition
{
margin: 0 auto;
width: 540px;
}
.forEdition .profile-card-photo
{
border: solid 2px #fff;
position: relative;
cursor: pointer;
transition: all .2s linear;
}
.forEdition .profile-card-main:hover:after,
.forEdition .profile-card-photo:after
{
content: "";
width: 36px;
height: 36px;
position: absolute;
top: 10px;
right: 10px;
background: url(../img/edit.png) no-repeat right top;
}
.forEdition .profile-card-main:hover:before
{
border: solid 5px #fff;
}
.forEdition .profile-card-main h2
{
margin-bottom: 8px;
}
.forEdition .profile-card-main input
{
display: block;
margin: 0 auto;
background: rgba( 0, 0, 0, .1 );
border: none;
padding: 6px 4px;
color: #fff;
margin-bottom: 4px;
text-align: center;
transition: all .2s linear;
}
.forEdition .profile-card-main input:hover,
.forEdition .profile-card-main input:focus,
.forEdition .profile-card-photo:hover
{
background: rgba( 0, 0, 0, .3 );
}
.input-description
{
width: 90%;
}
.input-name
{
font-size: 20px;
}
.forEdition .profile-card-main .input-website,
.forEdition .profile-card-main .input-city
{
display: inline-block;
}
.profile-edition-buttons
{
padding: 10px;
text-align: right;
}
/*************************************
****************** PROFILE MODAL
**************************************/
.profile-modal .modal-wrapper
{
width: 528px;
height: 590px;
margin: -300px 0 0 -264px;
overflow: hidden;
}
.profile-modal .modal-content
{
padding: 3px;
}
.profile-modal .profile-data
{
display: inline-block;
}
.profile-modal .postboard
{
margin-left: 0;
padding: 5px 0 5px 0;
}
.profile-modal .postboard h2
{
width: auto;
}
.profile-modal .postboard-posts
{
height: 240px;
overflow: auto;
}
.profile-modal .profile-card-main
{
background: #45474d;
}
.profile-modal .postboard-posts .post
{
padding: 5px;
}
.profile-modal .post-interactions
{
margin: 2px 10px 3px 60px;
}
.profile-modal .profile-card
{
margin: 0;
padding: 0;
}
/*
.profile-card-main
{
height: 200px;
}
*/
.profile-modal .direct-messages,
.profile-modal .direct-messages-with-user,
.profile-modal .follow
{
bottom: 10px;
}
/**************************************
********************* PROFILE PHOTO ***
***************************************/
.profile-card
{
margin: 0 0 10px 335px;
padding: 7px;
background: rgba( 255, 255, 255, .5 );
border: solid 1px rgba( 69, 71, 77, .05 );
position: relative;
}
.profile-card-main
{
width: 520px;
height: 280px;
text-align: center;
position: relative;
transition: all .2s linear;
}
.profile-card-main:before
{
content: "";
border: solid 0px #fff;
transition: all .2s linear;
position: absolute;
left: 1px;
top: 1px;
right: 1px;
bottom: 1px;
z-index: 0;
}
.profile-card-main *
{
position: relative;
z-index: 1;
}
.profile-card-photo
{
width: 74px;
height: 74px;
margin: 20px auto 5px auto;
border-radius: 15%;
border: solid 5px #fff;
box-sizing: content-box;
}
.profile-card-main h1
{
font-size: 24px;
font-weight: bold;
color: #fff;
}
.profile-card-main h2
{
color: #fff;
}
.profile-card .direct-messages,
.profile-card .direct-messages-with-user,
.profile-card .follow
{
display: block;
position: absolute;
bottom: 20px;
right: 10px;
padding: 10px;
font-size: 12px;
width: 120px;
text-align: center;
color: rgba( 0, 0, 0, .7 );
background: rgba( 0, 0, 0, .1 );
border: none;
transition: all .2s linear;
}
.profile-card .follow
{
right: 135px;
}
.profile-card .direct-messages:hover,
.profile-card .direct-messages-with-user:hover,
.profile-card .follow:hover
{
background: rgba( 0, 0, 0, .3 );
}
.profile-card.forEdition
{
margin: 0 auto;
width: 540px;
}
.forEdition .profile-card-photo
{
border: solid 2px #fff;
position: relative;
cursor: pointer;
transition: all .2s linear;
}
.forEdition .profile-card-main:hover:after,
.forEdition .profile-card-photo:after
{
content: "";
width: 36px;
height: 36px;
position: absolute;
top: 10px;
right: 10px;
background: url(../img/edit.png) no-repeat right top;
}
.forEdition .profile-card-main:hover:before
{
border: solid 5px #fff;
}
.forEdition .profile-card-main h2
{
margin-bottom: 8px;
}
.forEdition .profile-card-main input
{
display: block;
margin: 0 auto;
background: rgba( 0, 0, 0, .1 );
border: none;
padding: 6px 4px;
color: #fff;
margin-bottom: 4px;
text-align: center;
transition: all .2s linear;
}
.forEdition .profile-card-main input:hover,
.forEdition .profile-card-main input:focus,
.forEdition .profile-card-photo:hover
{
background: rgba( 0, 0, 0, .3 );
}
.input-description
{
width: 90%;
}
.input-name
{
font-size: 20px;
}
.forEdition .profile-card-main .input-website,
.forEdition .profile-card-main .input-city
{
display: inline-block;
}
.profile-edition-buttons
{
padding: 10px;
text-align: right;
}
/*************************************
****************** PROFILE MODAL
**************************************/
.profile-modal .modal-wrapper
{
width: 528px;
height: 590px;
margin: -300px 0 0 -264px;
overflow: hidden;
}
.profile-modal .modal-content
{
padding: 3px;
}
.profile-modal .profile-data
{
display: inline-block;
}
.profile-modal .postboard
{
margin-left: 0;
padding: 5px 0 5px 0;
}
.profile-modal .postboard h2
{
width: auto;
}
.profile-modal .postboard-posts
{
height: 240px;
overflow: auto;
}
.profile-modal .profile-card-main
{
background: #45474d;
color: white;
}
.profile-modal .profile-card-main a {
color: #8bb9e0;
}
.profile-modal .postboard-posts .post
{
padding: 5px;
}
.profile-modal .post-interactions
{
margin: 2px 10px 3px 60px;
}
.profile-modal .profile-card
{
margin: 0;
padding: 0;
}
/*
.profile-card-main
{
height: 200px;
}
*/
.profile-modal .direct-messages,
.profile-modal .direct-messages-with-user,
.profile-modal .follow
{
bottom: 10px;
}

2970
css/style.css
View File

File diff suppressed because it is too large Load Diff

4
following.html
Unescape View File

@ -167,7 +167,7 @@ @@ -167,7 +167,7 @@
<div class="followers">Followed by
<span class="followed-by"></span>
</div>
<a class="twister-user-remove">X</a>
<a class="twister-user-remove">&times;</a>
<button class="follow">Follow</button>
</div>
</li>
@ -251,7 +251,7 @@ @@ -251,7 +251,7 @@
<div class="modal-wrapper">
<div class="modal-header">
<h3></h3>
<span id="closeModal" class="modal-close cancel">X</span>
<span id="closeModal" class="modal-close cancel">&times;</span>
</div>
<div class="modal-content"></div>
<div class="modal-buttons">

4
home.html
Unescape View File

@ -174,7 +174,7 @@ @@ -174,7 +174,7 @@
<div class="followers">Followed by
<span class="followed-by"></span>
</div>
<a class="twister-user-remove">X</a>
<a class="twister-user-remove">&times;</a>
<button class="follow">Follow</button>
</div>
</li>
@ -258,7 +258,7 @@ @@ -258,7 +258,7 @@
<div class="modal-wrapper">
<div class="modal-header">
<h3></h3>
<span id="closeModal" class="modal-close cancel">X</span>
<span id="closeModal" class="modal-close cancel">&times;</span>
</div>
<div class="modal-content"></div>
<div class="modal-buttons">

11
interface_common.js
Unescape View File

@ -32,14 +32,15 @@ function openModal( modalClass ) @@ -32,14 +32,15 @@ function openModal( modalClass )
function closeModal($this)
{
var $body = $( "body" );
var $modalWindow = $this.parents( ".modal-blackout" );
$modalWindow.fadeOut( "fast", function()
var $modalWindows = $( "body" ).children( ".modal-blackout" );
$modalWindows.fadeOut( "fast", function()
{
$modalWindow.detach();
$modalWindows.detach();
});
$body.css({
"overflow": "auto",
"margin-right": "0"
"margin-right": "0"
});
}
@ -446,7 +447,7 @@ var retweetSubmit = function(e) @@ -446,7 +447,7 @@ var retweetSubmit = function(e)
function initInterfaceCommon() {
$("body").on( "click", ".cancel" , function() { closeModal($(this)); } );
$( "body, .cancel, .modal-blackout" ).on( "click", function() { closeModal($(this)); } );
$( ".post-reply" ).bind( "click", postReplyClick );
$( ".post-propagate" ).bind( "click", reTwistPopup );
$( ".userMenu-config-dropdown" ).bind( "click", dropDownMenu );

2
login.html
Unescape View File

@ -101,7 +101,7 @@ @@ -101,7 +101,7 @@
<div class="modal-wrapper">
<div class="modal-header">
<h3></h3>
<span id="closeModal" class="modal-close cancel">X</span>
<span id="closeModal" class="modal-close cancel">&times;</span>
</div>
<div class="modal-content"></div>
<div class="modal-buttons">

Write Preview
Loading…
Cancel
Save