seth
/
jam-cloud
mirror of https://bitbucket.org/jamkazam/jam-cloud.git
1
0
Fork 0
Code Issues Actions Packages Projects Releases Wiki Activity

Start of session from jeff: header and controls

This commit is contained in:
Jonathon Wilson 2013-01-12 18:31:13 -07:00
parent 8b6fd0a34c
commit 67bdb5a714
5 changed files with 150 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
app/assets/stylesheets/client/common.css.scss
View File

@ -31,3 +31,6 @@ $text: #f3f1ee;
$gradient-diff: 30%; $link: $color8;
$border: hsl(210, 50%, 45%);

11
app/assets/stylesheets/client/jamkazam.css.scss
View File

@ -28,6 +28,7 @@ a {
cursor:pointer;
color: $ColorLink;
text-decoration: none;
display: inline-block;
}
a:hover {
@ -97,6 +98,16 @@ input[type="button"] {
font-weight:300;
cursor:pointer;
color:#ccc;
.clearall {
clear:both;
}
.left {
float:left;
}
.right {
float:right;
}
.hidden {

26
app/assets/stylesheets/client/screen_common.css.scss
View File

@ -9,6 +9,27 @@
border: 1px solid $ColorScreenPrimary;
background-color:$ColorScreenBackground;
.button-grey {
margin:0px 8px 0px 8px;
height: 16px;
background-color:#666;
border: solid 1px #868686;
outline:solid 2px #666;
padding:3px 10px;
font-family:raleway;
font-size:12px;
font-weight:300;
cursor:pointer;
color:#ccc;
text-decoration:none;
}
.button-grey:hover {
background-color:#999;
color:#FFF;
}
.footer button {
margin:1em 0em 1em 1em;
}
@ -55,6 +76,11 @@
padding:4px;
background-color:#ED3618;
.content-icon {
margin-right:10px;
float:left;
}
h1 {
margin: -3px 0px 0px 0px;
padding:0;

125
app/assets/stylesheets/client/session.css.scss
View File

@ -1,49 +1,88 @@
@import "client/common.css.scss";
/* Session Tracks */
.session-track {
width: 125px;
height: 300px;
border: 1px solid #fff;
position:relative;
float:left;
}
.session-track [track-role] { margin:4px; }
.session-track .latency { text-align:center; }
.session-track .latency.good { color:#00ff00; }
.session-track .latency.medium { color:#ffff00; }
.session-track .latency.bad { color:#ff0000; }
[layout-id="session"] {
.session-track .mute {
background-color:#bbb; color:#000;
position: absolute;
bottom: 80px;
width: 117px;
text-align: center;
}
.settings {
margin-left:15px;
}
.session-track .name {
background-color:#ddd; color:#000;
position: absolute;
bottom: 60px;
width: 117px;
text-align: center;
}
.session-track .part {
background-color:#fff; color:#000;
position: absolute;
bottom: 40px;
width: 117px;
text-align: center;
}
#session-controls {
width:100%;
padding:11px 0px 11px 0px;
background-color:#4c4c4c;
min-height:20px;
overflow-x:hidden;
}
#volume {
position:relative;
font-size:12px;
margin-top:5px;
margin-left:12px;
color:#ccc;
float:left;
width:120px;
/*background-image:url(../images/content/bkg_volume.png);*/
background-image: url('/assets/content/bkg_volume.png');
background-position:right;
background-repeat:no-repeat;
}
.slider-volume {
position:absolute;
top:2px;
right:30px;
width:8px;
height:17px;
}
/* Session Tracks */
.session-track {
width: 125px;
height: 300px;
border: 1px solid #fff;
position:relative;
float:left;
}
.session-track [track-role] { margin:4px; }
.session-track .latency { text-align:center; }
.session-track .latency.good { color:#00ff00; }
.session-track .latency.medium { color:#ffff00; }
.session-track .latency.bad { color:#ff0000; }
.session-track .mute {
background-color:#bbb; color:#000;
position: absolute;
bottom: 80px;
width: 117px;
text-align: center;
}
.session-track .name {
background-color:#ddd; color:#000;
position: absolute;
bottom: 60px;
width: 117px;
text-align: center;
}
.session-track .part {
background-color:#fff; color:#000;
position: absolute;
bottom: 40px;
width: 117px;
text-align: center;
}
.session-track .avatar {
position:absolute;
width: 32px;
height: 32px;
bottom:4px;
left: 46px;
}
.session-track .avatar img {
width: 32px; height: 32px;
}
.session-track .avatar {
position:absolute;
width: 32px;
height: 32px;
bottom:4px;
left: 46px;
}
.session-track .avatar img {
width: 32px; height: 32px;
}

32
app/views/clients/_session.html.erb
View File

@ -1,11 +1,35 @@
<!-- Actual Session Screen -->
<div layout="screen" layout-id="session" layout-arg="id" class="screen secondary">
<div class="breadcrumb">
<p layout-link="home">Home &gt; </p>
<p class="current">Session</p>
<div class="content-head">
<div class="content-icon">
<%= image_tag "shared/icon_session.png", {:height => 19, :width => 19} %>
</div>
<h1>session</h1>
<%= render "screen_navigation" %>
</div>
<!-- session controls -->
<div id="session-controls">
<a class="button-grey settings left" href="#">
<%= image_tag "content/icon_settings_sm.png", {:align => "texttop", :height => 12, :width => 12} %>
SETTINGS
</a>
<a class="button-grey left" href="#">
<%= image_tag "content/icon_share.png", {:align => "texttop"} %>
SHARE
</a>
<div id="volume">VOLUME
<div class="slider-volume">
<%= image_tag "content/slider_volume.png", {:height => 17, :width => 8} %>
</div>
</div>
<a class="button-grey right leave" href="#">X&nbsp;&nbsp;LEAVE</a>
</div>
<!-- end session controls -->
<div id="session-contents">
<div id="session-info"></div>
<div id="session-info" style="display:none;"></div>
<div id="session-tracks"></div>
</div>
</div>