Merge pull request #1553 from aviraldg/feature-rte

Rich Text Editor
This commit is contained in:
David Baker 2016-06-14 15:27:35 +01:00 committed by GitHub
commit e507339324
4 changed files with 44 additions and 10 deletions

View File

@ -35,6 +35,7 @@
"babel-polyfill": "^6.5.0", "babel-polyfill": "^6.5.0",
"browser-request": "^0.3.3", "browser-request": "^0.3.3",
"classnames": "^2.1.2", "classnames": "^2.1.2",
"draft-js": "^0.7.0",
"extract-text-webpack-plugin": "^0.9.1", "extract-text-webpack-plugin": "^0.9.1",
"filesize": "^3.1.2", "filesize": "^3.1.2",
"flux": "~2.0.3", "flux": "~2.0.3",

View File

@ -0,0 +1,22 @@
.mx_UserPill {
color: white;
background-color: #76cfa6;
padding: 2px 8px;
border-radius: 16px;
}
.mx_RoomPill {
background-color: white;
color: #76cfa6;
border: 1px solid #76cfa6;
padding: 2px 8px;
border-radius: 16px;
}
.mx_Markdown_BOLD {
font-weight: bold;
}
.mx_Markdown_ITALIC {
font-style: italic;
}

View File

@ -22,15 +22,15 @@ limitations under the License.
} }
.mx_MessageComposer_row { .mx_MessageComposer_row {
display: table-row; display: flex;
flex-direction: row;
align-items: center;
width: 100%; width: 100%;
} }
.mx_MessageComposer .mx_MessageComposer_avatar { .mx_MessageComposer .mx_MessageComposer_avatar {
display: table-cell;
padding-left: 10px; padding-left: 10px;
padding-right: 28px; padding-right: 28px;
vertical-align: middle;
} }
.mx_MessageComposer .mx_MessageComposer_avatar .mx_BaseAvatar { .mx_MessageComposer .mx_MessageComposer_avatar .mx_BaseAvatar {
@ -42,9 +42,7 @@ limitations under the License.
} }
.mx_MessageComposer_noperm_error { .mx_MessageComposer_noperm_error {
display: table-cell;
width: 100%; width: 100%;
vertical-align: middle;
height: 60px; height: 60px;
text-align: center; text-align: center;
font-style: italic; font-style: italic;
@ -52,10 +50,22 @@ limitations under the License.
} }
.mx_MessageComposer_input { .mx_MessageComposer_input {
display: table-cell; flex: 1;
width: 100%;
vertical-align: middle; vertical-align: middle;
height: 60px; min-height: 60px;
max-height: 120px;
display: flex;
align-items: center;
overflow: auto;
transition: 0.6s border-top ease;
border-top: 2px solid rgba(255, 255, 255, 0);
}
.mx_MessageComposer_input_rte {
border-top: 2px solid #76cfa6; /* placeholder RTE indicator */
}
.mx_MessageComposer_input .DraftEditor-root {
flex: 1;
} }
.mx_MessageComposer_input textarea { .mx_MessageComposer_input textarea {
@ -92,8 +102,8 @@ limitations under the License.
.mx_MessageComposer_hangup, .mx_MessageComposer_hangup,
.mx_MessageComposer_voicecall, .mx_MessageComposer_voicecall,
.mx_MessageComposer_videocall { .mx_MessageComposer_videocall {
display: table-cell; /*display: table-cell;*/
vertical-align: middle; /*vertical-align: middle;*/
padding-left: 10px; padding-left: 10px;
padding-right: 10px; padding-right: 10px;
cursor: pointer; cursor: pointer;

View File

@ -26,6 +26,7 @@ require('../../vector/components.css');
require('gemini-scrollbar/gemini-scrollbar.css'); require('gemini-scrollbar/gemini-scrollbar.css');
require('gfm.css/gfm.css'); require('gfm.css/gfm.css');
require('highlight.js/styles/github.css'); require('highlight.js/styles/github.css');
require('draft-js/dist/Draft.css');
// add React and ReactPerf to the global namespace, to make them easier to // add React and ReactPerf to the global namespace, to make them easier to