twisterarmy/twister-calm
1
0
Fork 0
mirror of https://github.com/twisterarmy/twister-calm.git synced 2025-01-13 16:37:52 +00:00
Code Issues Projects Releases Wiki Activity

Merge pull request #23 from iShift/master

Browse Source 
Add theme selector
This commit is contained in:
iHedgehog 2014-03-23 16:55:33 +03:00
commit 80f3e67546
36 changed files with 2002 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
abort.html
View File

@ -3,7 +3,18 @@
<head>
<meta charset="utf-8"/>
<title>Aborting...</title>
<link rel="stylesheet" href="css/style.css" type="text/css"/>
<script>
var theme = localStorage.getItem('theme');
if (theme=='calm') {
document.write('<link rel="stylesheet" type="text/css" href="css/style.css">');
document.write('<link rel="stylesheet" type="text/css" href="css/profile.css">');
document.write('<link rel="stylesheet" type="text/css" href="jquery-emotions/jquery.emotions.calm.css">');
} else {
document.write('<link rel="stylesheet" type="text/css" href="css/orange/style.css">');
document.write('<link rel="stylesheet" type="text/css" href="css/orange/profile.css">');
}
</script>
<script src="jquery.min.js"></script>
<script src="jQueryPlugins.js"></script>
<script src="jquery.json-2.4.js"></script>

BIN
css/img/ajax-loader.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.6 KiB

BIN
css/img/config.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
css/img/connections.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

BIN
css/img/edit.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

BIN
css/img/genericPerson.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.8 KiB

BIN
css/img/grayed_avatar_placeholder_24.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

BIN
css/img/home.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.4 KiB

BIN
css/img/icons-18-black.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.9 KiB

BIN
css/img/icons-18-white.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.9 KiB

BIN
css/img/icons-36-black.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.8 KiB

BIN
css/img/icons-36-white.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.8 KiB

BIN
css/img/loader.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.1 KiB

BIN
css/img/messages.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.0 KiB

BIN
css/img/network.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
css/img/profile.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.2 KiB

BIN
css/img/reply.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
css/img/repost.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.6 KiB

BIN
css/img/spinner-medium.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.3 KiB

BIN
css/img/spinner-small.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 457 B

BIN
css/img/spinner.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 457 B

BIN
css/img/tornado_avatar.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.0 KiB

BIN
css/img/twister_mini.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.4 KiB

BIN
css/img/wash-white-30.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 79 B

BIN
css/orange/OpenSans-Bold.ttf Normal file
View File

Binary file not shown.

BIN
css/orange/OpenSans-Italic.ttf Normal file
View File

Binary file not shown.

BIN
css/orange/OpenSans-Regular.ttf Normal file
View File

Binary file not shown.

BIN
css/orange/OpenSansCondensed300.ttf Normal file
View File

Binary file not shown.

238
css/orange/profile.css Normal file
View File

@ -0,0 +1,238 @@
/**************************************
********************* PROFILE PHOTO ***
***************************************/
.profile-card
{
padding: 7px;
background: rgba( 255, 255, 255, .5 );
border: solid 1px rgba( 69, 71, 77, .05 );
position: relative;
}
.profile-card-main
{
width: 540px;
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;
border: solid 6px #45474d;
border-radius: 40%;
border-top-right-radius: 0;
border-bottom-left-radius: 0;
box-sizing: content-box;
float:left;
top: 50%;
background-color: #a12a28;
}
.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: 580px;
border-radius: 5px;
overflow: hidden;
position: absolute;
top:10%;
height: 80%;
margin-left: -300px;
}
.profile-modal .modal-content
{
padding: 3px;
height: 90%;
}
.profile-modal .profile-data
{
display: inline-block;
margin-left: -4px;
border-bottom: 0;
}
.profile-modal .postboard
{
margin-left: 0;
padding: 5px 0 5px 0;
height: 75%;
}
.profile-modal .postboard h2
{
width: auto;
}
.profile-modal .postboard-posts
{
display: block;
height: 90%;
overflow: auto;
}
.profile-modal .profile-card-main
{
background: #45474d;
color: white;
width:100%;
}
.profile-modal .profile-card-main a {
color: #8bb9e0;
}
.profile-modal .postboard-posts .post
{
padding: 0;
}
.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;
}
h1.profile-name {
display: inline;
}
h2.profile-screen-name {
display: inline;
}
.profile-modal .modal-buttons {
display: none;
}

1574
css/orange/style.css Normal file
View File

File diff suppressed because it is too large Load Diff

14
following.html
View File

