diff --git a/conversation.html b/conversation.html
index a2cf79df976f..284a83136bb5 100644
--- a/conversation.html
+++ b/conversation.html
@@ -8,39 +8,39 @@
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+ Welcome to the settings page!!
+
Go Back?
+
+
diff --git a/index2.html b/index2.html
index 026bfbd8a095..aba21904fe97 100644
--- a/index2.html
+++ b/index2.html
@@ -10,22 +10,22 @@
-
-
+
+
+
-
@@ -38,7 +38,7 @@
{{ last_message }}
-
+
{{ last_message_timestamp }}
@@ -65,7 +65,6 @@
-
diff --git a/js/views/conversation_view.js b/js/views/conversation_view.js
index ce3b84696ce3..ef8b1b3b46f5 100644
--- a/js/views/conversation_view.js
+++ b/js/views/conversation_view.js
@@ -37,7 +37,7 @@
this.view = new Whisper.MessageListView({
collection: this.model.messageCollection
});
- $('#conversation-container').append(this.view.el);
+ $('#header').after(this.view.el);
//new ...({el: $(#conversation-container)})
this.model.fetchMessages({reset: true});
},
diff --git a/js/views/message_list_view.js b/js/views/message_list_view.js
index 2a5e126bdbd1..dc23d87f596c 100644
--- a/js/views/message_list_view.js
+++ b/js/views/message_list_view.js
@@ -20,7 +20,7 @@ var Whisper = Whisper || {};
Whisper.MessageListView = Whisper.ListView.extend({
tagName: 'ul',
- className: 'discussion',
+ className: 'message-list',
itemView: Whisper.MessageView,
events: {
'add': 'scrollToBottom',
diff --git a/stylesheets/_variables.scss b/stylesheets/_variables.scss
new file mode 100644
index 000000000000..325dcd2e0ff9
--- /dev/null
+++ b/stylesheets/_variables.scss
@@ -0,0 +1,8 @@
+// colors
+$blue_l: #a2d2f4;
+$blue: #2a92e7;
+$grey_l: #f3f3f3;
+$grey: #616161;
+$grey_d: #454545;
+
+$roboto: Roboto, 'Helvetica Neue', Arial, Helvetica, sans-serif
diff --git a/stylesheets/context/_notifications.scss b/stylesheets/context/_notifications.scss
deleted file mode 100644
index 06f9ca6d9cde..000000000000
--- a/stylesheets/context/_notifications.scss
+++ /dev/null
@@ -1,39 +0,0 @@
-.notifications {
- position:relative;
- font-size: 12px;
- .notification {
- padding:12px;
- p {
- margin:0;
- }
- &.info {
- background-color:whitesmoke;
- border-bottom:1px solid lightgray;
- }
- &.alert {}
- &.warning {}
- &.success {}
- a.button {
- position: absolute;
- cursor:pointer;
- right:10px;
- top:11px;
- background-color:whitesmoke;
- text-decoration: none;
- color:gray;
- border:1px solid lightgray;
- font-weight: bold;
- font-size: 10px;
- text-align: center;
- padding:2px;
- box-sizing: border-box;
- display:block;
- height:18px;
- width:18px;
- border-radius:18px;
- &:hover {
- background-color:lightgray;
- }
- }
- }
-}
diff --git a/stylesheets/context/_title_bar.scss b/stylesheets/context/_title_bar.scss
deleted file mode 100644
index 5381226c7aa1..000000000000
--- a/stylesheets/context/_title_bar.scss
+++ /dev/null
@@ -1,11 +0,0 @@
-.title-bar {
- padding:10px;
- color:white;
- background-color:#00badd;
- border-bottom:1px solid darken(#00badd, 5%);
- h1 {
- padding:0;
- font-weight:normal;
- margin:0.5em 0 0 0;
- }
-}
diff --git a/stylesheets/index.css b/stylesheets/index.css
index 516d2acc67f3..e69de29bb2d1 100644
--- a/stylesheets/index.css
+++ b/stylesheets/index.css
@@ -1,177 +0,0 @@
-ul.discussion {
- margin: 0;
- padding: 10px;
- box-sizing: border-box;
-}
-
-li.entry .sender {
- display: none;
- font-size: 0.75em;
- opacity: 0.54;
-}
-
-.group.conversation li.entry .sender {
- display: block;
-}
-
-
-li.entry .avatar {
- height:32px;
- width:32px;
- border-radius:32px;
- cursor:pointer;
- display:inline-block;
- float:left;
- clear:both;
- background-color:whitesmoke;
-}
-
-li.entry.outgoing .avatar {
- display: none;
-}
-
-li.entry img {
- max-width: 100%;
- margin-top: 5px;
-}
-
-div.imageAttachment {
- height: 30px;
- width: 30px;
- float: left;
- margin: 6px;
- position: relative;
-}
-
-img.preview {
- width: 30px;
- height: 30px;
- overflow: hidden;
- position: relative;
-}
-
-.close {
- font-family: sans-serif;
- color: white;
- position: absolute;
- top: -10px;
- left: 20px;
- text-align: center;
- cursor: default;
- border-radius: 50%;
- width: 20px;
- height: 20px;
- padding: 0px;
-
- background: #666;
- color: #fff;
- text-align: center;
-}
-
-.bootstrap-tagsinput .tag {
- background-color: #00badd;
- padding: 5px;
- border-radius: 3px;
-}
-
-ul.country-list {
- min-width: 197px !important;
-}
-<<<<<<< HEAD
-
-div.attachments {
- width: 95% !important;
-}
-
-input.file-input {
- float: left !important;
-}
-
-.modal-wrapper {
- position: fixed;
- top: 0;
- left: 0;
- right: 0;
- bottom: 0;
- width: 100%;
- z-index: 10000 !important;
- display: none;
-}
-
-.modal-content {
- position: absolute;
- top: 0;
- width: 100%;
- height: 100%;
- overflow: auto;
- overflow-y: scroll;
-}
-
-.modal-container {
- background-color: #FFFFFF;
- width: 450px;
- -webkit-box-shadow: 0 0 7px 0 #000000;
- moz-box-shadow: 0 0 7px 0 #000000;
- box-shadow: 0 0 7px 0 #000000;
- display: block;
- z-index: 10000 !important;
- margin: 45px auto;
- position: relative;
- border: 1px solid #666;
-}
-
-.modal-banner {
- background-color: #00badd;
- color: #ffffff;
- height: 45px;
- line-height: 45px;
- vertical-align: middle;
- text-align: center;
- font-wight: bold;
- font-size: 1.5em;
- position: relative;
-}
-.modal-banner span {
- padding: 0 20px;
-}
-
-.modal-close {
- position: absolute;
- top: 0;
- right: 12px;
- bottom: 0;
-}
-.modal-close a.modal-close-button {
- color: #FFFFFF;
- text-decoration: none;
- font-size: .8em;
-}
-
-.modal-inner {
- overflow: hidden;
-}
-
-.modal-inner>p {
- color: black !important;
-}
-
-.modal-padding {
- padding: 16px 18px;
-}
-
-@media only screen and (max-width: 450px) {
- .modal-container {
- width: 100%;
- margin: 0 auto;
- }
-
- .modal-banner {
- height: 32px;
- line-height: 32px;
- vertical-align: middle;
- text-align: center;
- font-wight: bold;
- font-size: 1em;
- position: relative;
- }
-}
diff --git a/stylesheets/manifest.css b/stylesheets/manifest.css
index f26951ce7451..d1921055eb85 100644
--- a/stylesheets/manifest.css
+++ b/stylesheets/manifest.css
@@ -1,292 +1,210 @@
-@charset "UTF-8";
+@import url(http://fonts.googleapis.com/css?family=Roboto:400,300,700);
+body, input {
+ font-family: Roboto, "Helvetica Neue", Arial, Helvetica, sans-serif; }
+
body {
- font-family: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
- font-weight: normal;
- text-align: center;
- -webkit-font-smoothing: antialiased;
- -moz-font-smoothing: antialiased;
- -ms-font-smoothing: antialiased;
- -o-font-smoothing: antialiased;
- font-smoothing: antialiased;
- hanging-punctuation: first; }
+ margin: 0; }
-/*
- * This is a series-d manifest file.
- *
- * Here, we import responsive variables specified elsewhere
- *
- */
-/* SERIES D SHAME + WIP */
-/* includes iPhone, */
.title-bar {
- padding: 10px;
- color: white;
- background-color: #00badd;
- border-bottom: 1px solid #00a5c4; }
- .title-bar h1 {
- padding: 0;
- font-weight: normal;
- margin: 0.5em 0 0 0; }
-
-.notifications {
position: relative;
+ z-index: 1;
+ height: 36px;
+ line-height: 24px;
+ background: #2a92e7;
+ box-shadow: 0 -4px 3px 4px rgba(12, 65, 108, 0.8); }
+ .title-bar button {
+ height: 36px;
+ line-height: 36px;
+ float: right;
+ margin-right: 8px;
+ padding: 0;
+ border: 0;
+ outline: 0;
+ font-size: 36px;
+ color: white;
+ background: transparent; }
+
+.fab {
+ z-index: 1;
+ position: fixed;
+ right: 16px;
+ bottom: 22px;
+ height: 60px;
+ width: 60px;
+ border: 0;
+ border-radius: 30px;
+ outline: 0;
+ font: 300 36px Roboto, "Helvetica Neue", Arial, Helvetica, sans-serif;
+ color: white;
+ background: #2a92e7;
+ box-shadow: 0 8px 8px -8px rgba(2, 10, 16, 0.8);
+ transition: box-shadow 0.33s, transform 0.33s, background 0.33s; }
+ .fab:hover {
+ background: #1c8be5;
+ box-shadow: 0 8px 18px -8px rgba(2, 10, 16, 0.9);
+ transform: translate3d(0, -1px, 0); }
+
+button {
+ cursor: pointer; }
+
+.timestamp {
font-size: 12px; }
- .notifications .notification {
- padding: 12px; }
- .notifications .notification p {
- margin: 0; }
- .notifications .notification.info {
- background-color: whitesmoke;
- border-bottom: 1px solid lightgray; }
- .notifications .notification a.button {
- position: absolute;
- cursor: pointer;
- right: 10px;
- top: 11px;
- background-color: whitesmoke;
- text-decoration: none;
- color: gray;
- border: 1px solid lightgray;
- font-weight: bold;
- font-size: 10px;
- text-align: center;
- padding: 2px;
- box-sizing: border-box;
+
+.message-list {
+ padding: 0;
+ list-style: none;
+ font-size: 16px;
+ font-weight: 300; }
+ .message-list li {
+ margin: 0 8px 16px; }
+ .message-list li::after {
+ visibility: hidden;
display: block;
- height: 18px;
- width: 18px;
- border-radius: 18px; }
- .notifications .notification a.button:hover {
- background-color: lightgray; }
+ font-size: 0;
+ content: " ";
+ clear: both;
+ height: 0; }
+ .message-list p {
+ margin: 0; }
+ .message-list .bubble {
+ position: relative;
+ left: -2px;
+ display: inline-block;
+ vertical-align: top;
+ max-width: calc(100% - 2 * 54px - 2 * 12px - 8px);
+ padding: 9px 12px;
+ border-radius: 4px;
+ box-shadow: 0 3px 3px -4px black; }
+ .message-list .bubble::before, .message-list .bubble::after {
+ content: '';
+ position: absolute;
+ height: 0;
+ width: 0; }
+ .message-list .bubble::before {
+ top: 19px;
+ border-top: 8px solid transparent;
+ border-bottom: 8px solid transparent; }
+ .message-list .bubble::after {
+ top: 21px;
+ border-top: 6px solid transparent;
+ border-bottom: 6px solid transparent; }
+ .message-list .incoming .bubble {
+ color: #454545;
+ background: #f3f3f3; }
+ .message-list .incoming .bubble::before {
+ left: -10px;
+ border-right: 10px solid white; }
+ .message-list .incoming .bubble::after {
+ left: -8px;
+ border-right: 8px solid #f3f3f3; }
+ .message-list .outgoing img, .message-list .outgoing .bubble {
+ float: right; }
+ .message-list .outgoing .bubble {
+ clear: left;
+ color: white;
+ background: #2a92e7; }
+ .message-list .outgoing .bubble .timestamp {
+ color: #a2d2f4; }
+ .message-list .outgoing .bubble::before {
+ right: -10px;
+ border-left: 10px solid white; }
+ .message-list .outgoing .bubble::after {
+ right: -8px;
+ border-left: 8px solid #2a92e7; }
+ .message-list img {
+ height: 54px;
+ width: 54px;
+ box-sizing: border-box;
+ border: 27px #2a92e7 solid;
+ border-radius: 27px; }
+ .message-list .timestamp {
+ margin-top: 3px;
+ float: right; }
-@media screen and (min-width: 320px) {
- .search {
- padding: 10px;
- border-bottom: 1px solid whitesmoke; }
- .search input[type=search] {
- box-sizing: border-box;
- font-size: 12px;
- outline: 0;
- width: 100%;
- margin: 0;
- letter-spacing: 0.25px;
- padding: 4px 8px;
- border: 1px solid lightgray; }
+.bottom-bar {
+ position: fixed;
+ bottom: 0;
+ height: 36px;
+ width: 100%;
+ border-top: 1px solid #f3f3f3;
+ background: white; }
+ .bottom-bar button, .bottom-bar input {
+ color: #454545; }
+ .bottom-bar button {
+ position: absolute;
+ top: 0;
+ height: 100%;
+ width: 36px;
+ padding: 0;
+ border: 0;
+ outline: 0;
+ font-size: 24px;
+ background: transparent; }
+ .bottom-bar .attachments-btn {
+ left: 0; }
+ .bottom-bar .send-btn {
+ right: 0; }
+ .bottom-bar form, .bottom-bar input {
+ height: 100%;
+ width: 100%; }
+ .bottom-bar input {
+ height: 100%;
+ width: 100%;
+ box-sizing: border-box;
+ padding: 0 36px;
+ border: 0;
+ outline: 0;
+ font-size: 16px;
+ background: white; }
- .gutter .search {
- display: none; } }
-@media screen and (min-width: 480px) {
- .search {
+.index {
+ color: #454545;
+ background: #eee; }
+ .index .contact {
+ position: relative;
+ padding: 12px;
+ background: white;
+ cursor: pointer;
+ transition: background 0.2s; }
+ .index .contact::after {
+ content: '';
+ position: absolute;
+ right: 16px;
+ bottom: 0;
+ height: 1px;
+ width: calc(100% - 12px - 54px - 2 * 8px - 16px);
+ background: #eee; }
+ .index .contact:hover {
+ background: #f8f8f8; }
+ .index .contact:last-child {
+ box-shadow: 0 1px 3px rgba(170, 170, 170, 0.8); }
+ .index .contact:last-child::after {
+ display: none; }
+ .index .contact-details {
+ vertical-align: top;
+ display: inline-block;
+ width: calc(100% - 54px - 2 * 12px - 8px);
+ margin: 4px 0 0 8px; }
+ .index .contact-name {
+ margin: 0;
+ font-size: 16px;
+ font-weight: 400; }
+ .index .last-message {
+ margin: 6px 0;
+ font-size: 14px;
+ font-weight: 300; }
+ .index .timestamp {
+ position: absolute;
+ top: 14px;
+ right: 12px;
+ color: #888; }
+ .index img {
+ height: 54px;
+ width: 54px;
+ box-sizing: border-box;
+ border: 27px #f3f3f3 solid;
+ border-radius: 27px; }
+ .index .message-list {
display: none; }
- .gutter .search {
- display: block; } }
-.gutter {
- width: 100%;
- float: left;
- border-right: 1px solid lightgray;
- position: relative;
- box-sizing: border-box;
- overflow: scroll;
- background-color: white;
- padding-bottom: 80px;
- z-index: 100; }
- .gutter .contact {
- cursor: pointer;
- float: left;
- width: 100%;
- border-bottom: 1px solid whitesmoke;
- color: #333; }
- .gutter .contact:hover {
- background-color: whitesmoke;
- margin-top: -1px;
- border-bottom: 1px solid lightgray;
- border-top: 1px solid lightgray; }
- .gutter .contact.active {
- background-color: #ecfcff;
- margin-top: -1px;
- border-bottom: 1px solid lightgray;
- border-top: 1px solid lightgray; }
- .gutter .contact .avatar {
- height: 42px;
- width: 42px;
- border-radius: 42px;
- cursor: pointer;
- display: inline-block;
- margin: 10px;
- margin-right: 14px;
- float: left;
- clear: both;
- background-color: whitesmoke; }
- .gutter .contact .contact-details {
- display: none; }
- .gutter .search {
- padding: 10px;
- border-bottom: 1px solid whitesmoke; }
- .gutter .search input[type=search] {
- box-sizing: border-box;
- font-size: 12px;
- outline: 0;
- width: 100%;
- margin: 0;
- letter-spacing: 0.25px;
- padding: 4px 8px;
- border: 1px solid lightgray; }
- .gutter .search.d6 {
- display: block; }
- .gutter .contact .avatar {
- height: 56px;
- width: 56px; }
- .gutter .contact .contact-details {
- display: block;
- position: relative;
- width: 156px;
- float: left;
- text-align: left; }
- .gutter .contact .contact-details h3 {
- font-size: 13px;
- margin-bottom: 4px; }
- .gutter .contact .contact-details .contact-name {
- width: 105px;
- white-space: nowrap;
- overflow: hidden;
- text-overflow: ellipsis; }
- .gutter .contact .contact-details .last-message {
- color: #999999;
- letter-spacing: 0.15px;
- -webkit-text-stroke: 0.2px;
- margin: 0;
- font-size: 12px;
- width: 150px;
- white-space: nowrap;
- overflow: hidden;
- text-overflow: ellipsis; }
- .gutter .contact .contact-details .last-timestamp {
- position: absolute;
- top: 14px;
- right: 8px;
- font-size: 12px;
- font-weight: 500;
- color: gray; }
-
-.conversation {
- margin-top: 10px;
- width: 100%;
- padding-right: 12px;
- box-sizing: border-box;
- display: block;
- margin-bottom: 10px;
- text-align: left; }
-
-ul.discussion {
- display: block;
- overflow: auto;
- padding: 0; }
-
-.entry {
- display: block;
- width: 100%;
- float: left;
- margin-bottom: 10px; }
- .entry .timestamp {
- font-size: 0.75em;
- display: block; }
- .entry .timestamp:incoming {
- color: gray; }
- .entry .timestamp:outgoing {
- color: whitesmoke; }
- .entry.delivered .timestamp::after {
- margin-left: 4px;
- content: "✓"; }
-
-.bubble {
- border-radius: 16px;
- padding: 12px;
- bottom: 10px;
- width: auto;
- background-color: whitesmoke; }
- .bubble:first-of-type {
- margin-top: 0; }
- .bubble ul, .bubble li {
- display: block;
- margin: 0;
- padding: 0; }
- .bubble .message {
- position: relative;
- font-size: 14px;
- -webkit-text-stroke: 0.35px; }
- .bubble.incoming {
- float: left;
- text-align: left;
- margin-left: 12px; }
- .bubble.sent {
- float: right;
- clear: right;
- text-align: right;
- background-color: #00badd;
- color: white; }
-
-.avatar img {
- max-width: 100%; }
-
-@media screen and (min-width: 320px) {
- .send-message-area {
- position: fixed;
- bottom: 0;
- background-color: whitesmoke;
- box-sizing: border-box;
- float: left;
- padding: 16px;
- width: 100%;
- border-top: 1px solid lightgray;
- right: 0; }
- .send-message-area .send-message {
- outline: 0;
- border: 0;
- width: 100%;
- padding: 0;
- resize: auto; }
-
- .message-composer {
- vertical-align: top;
- position: relative;
- background-color: white;
- margin-bottom: 20px;
- padding: 8px;
- border: 1px solid lightgray;
- font-size: 14px;
- color: gray;
- padding-bottom: 80px; }
- .message-composer .attachments {
- position: absolute;
- bottom: 0;
- color: lightgray;
- width: 64px;
- text-align: center;
- padding: 6px 4px 0 4px;
- margin-bottom: 10px;
- border-top: 1px solid lightgray; }
-
- .extension-details {
- font-size: 11px;
- color: #b9b9b9; }
- .extension-details a {
- color: gray;
- text-decoration: none; }
- .extension-details ul {
- padding: 0; }
- .extension-details li {
- display: inline-block; }
- .extension-details li:after {
- content: " • ";
- color: lightgray; }
- .extension-details li:last-of-type:after {
- content: none; } }
-@media screen and (min-width: 480px) {
- .send-message-area {
- padding-left: 258px; } }
-@media screen and (min-width: 822px) {
- .send-message-area {
- padding-right: 258px; } }
-
/*# sourceMappingURL=manifest.css.map */
diff --git a/stylesheets/manifest.css.map b/stylesheets/manifest.css.map
index 958ec1e97c4f..067760d59f80 100644
--- a/stylesheets/manifest.css.map
+++ b/stylesheets/manifest.css.map
@@ -1,7 +1,7 @@
{
"version": 3,
-"mappings": "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",
-"sources": ["settings/_reset.scss","context/_title_bar.scss","context/_notifications.scss","view/_search.scss","view/_gutter.scss","settings/_swatchbook.scss","view/_conversation.scss","view/_send_message_area.scss"],
+"mappings": "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",
+"sources": ["view/_conversation.scss","_variables.scss"],
"names": [],
"file": "manifest.css"
}
diff --git a/stylesheets/manifest.scss b/stylesheets/manifest.scss
index 31af3bf748fb..1c9eea5699a9 100644
--- a/stylesheets/manifest.scss
+++ b/stylesheets/manifest.scss
@@ -1,26 +1,15 @@
-// Signal for the Browser
+// Signal for the Browser
// A universally compatible extension
// Below is the ship's manifest
// Global Settings, Variables, and Mixins
-
- @import "settings/reset"; // set body style and resets
- @import "settings/swatchbook";
- @import "settings/breakpoints";
-
-// Provide some context
-
- @import "context/title_bar";
- @import "context/notifications";
+ @import 'variables';
// Build the main view
- @import "view/search";
- @import "view/gutter";
- @import "view/conversation";
- @import "view/send_message_area";
+ @import 'view/conversation';
// Not sure where something goes, or
// implementing a known CSS hack? Add it
// to `shame.scss`, and it will be fixed!
- @import "shame";
+ @import 'shame';
diff --git a/stylesheets/normalize.css b/stylesheets/normalize.css
deleted file mode 100644
index 73abb76fa418..000000000000
--- a/stylesheets/normalize.css
+++ /dev/null
@@ -1,375 +0,0 @@
-/*! normalize.css v2.0.1 | MIT License | git.io/normalize */
-
-/* ==========================================================================
- HTML5 display definitions
- ========================================================================== */
-
-/*
- * Corrects `block` display not defined in IE 8/9.
- */
-
-article,
-aside,
-details,
-figcaption,
-figure,
-footer,
-header,
-hgroup,
-nav,
-section,
-summary {
- display: block;
-}
-
-/*
- * Corrects `inline-block` display not defined in IE 8/9.
- */
-
-audio,
-canvas,
-video {
- display: inline-block;
-}
-
-/*
- * Prevents modern browsers from displaying `audio` without controls.
- * Remove excess height in iOS 5 devices.
- */
-
-audio:not([controls]) {
- display: none;
- height: 0;
-}
-
-/*
- * Addresses styling for `hidden` attribute not present in IE 8/9.
- */
-
-[hidden] {
- display: none;
-}
-
-/* ==========================================================================
- Base
- ========================================================================== */
-
-/*
- * 1. Sets default font family to sans-serif.
- * 2. Prevents iOS text size adjust after orientation change, without disabling
- * user zoom.
- */
-
-html {
- font-family: sans-serif; /* 1 */
- -webkit-text-size-adjust: 100%; /* 2 */
- -ms-text-size-adjust: 100%; /* 2 */
-}
-
-/*
- * Removes default margin.
- */
-
-body {
- margin: 0;
-}
-
-/* ==========================================================================
- Links
- ========================================================================== */
-
-/*
- * Addresses `outline` inconsistency between Chrome and other browsers.
- */
-
-a:focus {
- outline: thin dotted;
-}
-
-/*
- * Improves readability when focused and also mouse hovered in all browsers.
- */
-
-a:active,
-a:hover {
- outline: 0;
-}
-
-/* ==========================================================================
- Typography
- ========================================================================== */
-
-/*
- * Addresses `h1` font sizes within `section` and `article` in Firefox 4+,
- * Safari 5, and Chrome.
- */
-
-h1 {
- font-size: 2em;
-}
-
-/*
- * Addresses styling not present in IE 8/9, Safari 5, and Chrome.
- */
-
-abbr[title] {
- border-bottom: 1px dotted;
-}
-
-/*
- * Addresses style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
- */
-
-b,
-strong {
- font-weight: bold;
-}
-
-/*
- * Addresses styling not present in Safari 5 and Chrome.
- */
-
-dfn {
- font-style: italic;
-}
-
-/*
- * Addresses styling not present in IE 8/9.
- */
-
-mark {
- background: #ff0;
- color: #000;
-}
-
-
-/*
- * Corrects font family set oddly in Safari 5 and Chrome.
- */
-
-code,
-kbd,
-pre,
-samp {
- font-family: monospace, serif;
- font-size: 1em;
-}
-
-/*
- * Improves readability of pre-formatted text in all browsers.
- */
-
-pre {
- white-space: pre;
- white-space: pre-wrap;
- word-wrap: break-word;
-}
-
-/*
- * Sets consistent quote types.
- */
-
-q {
- quotes: "\201C" "\201D" "\2018" "\2019";
-}
-
-/*
- * Addresses inconsistent and variable font size in all browsers.
- */
-
-small {
- font-size: 80%;
-}
-
-/*
- * Prevents `sub` and `sup` affecting `line-height` in all browsers.
- */
-
-sub,
-sup {
- font-size: 75%;
- line-height: 0;
- position: relative;
- vertical-align: baseline;
-}
-
-sup {
- top: -0.5em;
-}
-
-sub {
- bottom: -0.25em;
-}
-
-/* ==========================================================================
- Embedded content
- ========================================================================== */
-
-/*
- * Removes border when inside `a` element in IE 8/9.
- */
-
-img {
- border: 0;
-}
-
-/*
- * Corrects overflow displayed oddly in IE 9.
- */
-
-svg:not(:root) {
- overflow: hidden;
-}
-
-/* ==========================================================================
- Figures
- ========================================================================== */
-
-/*
- * Addresses margin not present in IE 8/9 and Safari 5.
- */
-
-figure {
- margin: 0;
-}
-
-/* ==========================================================================
- Forms
- ========================================================================== */
-
-/*
- * Define consistent border, margin, and padding.
- */
-
-fieldset {
- border: 1px solid #c0c0c0;
- margin: 0 2px;
- padding: 0.35em 0.625em 0.75em;
-}
-
-/*
- * 1. Corrects color not being inherited in IE 8/9.
- * 2. Remove padding so people aren't caught out if they zero out fieldsets.
- */
-
-legend {
- border: 0; /* 1 */
- padding: 0; /* 2 */
-}
-
-/*
- * 1. Corrects font family not being inherited in all browsers.
- * 2. Corrects font size not being inherited in all browsers.
- * 3. Addresses margins set differently in Firefox 4+, Safari 5, and Chrome
- */
-
-button,
-input,
-select,
-textarea {
- font-family: inherit; /* 1 */
- font-size: 100%; /* 2 */
- margin: 0; /* 3 */
-}
-
-/*
- * Addresses Firefox 4+ setting `line-height` on `input` using `!important` in
- * the UA stylesheet.
- */
-
-button,
-input {
- line-height: normal;
-}
-
-/*
- * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
- * and `video` controls.
- * 2. Corrects inability to style clickable `input` types in iOS.
- * 3. Improves usability and consistency of cursor style between image-type
- * `input` and others.
- */
-
-button,
-html input[type="button"], /* 1 */
-input[type="reset"],
-input[type="submit"] {
- -webkit-appearance: button; /* 2 */
- cursor: pointer; /* 3 */
-}
-
-/*
- * Re-set default cursor for disabled elements.
- */
-
-button[disabled],
-input[disabled] {
- cursor: default;
-}
-
-/*
- * 1. Addresses box sizing set to `content-box` in IE 8/9.
- * 2. Removes excess padding in IE 8/9.
- */
-
-input[type="checkbox"],
-input[type="radio"] {
- box-sizing: border-box; /* 1 */
- padding: 0; /* 2 */
-}
-
-/*
- * 1. Addresses `appearance` set to `searchfield` in Safari 5 and Chrome.
- * 2. Addresses `box-sizing` set to `border-box` in Safari 5 and Chrome
- * (include `-moz` to future-proof).
- */
-
-input[type="search"] {
- -webkit-appearance: textfield; /* 1 */
- -moz-box-sizing: content-box;
- -webkit-box-sizing: content-box; /* 2 */
- box-sizing: content-box;
-}
-
-/*
- * Removes inner padding and search cancel button in Safari 5 and Chrome
- * on OS X.
- */
-
-input[type="search"]::-webkit-search-cancel-button,
-input[type="search"]::-webkit-search-decoration {
- -webkit-appearance: none;
-}
-
-/*
- * Removes inner padding and border in Firefox 4+.
- */
-
-button::-moz-focus-inner,
-input::-moz-focus-inner {
- border: 0;
- padding: 0;
-}
-
-/*
- * 1. Removes default vertical scrollbar in IE 8/9.
- * 2. Improves readability and alignment in all browsers.
- */
-
-textarea {
- overflow: auto; /* 1 */
- vertical-align: top; /* 2 */
-}
-
-/* ==========================================================================
- Tables
- ========================================================================== */
-
-/*
- * Remove most spacing between table cells.
- */
-
-table {
- border-collapse: collapse;
- border-spacing: 0;
-}
\ No newline at end of file
diff --git a/stylesheets/settings/_breakpoints.scss b/stylesheets/settings/_breakpoints.scss
deleted file mode 100644
index b45abd098568..000000000000
--- a/stylesheets/settings/_breakpoints.scss
+++ /dev/null
@@ -1,15 +0,0 @@
-/*
- * This is a series-d manifest file.
- *
- * Here, we import responsive variables specified elsewhere
- *
- */
-
-
-/* SERIES D SHAME + WIP */
-
- $D7: 'screen and (min-width: 320px)'; /* includes iPhone, */
- $D6: 'screen and (min-width: 480px)';
- $D5: 'screen and (min-width: 822px)';
- $D4: 'screen and (min-width: 1081px)';
- $D3: 'screen and (min-width:1441px)';
\ No newline at end of file
diff --git a/stylesheets/settings/_reset.scss b/stylesheets/settings/_reset.scss
deleted file mode 100644
index 48dda5a102ad..000000000000
--- a/stylesheets/settings/_reset.scss
+++ /dev/null
@@ -1,11 +0,0 @@
-body {
- font-family: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
- font-weight: normal;
- text-align: center;
- -webkit-font-smoothing: antialiased;
- -moz-font-smoothing: antialiased;
- -ms-font-smoothing: antialiased;
- -o-font-smoothing: antialiased;
- font-smoothing: antialiased;
- hanging-punctuation: first;
-}
\ No newline at end of file
diff --git a/stylesheets/settings/_swatchbook.scss b/stylesheets/settings/_swatchbook.scss
deleted file mode 100644
index 825a0caceae7..000000000000
--- a/stylesheets/settings/_swatchbook.scss
+++ /dev/null
@@ -1,3 +0,0 @@
-
-$blue:#00badd;
-$lightblue:lighten($blue, 53%);
\ No newline at end of file
diff --git a/stylesheets/view/_conversation.scss b/stylesheets/view/_conversation.scss
index a4b851939d41..20ea696de49e 100644
--- a/stylesheets/view/_conversation.scss
+++ b/stylesheets/view/_conversation.scss
@@ -1,82 +1,302 @@
-.conversation {
- margin-top:10px;
- width:100%;
- padding-right:12px;
- box-sizing: border-box;
- display: block;
- margin-bottom:10px;
- text-align: left;
+@import url(http://fonts.googleapis.com/css?family=Roboto:400,300,700);
+
+body, input {
+ font-family: $roboto;
}
-ul.discussion {
- display:block;
- overflow:auto;
- padding:0;
+body {
+ margin: 0;
}
-.entry {
- display:block;
- width:100%;
- float:left;
- margin-bottom:10px;
+.title-bar {
+ position: relative;
+ z-index: 1;
+ height: 36px;
+ line-height: 24px;
+ background: $blue;
+ box-shadow: 0 -4px 3px 4px rgba(darken($blue, 30%), 0.8);
+
+ button {
+ height: 36px;
+ line-height: 36px;
+ float: right;
+ margin-right: 8px;
+ padding: 0;
+ border: 0;
+ outline: 0;
+ font-size: 36px;
+ color: white;
+ background: transparent;
+ }
+}
+
+.fab {
+ z-index: 1;
+ position: fixed;
+ right: 16px;
+ bottom: 22px;
+ height: 60px;
+ width: 60px;
+ border: 0;
+ border-radius: (60px / 2);
+ outline: 0;
+ font: 300 36px $roboto;
+ color: white;
+ background: $blue;
+ box-shadow: 0 8px 8px -8px rgba(darken($blue, 50%), 0.8);
+ transition: box-shadow 0.33s, transform 0.33s, background 0.33s;
+
+ &:hover {
+ background: darken($blue, 3%);
+ box-shadow: 0 8px 18px -8px rgba(darken($blue, 50%), 0.9);
+ transform: translate3d(0, -1px, 0);
+ }
+}
+
+button {
+ cursor: pointer;
+}
+
+.timestamp {
+ font-size: 12px;
+}
+
+.message-list {
+ padding: 0;
+ list-style: none;
+ font-size: 16px;
+ font-weight: 300;
+
+ li {
+ margin: 0 8px 16px;
+
+ &::after {
+ visibility: hidden;
+ display: block;
+ font-size: 0;
+ content: " ";
+ clear: both;
+ height: 0;
+ }
+ }
+
+ p {
+ margin: 0;
+ }
+
+ .bubble {
+ position: relative;
+ left: -2px;
+ display: inline-block;
+ vertical-align: top;
+ max-width: calc(100% - 2 * 54px - 2 * 12px - 8px);
+ padding: 9px 12px;
+ border-radius: 4px;
+ box-shadow: 0 3px 3px -4px black;
+
+ &::before, &::after {
+ content: '';
+ position: absolute;
+ height: 0;
+ width: 0;
+ }
+
+ &::before {
+ top: (54px / 2) - 8px;
+ border-top: 8px solid transparent;
+ border-bottom: 8px solid transparent;
+ }
+
+ &::after {
+ top: (54px / 2) - 6px;
+ border-top: 6px solid transparent;
+ border-bottom: 6px solid transparent;
+ }
+ }
+
+ .incoming {
+ .bubble {
+ color: $grey_d;
+ background: $grey_l;
+
+ &::before {
+ left: -10px;
+ border-right: 10px solid white;
+ }
+
+ &::after {
+ left: -8px;
+ border-right: 8px solid $grey_l;
+ }
+ }
+ }
+
+ .outgoing {
+
+ img, .bubble {
+ float: right;
+ }
+
+ .bubble {
+ clear: left;
+ color: white;
+ background: $blue;
+
+ .timestamp {
+ color: $blue_l;
+ }
+
+ &::before {
+ right: -10px;
+ border-left: 10px solid white;
+ }
+
+ &::after {
+ right: -8px;
+ border-left: 8px solid $blue;
+ }
+ }
+ }
+
+
+ img {
+ height: 54px;
+ width: 54px;
+ // delete next 2 lines
+ box-sizing: border-box;
+ border: (54px / 2) $blue solid;
+ border-radius: (54px / 2);
+ }
.timestamp {
- font-size: 0.75em;
- display: block;
+ margin-top: 3px;
+ float: right;
+ }
+}
- &:incoming {
- color: gray;
- }
+.bottom-bar {
+ position: fixed;
+ bottom: 0;
+ height: 36px;
+ width: 100%;
+ border-top: 1px solid $grey_l;
+ background: white;
- &:outgoing {
- color: whitesmoke;
- }
+ button, input {
+ color: $grey_d;
}
- &.delivered .timestamp {
+ button {
+ position: absolute;
+ top: 0;
+ height: 100%;
+ width: 36px;
+ padding: 0;
+ border: 0;
+ outline: 0;
+ font-size: 24px;
+ background: transparent;
+ }
+
+ .attachments-btn {
+ left: 0;
+ }
+
+ .send-btn {
+ right: 0;
+ }
+
+ form, input {
+ height: 100%;
+ width: 100%;
+ }
+
+ input {
+ height: 100%;
+ width: 100%;
+ box-sizing: border-box;
+ padding: 0 36px;
+ border: 0;
+ outline: 0;
+ font-size: 16px;
+ background: white;
+ }
+}
+
+// conversation list part
+.index {
+ color: $grey_d;
+ background: #eee;
+
+ .contact {
+ position: relative;
+ padding: 12px;
+ background: white;
+ cursor: pointer;
+ transition: background 0.2s;
+
&::after {
- margin-left: 4px;
- content: "✓";
+ content: '';
+ position: absolute;
+ right: 16px;
+ bottom: 0;
+ height: 1px;
+ width: calc(100% - 12px - 54px - 2 * 8px - 16px);
+ background: #eee;
+ }
+
+ &:hover {
+ background: #f8f8f8;
+ }
+
+ &:last-child {
+ box-shadow: 0 1px 3px rgba(#aaa, 0.8);
+
+ &::after {
+ display: none;
+ }
}
}
-}
-.bubble {
- //position:relative;
- border-radius:16px;
- padding:12px;
- bottom:10px;
- width:auto;
- background-color:whitesmoke;
- &:first-of-type {
- margin-top: 0;
+ .contact-details {
+ vertical-align: top;
+ display: inline-block;
+ width: calc(100% - 54px - 2 * 12px - 8px);
+ margin: 4px 0 0 8px;
+ }
+
+ .contact-name {
+ margin: 0;
+ font-size: 16px;
+ font-weight: 400;
+ }
+
+ .last-message {
+ margin: 6px 0;
+ font-size: 14px;
+ font-weight: 300;
+ }
+
+ .timestamp {
+ position: absolute;
+ top: 14px;
+ right: 12px;
+ color: #888;
+ }
+
+ img {
+ height: 54px;
+ width: 54px;
+ // delete next 2 lines
+ box-sizing: border-box;
+ border: (54px / 2) $grey_l solid;
+ border-radius: (54px / 2);
+ }
+
+ // TODO: RJS
+ // SHAAAAAAME!!!!
+ .message-list {
+ display: none;
}
- ul, li {
- display:block;
- margin:0;
- padding:0;
- }
- .message {
- position:relative;
- font-size:14px;
- -webkit-text-stroke: 0.35px;
- }
- &.incoming {
- float:left;
- text-align: left;
- margin-left:12px;
- }
- &.sent {
- float:right;
- clear:right;
- text-align: right;
- background-color:#00badd;
- color:white;
- }
- &.sent .volley {
- }
-}
-.avatar img {
- max-width: 100%;
}
diff --git a/stylesheets/view/_gutter.scss b/stylesheets/view/_gutter.scss
deleted file mode 100644
index bc0cd911cd67..000000000000
--- a/stylesheets/view/_gutter.scss
+++ /dev/null
@@ -1,107 +0,0 @@
-.gutter {
- width:100%;
- float:left;
- border-right:1px solid lightgray;
- position:relative;
- box-sizing: border-box;
- overflow: scroll;
- background-color:white;
- padding-bottom:80px;
-
- .contact {
- cursor:pointer;
- float:left;
- width:100%;
- border-bottom:1px solid whitesmoke;
- color:#333;
- &:hover {
- background-color:whitesmoke;
- margin-top:-1px;
- border-bottom:1px solid lightgray;
- border-top:1px solid lightgray;
- }
- &.active {
- background-color:$lightblue;
- margin-top:-1px;
- border-bottom:1px solid lightgray;
- border-top:1px solid lightgray;
- }
- .avatar {
- height:42px;
- width:42px;
- border-radius:42px;
- cursor:pointer;
- display:inline-block;
- margin:10px;
- margin-right:14px;
- float:left;
- clear:both;
- background-color:whitesmoke;
- }
- .contact-details {
- display:none;
- }
- }
-
- z-index:100;
- .search {
- padding:10px;
- border-bottom:1px solid whitesmoke;
- input[type=search] {
- box-sizing: border-box;
- font-size:12px;
- outline:0;
- width:100%;
- margin:0;
- letter-spacing: 0.25px;
- padding:4px 8px;
- border:1px solid lightgray;
- }
- &.d6 {
- display:block;
- }
- }
- .contact {
- .avatar {
- height:56px;
- width:56px;
- }
- .contact-details {
- display:block;
- position:relative;
- width:156px;
- float:left;
- text-align: left;
- h3 {
- font-size:13px;
- margin-bottom:4px;
- }
- .contact-name {
- width: 105px;
- white-space: nowrap;
- overflow: hidden;
- text-overflow: ellipsis;
- }
- .last-message {
- color:lighten(#333, 40%);
- letter-spacing:0.15px;
- -webkit-text-stroke: 0.2px;
- margin:0;
- font-size: 12px;
- width: 150px;
- white-space: nowrap;
- overflow: hidden;
- text-overflow: ellipsis;
- }
- .last-timestamp {
- position:absolute;
- top:14px;
- right:8px;
- font-size:12px;
- font-weight: 500;
- color:gray;
- }
- }
- }
-
-}
\ No newline at end of file
diff --git a/stylesheets/view/_search.scss b/stylesheets/view/_search.scss
deleted file mode 100644
index 846ff454579e..000000000000
--- a/stylesheets/view/_search.scss
+++ /dev/null
@@ -1,28 +0,0 @@
-@media #{$D7} {
- .search {
- padding:10px;
- border-bottom:1px solid whitesmoke;
- input[type=search] {
- box-sizing: border-box;
- font-size:12px;
- outline:0;
- width:100%;
- margin:0;
- letter-spacing: 0.25px;
- padding:4px 8px;
- border:1px solid lightgray;
- }
- }
- .gutter .search {
- display:none;
- }
-}
-
-@media #{$D6} {
- .search {
- display:none;
- }
- .gutter .search {
- display:block;
- }
-}
\ No newline at end of file
diff --git a/stylesheets/view/_send_message_area.scss b/stylesheets/view/_send_message_area.scss
deleted file mode 100644
index c36c90e5366a..000000000000
--- a/stylesheets/view/_send_message_area.scss
+++ /dev/null
@@ -1,77 +0,0 @@
-@media #{$D7} {
- .send-message-area {
- position:fixed;
- bottom:0;
- background-color:whitesmoke;
- box-sizing: border-box;
- float:left;
- padding:16px;
- width:100%;
- border-top:1px solid lightgray;
- right:0;
- .send-message {
- outline:0;
- border:0;
- width:100%;
- padding:0;
- resize:auto;
- }
- }
-
- .message-composer {
- vertical-align: top;
- position:relative;
- background-color:white;
- margin-bottom:20px;
- padding:8px;
- border:1px solid lightgray;
- font-size:14px;
- color:gray;
- padding-bottom:80px;
- .attachments {
- position:absolute;
- bottom:0;
- color:lightgray;
- width:64px;
- text-align: center;
- padding:6px 4px 0 4px;
- margin-bottom:10px;
- border-top:1px solid lightgray;
- }
- }
-
- .extension-details {
- font-size:11px;
- color:darken(lightgray, 10%);
- a {
- color:gray;
- text-decoration: none;
- }
- ul {
- padding:0;
- }
- li {
- display:inline-block;
- &:after {
- content:" • ";
- color:lightgray;
- }
- &:last-of-type:after {
- content:none;
- }
- }
- }
-}
-
-@media #{$D6} {
- .send-message-area {
- padding-left:258px;
- }
-}
-
-@media #{$D5} {
- .send-message-area {
- padding-right:258px;
- }
-
-}