1 files changed, 136 insertions, 0 deletions
diff --git a/app/assets/stylesheets/app/layouts/_conference.scss b/app/assets/stylesheets/app/layouts/_conference.scss
new file mode 100644
index 0000000..18fb232
--- /dev/null
+++ b/app/assets/stylesheets/app/layouts/_conference.scss
@@ -0,0 +1,136 @@
+// Conference
+// ----------------------------------------
+
+// The Usual Box with Mute, Cross
+.actor {
+  @include clearfix;
+  @include gradient(#FDFDFD, #EFEFEF);
+  @include size(auto, 50px,6px, 1px 0 1px 0);
+  border-bottom:1px solid #E3E3E8;
+  border-top:1px solid #FFF;
+  img {
+    @extend .ext-bradius-inner;
+    float:left;
+    margin-right:6px;
+  }
+  .info {
+    .name {
+      display:block;
+      font-size:size(15px);
+      width:188px;
+    }
+    .status {
+      color:#818181;
+    }
+    float:left;
+  }
+  .voice-actions {
+    float:right;
+  }
+}
+
+// Audio Controls.
+.voice-actions {
+  padding:10px 0;
+  text-align:right;
+  width:100px;
+  .make.speaker {
+    @include image-replace('icons/microphone-16x.png');
+    display:inline-block;
+  }
+  .make.listener {
+    @include image-replace('icons/headphones-16x.png');
+    display:inline-block;
+  }
+
+  .voice {
+    &.muted {
+      @include image-replace('icons/mute-16x.png');
+      display:inline-block;
+    }
+    &.unmuted {
+      @include image-replace('icons/unmute-16x.png');
+      display:inline-block;
+    }
+  }
+  .remove {
+    @include image-replace('icons/cross-16x.png');
+    display:inline-block;
+  }
+  a {
+    margin:0 5px;
+    opacity:0.6;
+    &:hover { opacity:1.0;}
+  }
+}
+
+
+.conference {
+  @include pie-clearfix();
+  .panel {
+    @include box-shadow(1px 1px 0px #FFF inset, 1px 1px 1px #EDEDED);
+    background:#F7F7F7;
+    border:1px solid #E3E3E8;
+    float:left;
+    margin: 0 10px;
+    width: 303px;
+    &.speakers {
+      header { @include gradient(#FFF, #F3F3DE); }
+      h3 { background:transparent image-url('icons/microphone-32x.png') left top no-repeat; }
+    }
+    &.listeners {
+      header { @include gradient(#FFF, #DCEAF2); }
+      h3 { background:transparent image-url('icons/headphones-32x.png') left top no-repeat; }
+    }
+    &.log {
+      header { @include gradient(#FFF, #E7E7E7); }
+      h3 { background:transparent image-url('icons/clock-32x.png') left top no-repeat; }
+    }
+  }
+  .first { margin-left:0;}
+  .last { margin-right:0;}
+  header {
+    @include box-shadow(1px 1px 0px #FFF inset, 0px 1px 0px #FFF);
+    border-bottom:1px solid #E3E3E8;
+    padding:10px;
+  }
+  h3 {
+    font-size:size(24px);
+    font-weight:normal;
+    margin:0;
+    opacity:0.8;
+    padding:2px 2px 2px 43px;
+  }
+  .message {
+    @include gradient( #EEEEEE, #fff);
+    border-bottom:1px solid #E3E3E8;
+    padding:10px;
+    input {
+      @include input-effects;
+      @include size(283px, auto, 5px, 1px solid #E3E3E8 );
+      color:#696969;
+    }
+  }
+  .actors, .messages {
+    height:290px; // This should be X times the amount of items
+    overflow:auto;
+  }
+}
+
+.log {
+  .messages {
+    color:#484848;
+    div {
+      background:#FFF;
+      border-bottom:1px solid #E3E3E8;
+      border-top:1px solid #FFF;
+      padding:5px 10px;
+    }
+    .status {
+      background:#F5F5F5;
+    }
+    .name {
+      font-weight:bold;
+    }
+  }
+}
+\ No newline at end of file