@ -3,8 +3,18 @@
<head>
<meta charset="utf-8"/>
<title>Following</title>
<link rel="stylesheet" href="css/style.css" type="text/css"/>
<link rel="stylesheet" href="css/profile.css" type="text/css"/>
<script>
var theme = localStorage.getItem('theme');
if (theme=='calm') {
document.write('<link rel="stylesheet" type="text/css" href="css/style.css">');
document.write('<link rel="stylesheet" type="text/css" href="css/profile.css">');
document.write('<link rel="stylesheet" type="text/css" href="jquery-emotions/jquery.emotions.calm.css">');
} else {
document.write('<link rel="stylesheet" type="text/css" href="css/orange/style.css">');
document.write('<link rel="stylesheet" type="text/css" href="css/orange/profile.css">');
}
</script>
<script src="js/jquery.min.js"></script>
<script src="js/jQueryPlugins.js"></script>
<script src="js/jquery.json-2.4.js"></script>

100
home.html
View File

@ -3,9 +3,6 @@
<head>
<meta charset="utf-8"/>
<title>twister</title>
<link rel="stylesheet" href="css/style.css" type="text/css"/>
<link rel="stylesheet" href="css/profile.css" type="text/css"/>
<link rel="stylesheet" href="jquery-emotions/jquery.emotions.calm.css" type="text/css"/>
<script src="js/jquery.min.js"></script>
<script src="js/jQueryPlugins.js"></script>
<script src="js/jquery.json-2.4.js"></script>
@ -30,6 +27,20 @@
<script src="js/calm.js"></script>
<script src="js/options.js"></script>
<script src="jquery-emotions/jquery.emotions.js"></script>
<script>
var theme = localStorage.getItem('theme');
if (theme=='calm') {
document.write('<link rel="stylesheet" type="text/css" href="css/style.css">');
document.write('<link rel="stylesheet" type="text/css" href="css/profile.css">');
document.write('<link rel="stylesheet" type="text/css" href="jquery-emotions/jquery.emotions.calm.css">');
} else {
document.write('<link rel="stylesheet" type="text/css" href="css/orange/style.css">');
document.write('<link rel="stylesheet" type="text/css" href="css/orange/profile.css">');
$(".userMenu-dhtindicator").hide();
}
</script>
<script>$(function(){setInterval("networkUpdate()", 2000); homeIntInit ();})</script>
<link rel="icon" type="image/png" href="img/twister_mini.png" />
@ -37,7 +48,8 @@
<body>
<!-- MENU SUPERIOR INIT -->
<!-- MENU SUPERIOR INIT CALM-->
<div style="display:none" class="calm_menu">
<nav class="userMenu">
<ul>
<li class="userMenu-home"><a href="#"></a></li>
@ -93,7 +105,75 @@
</ul>
</nav>
<!-- MENU SUPERIOR END -->
</div>
<!-- MENU SUPERIOR END -->
<!-- MENU SUPERIOR INIT ORIGINAL-->
<div style="display:none" class="original_menu">
<nav class="userMenu">
<ul>
<li class="userMenu-home current"><a href="#">Home</a></li>
<li class="userMenu-network"><a href="network.html">Network</a></li>
<li class="userMenu-profile"><a href="profile-edit.html">Profile</a></li>
<li class="userMenu-config">
<a class="userMenu-config-dropdown" href="#">
<div class="config-menu dialog-modal">
<div class="mini-profile-info">
<div class="mini-profile-photo"><img src="img/grayed_avatar_placeholder_24.png" alt="user-photo"/></div>
<a href="#" class="mini-profile-name">Fulano da Silva</a>
<span class="mini-profile-view">View</span>
</div>
<a class="dropdown-menu-item" href="options.html">Options</a>
<a class="dropdown-menu-item" href="profile-edit.html">Setup account</a>
<a class="dropdown-menu-item" href="following.html">Following users</a>
<a class="dropdown-menu-item" href="network.html">Network config</a>
<a class="dropdown-menu-item" href="login.html">Change user</a>
<a class="dropdown-menu-item promoted-posts-only" href="#">Switch to Promoted posts</a>
<a class="direct-messages dropdown-menu-item" href="#">Direct Messages</a>
</div>
</a>
</li>
<li class="userMenu-connections">
<a href="#">
<span class="messages-qtd" style="display:none;">12</span>
</a>
</li>
<li class="userMenu-messages">
<a href="#">
<span class="messages-qtd" style="display:none;">12</span>
</a>
</li>
<!-- BUSCA -->
<li class="userMenu-search">
<input type="text" class="userMenu-search-field" placeholder="search"/>
<div class="search-results dialog-modal">
<ul class="userMenu-search-sugestions" style="display: none;">
<li><a href="#">Fulano</a></li>
<li><a href="#">Outro Fulano</a></li>
<li><a href="#">Mais outro</a></li>
</ul>
<ul class="userMenu-search-profiles">
<li id="search-profile-template" style="display: none;">
<div class="mini-profile-info" data-screen-name="">
<a href="#" class="open-profile-modal">
<img class="mini-profile-photo" src="img/grayed_avatar_placeholder_24.png" alt="user-photo"/>
<span class="mini-screen-name">@<b></b></span>
<span class="mini-profile-name"></span>
</a>
<button class="follow">Follow</button>
</div>
</li>
</ul>
</div>
</li>
</ul>
</nav></div>
<!-- MENU SUPERIOR END ORIGINAL-->
<div class="wrapper">
@ -445,5 +525,15 @@
<!-- TEMPLATES END -->
<audio id="player"></audio>
<audio id="playerSec"></audio>
<!-- hide elements -->
<script>
if (theme=='calm') {
$(".calm_menu").show();
} else {
$(".userMenu-dhtindicator").hide();
$(".original_menu").show();
}
</script>
</body>
</html>

