Matrix-Mirrors/schildi-web
1
0
Fork 0
mirror of https://github.com/SchildiChat/element-web.git synced 2024-10-01 01:26:12 -04:00
Code Issues Packages Projects Releases Wiki Activity

RTE format bar enhancements

Browse Source
This commit is contained in:
Aviral Dasgupta 2016-09-07 22:52:37 +05:30
parent d6a324ede7
commit 22bf6e7969
6 changed files with 118 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/skins/vector/css/matrix-react-sdk/views/elements/RichText.css
View File

@ -20,3 +20,16 @@
.mx_Markdown_ITALIC { .mx_Markdown_ITALIC {
font-style: italic; font-style: italic;
} }
.mx_Markdown_CODE {
padding: .2em 0;
margin: 0;
font-size: 85%;
background-color: rgba(0,0,0,.04);
border-radius: 3px;
}
.mx_Markdown_HR {
color: rgba(0, 0, 0, 0.5);
text-decoration: #e7e7e7 double line-through;
}

23
src/skins/vector/css/matrix-react-sdk/views/rooms/MessageComposer.css
View File

@ -60,6 +60,7 @@ limitations under the License.
display: flex; display: flex;
flex-direction: column; flex-direction: column;
min-height: 60px; min-height: 60px;
justify-content: center;
align-items: flex-start; align-items: flex-start;
font-size: 14px; font-size: 14px;
margin-right: 6px; margin-right: 6px;
@ -138,19 +139,26 @@ limitations under the License.
margin: 0 11px; margin: 0 11px;
} }
.mx_MessageComposer_formatbar { .mx_MessageComposer_formatbar_wrapper {
display: flex;
height: 30px;
width: 100%; width: 100%;
background-color: #f7f7f7; background-color: #f7f7f7;
box-shadow: inset 0 1px 0 0 rgba(0, 0, 0, 0.08); box-shadow: inset 0 1px 0 0 rgba(0, 0, 0, 0.08);
}
.mx_MessageComposer_formatbar {
margin: auto;
max-width: 960px;
display: flex;
height: 30px;
box-sizing: border-box; box-sizing: border-box;
padding-left: 62px; padding-left: 62px;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
font-size: 10px;
color: #888;
} }
.mx_MessageComposer_formatbar * { .mx_MessageComposer_formatbar * {
@ -163,6 +171,11 @@ limitations under the License.
cursor: pointer; cursor: pointer;
} }
.mx_MessageComposer_format_button_disabled {
cursor: not-allowed;
opacity: 0.5;
}
.mx_MessageComposer_formatbar_cancel { .mx_MessageComposer_formatbar_cancel {
margin-right: 22px; margin-right: 22px;
} }
@ -172,6 +185,8 @@ limitations under the License.
} }
.mx_MessageComposer_input_markdownIndicator { .mx_MessageComposer_input_markdownIndicator {
cursor: pointer;
height: 10px;
padding: 4px 4px 4px 0; padding: 4px 4px 4px 0;
opacity: 0.8; opacity: 0.8;
} }

25
src/skins/vector/img/button-text-code-o-n.svg Normal file
View File

@ -0,0 +1,25 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="28px" height="16px" viewBox="0 0 28 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 39.1 (31720) - http://www.bohemiancoding.com/sketch -->
<title>B76754AB-42E6-48D2-9443-80CBC0DE02ED</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="02_x-Chat-text-input-markdown-panel-MD_off-BUTTONS-ON" transform="translate(-422.000000, -745.000000)">
<g id="format-buttons-A-Copy" transform="translate(294.000000, 745.000000)">
<g id="button_text_code_ON" transform="translate(128.000000, 0.000000)">
<rect id="Rectangle-108" fill="#4A4A4A" x="0" y="0" width="28" height="16" rx="8"></rect>
<polygon id="/" fill="#FFFFFF" points="15.9262695 4.14746094 12.9990234 12 12.1074219 12 15.034668 4.14746094"></polygon>
<g id="Group-5" opacity="0.5" transform="translate(17.000000, 5.000000)" stroke="#FFFFFF" stroke-linecap="round">
<path d="M0.5,0.5 L2.97487373,2.97487373" id="Line"></path>
<path d="M0.5,3.02512627 L2.97487373,5.5" id="Line-Copy-4" transform="translate(1.737437, 4.262563) scale(1, -1) translate(-1.737437, -4.262563) "></path>
</g>
<g id="Group-5-Copy" opacity="0.5" transform="translate(9.500000, 8.000000) scale(-1, 1) translate(-9.500000, -8.000000) translate(8.000000, 5.000000)" stroke="#FFFFFF" stroke-linecap="round">
<path d="M0.5,0.5 L2.97487373,2.97487373" id="Line"></path>
<path d="M0.5,3.02512627 L2.97487373,5.5" id="Line-Copy-4" transform="translate(1.737437, 4.262563) scale(1, -1) translate(-1.737437, -4.262563) "></path>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.0 KiB

25
src/skins/vector/img/button-text-code.svg Normal file
View File

