haskal
/
jiti-meet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #137 from fouksf/new-design 

Adds the new design for the toolbars.
This commit is contained in:
fo 2014-09-24 16:18:02 +03:00
parent 708228071c b5cf1e72b6
commit a0d1cb2476
5 changed files with 51 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
css/main.css
View File

@ -19,6 +19,9 @@ html, body{
width: 20%;
max-width: 200px;
overflow: hidden;
/* background-color:#dfebf1;*/
background-color:#FFFFFF;
border-left:1px solid #424242;
z-index: 5;
}
@ -114,13 +117,13 @@ html, body{
display: inline-block;
position: relative;
color: #FFFFFF;
top: 0;
top: 0px;
padding: 10px 0px;
width: 39px;
width: 38px;
cursor: pointer;
font-size: 11pt;
text-align: center;
text-shadow: 0px 1px 0px rgba(255,255,255,.3), 0px -1px 0px rgba(0,0,0,.7);
text-shadow: 0px 1px 0px rgba(255,255,255,.3), 0px -1px 0px rgba(0,0,0,.6);
z-index: 1;
}
@ -177,12 +180,12 @@ html, body{
a.button:hover,
a.bottomToolbarButton:hover {
top: 0;
top: 0px;
cursor: pointer;
background: rgba(0, 0, 0, 0.3);
border-radius: 5px;
background: rgba(255, 255, 255, 0.1);
border-radius: 6px;
background-clip: padding-box;
-webkit-border-radius: 5px;
-webkit-border-radius: 6px;
-webkit-background-clip: padding-box;
}
@ -196,7 +199,16 @@ a.bottomToolbarButton:hover {
top: 5;
width: 1px;
height: 20px;
background: #676767;
background: #373737;
}
.bottom_button_separator {
display: inline-block;
position: relative;
left: 5;
width: 20px;
height: 1px;
background: #373737;
}
input[type='text'], input[type='password'], textarea {
@ -267,16 +279,14 @@ form {
#bottomToolbar {
display:block;
position: absolute;
right: -1;
right: 0;
margin-right: 5px;
bottom: 40px;
width: 29px;
border-top-left-radius: 10px;
border-bottom-left-radius: 10px;
border-radius: 6px;
color: #FFF;
border: 1px solid #000;
background: rgba(50,50,50,.65);
padding-top: 5px;
padding-bottom: 5px;
border: 1px solid rgba(256, 256, 256, 0.2);
background: rgba(0,0,0,0.8);
z-index: 6; /*+1 from #remoteVideos*/
}
@ -285,8 +295,9 @@ form {
position: relative;
color: #FFFFFF;
top: 0;
padding-top: 3px;
width: 29px;
padding-top: 6px;
margin: 2px;
width: 25px;
height: 20px;
cursor: pointer;
font-size: 10pt;

2
css/popover.css
View File

@ -8,7 +8,7 @@
min-width: 100px;
padding: 1px;
text-align: left;
color: #428bca;
color: #333333;
background-color: #ffffff;
background-clip: padding-box;
border: 1px solid #cccccc;

16
css/popup_menu.css
View File

@ -2,17 +2,17 @@
ul.popupmenu {
display:none;
position: absolute;
padding:0;
padding:10px;
margin: 0;
bottom: 0;
margin-bottom: 25px;
padding-bottom: 5px;
padding-top: 5px;
margin-bottom: 35px;
padding-bottom: 10px;
padding-top: 10px;
right: 10px;
left: -5px;
width: 100px;
background-color: rgba(0,0,0,1);
-webkit-box-shadow: 0 0 2px #000000, 0 0 10px #000000;
background-color: rgba(0,0,0,0.9);
border: 1px solid rgba(256, 256, 256, 0.2);
border-radius:8px;
}
@ -30,8 +30,8 @@ ul.popupmenu li {
}
ul.popupmenu li:hover {
background-color: rgba(82, 82, 82, .7);
border-radius:2px;
background-color: rgba(256, 256, 256, .2);
border-radius:6px;
}
/*Link Appearance*/

13
css/videolayout_default.css
View File

@ -285,14 +285,17 @@
#toolbar {
display:inline-block;
position:relative;
margin-top:5px;
margin-left:auto;
margin-right:auto;
height:39px;
padding-left:2px;
padding-right:2px;
height:38px;
width:auto;
background: linear-gradient(to bottom, rgba(103,103,103,.65) , rgba(0,0,0,.65));
-webkit-box-shadow: 0 0 2px #000000, 0 0 10px #000000;
border-bottom-left-radius: 12px;
border-bottom-right-radius: 12px;
background-color: rgba(0,0,0,0.8);
border: 1px solid rgba(256, 256, 256, 0.2);
border-radius: 6px;
}
#subject {

10
index.html
View File

@ -58,12 +58,12 @@
<script src="message_handler.js?v=1"></script>
<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
<link rel="stylesheet" href="css/font.css?v=4"/>
<link rel="stylesheet" type="text/css" media="screen" href="css/main.css?v=23"/>
<link rel="stylesheet" type="text/css" media="screen" href="css/videolayout_default.css?v=10" id="videolayout_default"/>
<link rel="stylesheet" type="text/css" media="screen" href="css/main.css?v=24"/>
<link rel="stylesheet" type="text/css" media="screen" href="css/videolayout_default.css?v=11" id="videolayout_default"/>
<link rel="stylesheet" href="css/jquery-impromptu.css?v=4">
<link rel="stylesheet" href="css/modaldialog.css?v=3">
<link rel="stylesheet" href="css/popup_menu.css?v=2">
<link rel="stylesheet" href="css/popover.css?v=1">
<link rel="stylesheet" href="css/popup_menu.css?v=3">
<link rel="stylesheet" href="css/popover.css?v=2">
<link rel="stylesheet" href="css/contact_list.css?v=1">
<link rel="stylesheet" href="css/welcome_page.css?v=1">
<!--
@ -263,11 +263,13 @@
<i id="chatBottomButton" class="icon-chat-simple"></i>
</a>
</span>
<div class="bottom_button_separator"></div>
<span class="bottomToolbar_span">
<a class="bottomToolbarButton" data-container="body" data-toggle="popover" data-placement="top" data-container="body" id="contactlistpopover" content="Open / close contact list" onclick='BottomToolbar.toggleContactList();'>
<i id="contactListButton" class="icon-contactList"></i>
</a>
</span>
<div class="bottom_button_separator"></div>
<span class="bottomToolbar_span">
<a class="bottomToolbarButton" data-container="body" data-toggle="popover" shortcut="filmstripPopover" data-placement="top" content="Show / hide film strip" onclick='BottomToolbar.toggleFilmStrip()'>
<i id="filmStripButton" class="icon-filmstrip"></i>