13
login.html
View File

@ -3,7 +3,18 @@
<head>
<meta charset="utf-8"/>
<title>twister login</title>
<link rel="stylesheet" href="css/style.css" type="text/css"/>
<script>
var theme = localStorage.getItem('theme');
if (theme=='calm') {
document.write('<link rel="stylesheet" type="text/css" href="css/style.css">');
document.write('<link rel="stylesheet" type="text/css" href="css/profile.css">');
document.write('<link rel="stylesheet" type="text/css" href="jquery-emotions/jquery.emotions.calm.css">');
} else {
document.write('<link rel="stylesheet" type="text/css" href="css/orange/style.css">');
document.write('<link rel="stylesheet" type="text/css" href="css/orange/profile.css">');
}
</script>
<script src="js/jquery.min.js"></script>
<script src="js/jQueryPlugins.js"></script>
<script src="js/jquery.json-2.4.js"></script>

13
network.html
View File

@ -3,7 +3,18 @@
<head>
<meta charset="utf-8"/>
<title>Network status</title>
<link rel="stylesheet" href="css/style.css" type="text/css"/>
<script>
var theme = localStorage.getItem('theme');
if (theme=='calm') {
document.write('<link rel="stylesheet" type="text/css" href="css/style.css">');
document.write('<link rel="stylesheet" type="text/css" href="css/profile.css">');
document.write('<link rel="stylesheet" type="text/css" href="jquery-emotions/jquery.emotions.calm.css">');
} else {
document.write('<link rel="stylesheet" type="text/css" href="css/orange/style.css">');
document.write('<link rel="stylesheet" type="text/css" href="css/orange/profile.css">');
}
</script>
<script src="js/jquery.min.js"></script>
<script src="js/jQueryPlugins.js"></script>
<script src="js/jquery.json-2.4.js"></script>

37
options.html
View File

@ -3,7 +3,18 @@
<head>
<meta charset="utf-8"/>
<title>twister login</title>
<link rel="stylesheet" href="css/style.css" type="text/css"/>
<script>
var theme = localStorage.getItem('theme');
if (theme=='calm') {
document.write('<link rel="stylesheet" type="text/css" href="css/style.css">');
document.write('<link rel="stylesheet" type="text/css" href="css/profile.css">');
document.write('<link rel="stylesheet" type="text/css" href="jquery-emotions/jquery.emotions.calm.css">');
} else {
document.write('<link rel="stylesheet" type="text/css" href="css/orange/style.css">');
document.write('<link rel="stylesheet" type="text/css" href="css/orange/profile.css">');
}
</script>
<script src="js/jquery.min.js"></script>
<script src="js/jQueryPlugins.js"></script>
<script src="js/jquery.json-2.4.js"></script>
@ -22,6 +33,13 @@
<script>$(function(){
initInterfaceCommon();
InitOptions();})
$(document).ready(function(){
$('#c_theme').change(function(){
localStorage.setItem('theme', $(this).val());
location.reload();
});
});
</script>
</head>
@ -114,7 +132,22 @@
</div>
</div>
</div>
</div>
<div class="Theme">
<div class="module">
<p> Theme </p>
<div>
<select name="" id="c_theme">
<option value="calm">Calm</option>
<option value="original">Original</option>
</select>
</div>
</div>
</div>
</div>
<script>
var theme = localStorage.getItem('theme');
$("#c_theme").val(theme);
</script>
</body>
</html>

14
profile-edit.html
View File

@ -2,8 +2,18 @@
<head>
<meta charset="utf-8">
<title>Edit profile</title>
<link rel="stylesheet" href="css/style.css" type="text/css">
<link rel="stylesheet" href="css/profile.css" type="text/css">
<script>
var theme = localStorage.getItem('theme');
if (theme=='calm') {
document.write('<link rel="stylesheet" type="text/css" href="css/style.css">');
document.write('<link rel="stylesheet" type="text/css" href="css/profile.css">');
document.write('<link rel="stylesheet" type="text/css" href="jquery-emotions/jquery.emotions.calm.css">');
} else {
document.write('<link rel="stylesheet" type="text/css" href="css/orange/style.css">');
document.write('<link rel="stylesheet" type="text/css" href="css/orange/profile.css">');
}
</script>
<script src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/qrcode.js"></script>
<script src="js/jQueryPlugins.js"></script>