@ -0,0 +1,25 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="28px" height="16px" viewBox="0 0 28 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 39.1 (31720) - http://www.bohemiancoding.com/sketch -->
<title>4CAFF494-61AE-4916-AFE8-D1E62F7CF0DE</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="02_x-Chat-text-input-markdown-panel-MD_on" transform="translate(-422.000000, -745.000000)">
<g id="format-buttons-A-Copy" transform="translate(294.000000, 745.000000)">
<g id="button_text_code" transform="translate(128.000000, 0.000000)">
<rect id="Rectangle-108" fill-opacity="0.1" fill="#000000" x="0" y="0" width="28" height="16" rx="8"></rect>
<polygon id="/" fill-opacity="0.7" fill="#000000" points="15.9262695 4.14746094 12.9990234 12 12.1074219 12 15.034668 4.14746094"></polygon>
<g id="Group-5" opacity="0.5" transform="translate(17.000000, 5.000000)" stroke="#4A4A4A" stroke-linecap="round">
<path d="M0.5,0.5 L2.97487373,2.97487373" id="Line"></path>
<path d="M0.5,3.02512627 L2.97487373,5.5" id="Line-Copy-4" transform="translate(1.737437, 4.262563) scale(1, -1) translate(-1.737437, -4.262563) "></path>
</g>
<g id="Group-5-Copy" opacity="0.5" transform="translate(9.500000, 8.000000) scale(-1, 1) translate(-9.500000, -8.000000) translate(8.000000, 5.000000)" stroke="#4A4A4A" stroke-linecap="round">
<path d="M0.5,0.5 L2.97487373,2.97487373" id="Line"></path>
<path d="M0.5,3.02512627 L2.97487373,5.5" id="Line-Copy-4" transform="translate(1.737437, 4.262563) scale(1, -1) translate(-1.737437, -4.262563) "></path>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.0 KiB

18
src/skins/vector/img/button-text-underline-o-n.svg Normal file
View File

@ -0,0 +1,18 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="28px" height="16px" viewBox="0 0 28 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 39.1 (31720) - http://www.bohemiancoding.com/sketch -->
<title>FD84FF7C-43E4-4312-90AB-5A59AD018377</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="02_x-Chat-text-input-markdown-panel-MD_off-BUTTONS-ON" transform="translate(-390.000000, -745.000000)">
<g id="format-buttons-A-Copy" transform="translate(294.000000, 745.000000)">
<g id="button_text_underline_ON" transform="translate(96.000000, 0.000000)">
<rect id="Rectangle-108" fill="#4A4A4A" x="0" y="0" width="28" height="16" rx="8"></rect>
<path d="M17.0092773,4.14746094 L17.0092773,9.22851562 C17.0092773,10.1237024 16.738935,10.8273086 16.1982422,11.3393555 C15.6575494,11.8514023 14.9145555,12.1074219 13.9692383,12.1074219 C13.0239211,12.1074219 12.2925644,11.849612 11.7751465,11.3339844 C11.2577285,10.8183568 10.9990234,10.1093795 10.9990234,9.20703125 L10.9990234,4.14746094 L11.9121094,4.14746094 L11.9121094,9.27148438 C11.9121094,9.92676109 12.091144,10.4298485 12.4492188,10.7807617 C12.8072935,11.1316749 13.3336554,11.3071289 14.0283203,11.3071289 C14.6907585,11.3071289 15.2010073,11.1307798 15.559082,10.7780762 C15.9171567,10.4253726 16.0961914,9.91959965 16.0961914,9.26074219 L16.0961914,4.14746094 L17.0092773,4.14746094 Z" id="U" fill="#FFFFFF"></path>
<path d="M9.5,13.5 L18.7195444,13.5" id="Line" stroke="#4A4A4A" stroke-linecap="round" opacity="0.5" transform="translate(14.109772, 13.500000) scale(1, -1) translate(-14.109772, -13.500000) "></path>
</g>
</g>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.9 KiB

18
src/skins/vector/img/button-text-underline.svg Normal file
View File

@ -0,0 +1,18 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="28px" height="16px" viewBox="0 0 28 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 39.1 (31720) - http://www.bohemiancoding.com/sketch -->
<title>13E7EE68-9B16-4A3D-8F9F-31E4BAB7E438</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="02_x-Chat-text-input-markdown-panel-MD_on" transform="translate(-390.000000, -745.000000)">
<g id="format-buttons-A-Copy" transform="translate(294.000000, 745.000000)">
<g id="button_text_underline" transform="translate(96.000000, 0.000000)">
<rect id="Rectangle-108" fill-opacity="0.1" fill="#000000" x="0" y="0" width="28" height="16" rx="8"></rect>
<path d="M17.0092773,4.14746094 L17.0092773,9.22851562 C17.0092773,10.1237024 16.738935,10.8273086 16.1982422,11.3393555 C15.6575494,11.8514023 14.9145555,12.1074219 13.9692383,12.1074219 C13.0239211,12.1074219 12.2925644,11.849612 11.7751465,11.3339844 C11.2577285,10.8183568 10.9990234,10.1093795 10.9990234,9.20703125 L10.9990234,4.14746094 L11.9121094,4.14746094 L11.9121094,9.27148438 C11.9121094,9.92676109 12.091144,10.4298485 12.4492188,10.7807617 C12.8072935,11.1316749 13.3336554,11.3071289 14.0283203,11.3071289 C14.6907585,11.3071289 15.2010073,11.1307798 15.559082,10.7780762 C15.9171567,10.4253726 16.0961914,9.91959965 16.0961914,9.26074219 L16.0961914,4.14746094 L17.0092773,4.14746094 Z" id="U" fill-opacity="0.7" fill="#000000"></path>
<path d="M9.5,13.5 L18.7195444,13.5" id="Line" stroke="#4A4A4A" stroke-linecap="round" opacity="0.5" transform="translate(14.109772, 13.500000) scale(1, -1) translate(-14.109772, -13.500000) "></path>
</g>
</g>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.9 KiB