pimhwang
/
spreed-webrtc
mirror of https://github.com/strukturag/spreed-webrtc.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Merge upstream. Fix buddylist conflicts. 

Conflicts:

	Makefile
	src/styles/global/_branding.scss
	src/styles/global/_variables.scss

Update vars.

Remove old files. Change scss comments to new app name.

Improve variables.

Remove duplicate form vars. Fix whitespace.
pull/50/head
Evan Theurer 11 years ago
parent
b700be180f
commit
328ba6139e
13 changed files with 148 additions and 128 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 4
      src/styles/components/_bar.scss
  2. 12
      src/styles/components/_buddylist.scss
  3. 2
      src/styles/components/_chat.scss
  4. 11
      src/styles/components/_fileinfo.scss
  5. 4
      src/styles/components/_settings.scss
  6. 8
      src/styles/global/_base.scss
  7. 15
      src/styles/global/_branding.scss
  8. 6
      src/styles/global/_overlaybar.scss
  9. 184
      src/styles/global/_variables.scss
  10. 21
      src/styles/global/skins/_dark.scss
  11. 4
      src/styles/global/skins/_light.scss
  12. 1
      src/styles/main.scss

4
src/styles/components/_bar.scss
Unescape View File

@ -29,7 +29,7 @@
} }
.bar { .bar {
background-color: $componentbg; background: $bar-background;
box-shadow: 0 2px 10px 0 $componentfg3; box-shadow: 0 2px 10px 0 $componentfg3;
color: $componentfg1; color: $componentfg1;
font: bold 1em/40px $font-sans-serif; font: bold 1em/40px $font-sans-serif;
@ -170,7 +170,7 @@
} }
&:hover { &:hover {
background-color: none; background-color: none;
border-color: $bordercolor; border-color: $bar-btn-action-border;
color: $bar-btn-action-hover; color: $bar-btn-action-hover;
} }
&.active { &.active {

12
src/styles/components/_buddylist.scss
Unescape View File

@ -29,14 +29,14 @@
} }
#buddylist:before { #buddylist:before {
background: $componentbg; background: $buddylist-tab-background;
border-left: 1px solid $bordercolor; border-left: 1px solid $bordercolor;
border-top: 1px solid $bordercolor; border-top: 1px solid $bordercolor;
border-bottom: 1px solid $bordercolor; border-bottom: 1px solid $bordercolor;
border-top-left-radius: 6px; border-top-left-radius: 6px;
border-bottom-left-radius: 6px; border-bottom-left-radius: 6px;
bottom: 0; bottom: 0;
color: $buddylist-background; color: $buddylist-tab-color;
content: "\f100"; content: "\f100";
cursor: pointer; cursor: pointer;
display: none; display: none;
@ -62,7 +62,7 @@
} }
.buddylist { .buddylist {
background: $componentbg; background: $buddylist-background;
border-top: 1px solid $bordercolor; border-top: 1px solid $bordercolor;
bottom: 0; bottom: 0;
left: 25px; left: 25px;
@ -93,7 +93,7 @@
.buddylistloading, .buddylistloading,
.buddylistempty { .buddylistempty {
bottom: 0; bottom: 0;
color: $buddylist-background; color: $font-color-accent;
display: none; display: none;
font-size: 1.4em; font-size: 1.4em;
height: 2em; height: 2em;
@ -175,7 +175,7 @@
} }
} }
.buddy1 { .buddy1 {
color: $componentfg1; color: $buddylist-buddy1;
font-weight: bold; font-weight: bold;
font-size: 14px; font-size: 14px;
height: 28px; height: 28px;
@ -188,7 +188,7 @@
white-space: nowrap; white-space: nowrap;
} }
.buddy2 { .buddy2 {
color: $componentfg2; color: $buddylist-buddy2;
left: 65px; left: 65px;
overflow: hidden; overflow: hidden;
position: absolute; position: absolute;

2
src/styles/components/_chat.scss
Unescape View File

@ -167,7 +167,7 @@
} }
.chatheader { .chatheader {
background: $componentbg; background: $chat-header;
border-top: 1px solid $bordercolor; border-top: 1px solid $bordercolor;
border-bottom: 1px solid $bordercolor; border-bottom: 1px solid $bordercolor;
border-right: 1px solid $bordercolor; border-right: 1px solid $bordercolor;

11
src/styles/components/_fileinfo.scss
Unescape View File

@ -56,6 +56,17 @@
} }
} }
.is_remote .file-info {
background: $fileinfo-background-remote;
border: 1px solid $fileinfo-border-remote;
.file-info-bg {
.#{$fa-css-prefix} {
color: $fileinfo-icon-background-color-remote;
font-size: 20em;
}
}
}
.file-info-name { .file-info-name {
font-size: 1.1em; font-size: 1.1em;
margin: .2em 0; margin: .2em 0;

4
src/styles/components/_settings.scss
Unescape View File

@ -34,7 +34,7 @@
#settings.show { #settings.show {
right: 0; right: 0;
@include breakpt($breakpoint-settings-medium, max-width, only screen) { @include breakpt($breakpoint-settings-medium, max-width, only screen) {
background: white; background: $settings-background;
left: 0; left: 0;
width: auto; width: auto;
} }
@ -52,7 +52,7 @@
} }
.settings { .settings {
background: $sidepanebg; background: $settings-background;
bottom: 0; bottom: 0;
left: 0; left: 0;
overflow-x: hidden; overflow-x: hidden;

8
src/styles/global/_base.scss
View File

File diff suppressed because one or more lines are too long

15
src/styles/global/_branding.scss
View File

File diff suppressed because one or more lines are too long

6
src/styles/global/_overlaybar.scss
Unescape View File

@ -20,8 +20,8 @@
*/ */
.overlaybar { .overlaybar {
background: $componentfg3; background: $overlaybar-background;
color: $bordercolor; color: $overlaybar-color;
min-height: 36px; min-height: 36px;
padding: 3px 8px 0 30px; padding: 3px 8px 0 30px;
position: absolute; position: absolute;
@ -68,7 +68,7 @@
} }
} }
.overlaybar-button { .overlaybar-button {
color: $bordercolor; color: $overlaybar-btn;
display: block; display: block;
font-size: 20px; font-size: 20px;
top: 0px; top: 0px;

184
src/styles/global/_variables.scss
Unescape View File

@ -21,10 +21,10 @@
@import "compass/utilities/color/contrast"; @import "compass/utilities/color/contrast";
@import "branding"; @import "branding";
@import "skins/dark"; @import "skins/light";
// general // general
$background: #e5e5e5; $background: #e5e5e5 !default;
$componentbg: #f5f5f5 !default; $componentbg: #f5f5f5 !default;
$componentfg1: #262626 !default; $componentfg1: #262626 !default;
$componentfg2: rgba(0,0,0,.5) !default; $componentfg2: rgba(0,0,0,.5) !default;
@ -34,7 +34,6 @@ $sidepanebg: white !default;
$bordercolor: #ccc !default; $bordercolor: #ccc !default;
$actioncolor1: rgb(132,184,25) !default; $actioncolor1: rgb(132,184,25) !default;
$actioncolor2: rgb(0,149,52) !default; $actioncolor2: rgb(0,149,52) !default;
$font-color: lighten(#000, 20%) !default;
// branding // branding
$logo: url("../img/logo-small.png") !default; $logo: url("../img/logo-small.png") !default;
@ -45,117 +44,132 @@ $main-background: url("../img/bg-tiles.png") !default;
$main-background-retina: url("../img/bg-tiles_x2.png") !default; $main-background-retina: url("../img/bg-tiles_x2.png") !default;
// general action based colors // general action based colors
$action-hover: rgba(0,0,0,.4); $action-hover: rgba(0,0,0,.4) !default;
$action-mute: rgb(219,79,57); $action-mute: rgb(219,79,57) !default;
$action-enable: $actioncolor1; $action-enable: $actioncolor1 !default;
// base // base
$welcome: #aaa; $welcome: #aaa !default;
$loading: #ddd; $loading: #ddd !default;
// font // font
$font-sans-serif: "Helvetica Neue",Helvetica,Arial,sans-serif !default; $font-sans-serif: "Helvetica Neue",Helvetica,Arial,sans-serif !default;
$base-font-size: 13px !default; // compass vertical_rhythm mixin $base-font-size: 13px !default; // compass vertical_rhythm mixin
$base-line-height: 1.53846156 !default; // compass vertical_rhythm mixin $base-line-height: 1.53846156 !default; // compass vertical_rhythm mixin
$font-color: lighten(#000, 20%) !default;
$font-color-accent: lighten($font-color, 50%) !default;
// audio video // audio video
$audiovideolevel: $action-enable; $audiovideolevel: $action-enable !default;
// main navigation bar // main navigation bar
$minbarheight: 44px; $minbarheight: 44px !default;
$bar-logo-text-desc: rgb(34,34,34); $bar-background: $componentbg;
$bar-btn-action-color: rgba(0,0,0,.3); $bar-logo-text-desc: rgb(34,34,34) !default;
$bar-btn-action-hover: $action-hover; $bar-btn-action-border: $bordercolor !default;
$bar-btn-action-mute: $action-mute; $bar-btn-action-color: rgba(0,0,0,.3) !default;
$bar-btn-action-enable: $action-enable; $bar-btn-action-hover: $action-hover !default;
$bar-btn-action-mute: $action-mute !default;
$bar-btn-action-enable: $action-enable !default;
// overlaybar
$overlaybar-background: $componentfg3;
$overlaybar-color: $bordercolor !default;
$overlaybar-btn: $bordercolor !default;
// video // video
$video-background: rgba(0,0,0,.4); $video-background: rgba(0,0,0,.4) !default;
$video-onlyaudio-background: #666; $video-onlyaudio-background: #666 !default;
$video-onlyaudio: rgba(255,255,255,.3); $video-onlyaudio: rgba(255,255,255,.3) !default;
$video-overlayactions: rgba(0,0,0,.9); $video-overlayactions: rgba(0,0,0,.9) !default;
// buddylist // buddylist
$buddylist-background: rgba(0,0,0,.3); $buddylist-background: $componentbg;
$buddylist-action-background: rgba(255,255,255,0.5); $buddylist-tab-color: rgba(0,0,0,.3) !default;
$buddylist-tab-background: $componentbg !default;
$buddylist-action-background: rgba(255,255,255,0.5) !default;
$buddylist-buddy1: $componentfg1 !default;
$buddylist-buddy2: $componentfg2 !default;
// chat // chat
$chat-background: #e7e7e7; $chat-background: #e7e7e7 !default;
$chat-disabled: #aaa; $chat-header: $componentbg !default;
$chat-badge: #84b819; $chat-disabled: #aaa !default;
$chat-ctrl: rgba(0,0,0,.3); $chat-badge: #84b819 !default;
$chat-timestamp: #aaa; $chat-ctrl: rgba(0,0,0,.3) !default;
$chat-meta: #aaa; $chat-timestamp: #aaa !default;
$chat-msg-background: white; $chat-meta: #aaa !default;
$chat-msg-border: #e5e5ef; $chat-msg-background: white !default;
$chat-msg-border: #e5e5ef !default;
$chat-msg-default-icon-color: #ccc;
$chat-msg-unread-icon-color: #FE9A2E; $chat-msg-default-icon-color: #ccc !default;
$chat-msg-sending-icon-color: $chat-msg-default-icon-color; $chat-msg-unread-icon-color: #FE9A2E !default;
$chat-msg-sent-icon-color: #5882FA; $chat-msg-sending-icon-color: $chat-msg-default-icon-color !default;
$chat-msg-delivered-icon-color: #5882FA; $chat-msg-sent-icon-color: #5882FA !default;
$chat-msg-received-icon-color: #84b819; $chat-msg-delivered-icon-color: #5882FA !default;
$chat-msg-read-icon-color: $chat-msg-default-icon-color; $chat-msg-received-icon-color: #84b819 !default;
$chat-msg-read-icon-color: $chat-msg-default-icon-color !default;
$chat-msg-unread-icon: '\f0eb';
$chat-msg-sending-icon: '\f0ec'; $chat-msg-unread-icon: '\f0eb' !default;
$chat-msg-sent-icon: '\f003'; $chat-msg-sending-icon: '\f0ec' !default;
$chat-msg-delivered-icon: '\f019'; $chat-msg-sent-icon: '\f003' !default;
$chat-msg-received-icon: '\f06e'; $chat-msg-delivered-icon: '\f019' !default;
$chat-msg-read-icon: '\f00c'; $chat-msg-received-icon: '\f06e' !default;
$chat-msg-read-icon: '\f00c' !default;
$chat-msg-self-background: white;
$chat-msg-remote-background: white; $chat-msg-self-background: white !default;
$chat-msg-remote-background: white !default;
$chat-bottom-background: $chat-background;
$chat-typing: $chat-meta; $chat-bottom-background: $chat-background !default;
$chat-input-border-color: #66afe9; $chat-typing: $chat-meta !default;
$chat-input-border-color: #66afe9 !default;
// fileinfo // fileinfo
$fileinfo-background: white; $fileinfo-background: white !default;
$fileinfo-border: #ddd; $fileinfo-border: #ddd !default;
$fileinfo-icon-background-color: #eee; $fileinfo-icon-background-color: #eee !default;
$fileinfo-downloading-size-border: #ddd; $fileinfo-downloading-size-border: #ddd !default;
$fileinfo-background-remote: $fileinfo-background !default;
$fileinfo-border-remote: $fileinfo-border !default;
$fileinfo-icon-background-color-remote: $fileinfo-icon-background-color !default;
// settings // settings
$settings-version: #ccc; $settings-version: #ccc !default;
$form-help-text: #737373 !default;
$settings-background: white !default;
// social // social
$social-email-color: #aaa; $social-email-color: #aaa !default;
$social-facebook-color: #45619d; $social-facebook-color: #45619d !default;
$social-google-color: #dd4b39; $social-google-color: #dd4b39 !default;
$social-twitter-color: #00aced; $social-twitter-color: #00aced !default;
$social-xing-color: white; $social-xing-color: white !default;
// useability // useability
$breakpoint-useability-small: 400px; $breakpoint-useability-small: 400px !default;
$breakpoint-useability-large: 1020px; $breakpoint-useability-large: 1020px !default;
// breakpoints // breakpoints
$breakpoint-small: 480px; $breakpoint-small: 480px !default;
$breakpoint-medium: 700px; $breakpoint-medium: 700px !default;
$breakpoint-large: 1280px; $breakpoint-large: 1280px !default;
$breakpoint-video-small: 590px; $breakpoint-video-small: 590px !default;
$breakpoint-video-medium: 630px; $breakpoint-video-medium: 630px !default;
$breakpoint-chat-small: 210px; $breakpoint-chat-small: 210px !default;
$breakpoint-settings-medium: 630px; $breakpoint-settings-medium: 630px !default;
// touch specific // touch specific
$tap-highlight: rgba(0, 0, 0, 0); $tap-highlight: rgba(0, 0, 0, 0) !default;
// Fontawsome changed variables // Fontawsome targeted variables
// original at libs/fontawesome/_variables.scss $fa-css-prefix: fa !default;
$fa-css-prefix: fa;
// Bootstrap changed variables // Bootstrap changed variables
// original at libs/bootstrap/_variables.scss $body-bg: $background !default;
$body-bg: $background;
$font-family-sans-serif: $font-sans-serif !default;
// typography $font-family-base: $font-family-sans-serif !default;
// font, line-height, and color for body text, headings, and more $font-size-base: $base-font-size !default;
$font-family-sans-serif: $font-sans-serif; $font-size-base: $base-font-size !default;
$font-family-serif: Georgia, "Times New Roman", Times, serif; $line-height-base: $base-line-height !default;
$font-family-monospace: Menlo, Monaco, Consolas, "Courier New", monospace; $text-color: $font-color !default;
$font-family-base: $font-family-sans-serif;
$font-size-base: $base-font-size;
$line-height-base: $base-line-height;

21
src/styles/global/skins/_dark.scss
Unescape View File

@ -1,8 +1,8 @@
/*! /*!
* Spreed Speak Freely. * Spreed WebRTC.
* Copyright (C) 2013-2014 struktur AG * Copyright (C) 2013-2014 struktur AG
* *
* This file is part of Spreed Speak Freely. * This file is part of Spreed WebRTC.
* *
* This program is free software: you can redistribute it and/or modify * This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as published by * it under the terms of the GNU Affero General Public License as published by
@ -39,13 +39,13 @@ $componentfg1: contrast-color($menu-background-color);
$componentbg: $menu-background-color; $componentbg: $menu-background-color;
$buddylist-tab-background: $menu-background-color; $buddylist-tab-background: $menu-background-color;
$chat-background: darken($menu-background-color, 5%); $chat-background: darken($menu-background-color, 5%);
$input-bg-color: lighten($menu-background-color, 20%);
$chat-msg-self-background: lighten($chat-background, 10%); $chat-msg-self-background: lighten($chat-background, 10%);
$chat-msg-remote-background: $chat-msg-self-background; $chat-msg-remote-background: $chat-msg-self-background;
$fileinfo-background: darken($chat-msg-self-background, 10%); $fileinfo-background: darken($chat-msg-self-background, 10%);
$fileinfo-background-remote: darken($chat-msg-remote-background, 10%); $fileinfo-background-remote: darken($chat-msg-remote-background, 10%);
$buddylist-action-background: transparent; $buddylist-action-background: transparent;
$sidepanebg: $menu-background-color-accent; $sidepanebg: $menu-background-color-accent;
$settings-background: $menu-background-color;
$fileinfo-icon-background-color: $chat-msg-self-background; $fileinfo-icon-background-color: $chat-msg-self-background;
$fileinfo-icon-background-color-remote: $chat-msg-remote-background; $fileinfo-icon-background-color-remote: $chat-msg-remote-background;
@ -53,14 +53,11 @@ $fileinfo-icon-background-color-remote: $chat-msg-remote-background;
// font // font
$base-font-size: 13px; // compass vertical_rhythm mixin $base-font-size: 13px; // compass vertical_rhythm mixin
$base-line-height: 1.53846156; // compass vertical_rhythm mixin $base-line-height: 1.53846156; // compass vertical_rhythm mixin
// font color
$font-color: contrast-color($menu-background-color); $font-color: contrast-color($menu-background-color);
$font-color-accent: darken($font-color, 20%); $font-color-accent: darken($font-color, 20%);
$chat-ctrl: $font-color; $chat-ctrl: $font-color;
$bar-btn-action-color: $font-color; $bar-btn-action-color: $font-color;
$input-text-color: $font-color;
$chat-meta: $font-color-accent; $chat-meta: $font-color-accent;
$chat-timestamp: $font-color-accent; $chat-timestamp: $font-color-accent;
$form-help-text: $font-color-accent; $form-help-text: $font-color-accent;
@ -72,19 +69,21 @@ $bar-btn-action-border: darken($font-color, 50%);
$bordercolor: lighten($menu-background-color, 10%); $bordercolor: lighten($menu-background-color, 10%);
$chat-msg-border: lighten($chat-background, 5%); $chat-msg-border: lighten($chat-background, 5%);
$input-border-color: $bar-btn-action-border;
$fileinfo-border-remote: $chat-msg-remote-background; $fileinfo-border-remote: $chat-msg-remote-background;
$fileinfo-border: $chat-msg-self-background; $fileinfo-border: $chat-msg-self-background;
$overlaybar-btn: $font-color-accent;
$overlaybar-color: $font-color-accent;
// boostrap vars // bootstrap vars
$text-color: $font-color; $text-color: $font-color;
$legend-color: $font-color; $legend-color: $font-color;
$legend-border-color: $bordercolor; $legend-border-color: $bordercolor;
$hr-border: $bordercolor; $hr-border: $bordercolor;
$list-group-bg: $menu-background-color-accent; $list-group-bg: $menu-background-color-accent;
$list-group-border: $bordercolor; $list-group-border: $bordercolor;
$list-group-hover-bg: $menu-background-color; $list-group-hover-bg: $menu-background-color;
$list-group-link-color: $font-color-accent; $list-group-link-color: $font-color-accent;
$input-bg: lighten($menu-background-color, 20%);
$progress-bg: lighten($input-bg-color, 30%); $input-color: $font-color;
$input-border: $bar-btn-action-border;
$progress-bg: lighten($input-bg, 30%);

4
src/styles/global/skins/_light.scss
Unescape View File

@ -1,8 +1,8 @@
/*! /*!
* Spreed Speak Freely. * Spreed WebRTC.
* Copyright (C) 2013-2014 struktur AG * Copyright (C) 2013-2014 struktur AG
* *
* This file is part of Spreed Speak Freely. * This file is part of Spreed WebRTC.
* *
* This program is free software: you can redistribute it and/or modify * This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as published by * it under the terms of the GNU Affero General Public License as published by

1
src/styles/main.scss
Unescape View File

@ -22,7 +22,6 @@
// must set custom compass variables before import of compass // must set custom compass variables before import of compass
@import "global/variables"; @import "global/variables";
@import "compass"; @import "compass";
@import "global/branding";
@import "libs/libs"; @import "libs/libs";
@import "global/mixins"; @import "global/mixins";

Write Preview
Loading…
Cancel
Save