Skip to content
Snippets Groups Projects
Commit 8ac9e853 authored by Ming Rui Zhang's avatar Ming Rui Zhang
Browse files

chatview: use new icons 

Change-Id: If11b92e377b539bd2a8116be5bccb534efc39b7b
parent ec05157f
Branches
No related tags found
No related merge requests found
Show whitespace changes
Inline Side-by-side
src/web-chatview/chatview-qt.css
+ 0
− 1
View file @ 8ac9e853
......@@ -16,7 +16,6 @@
--textarea-max-height: 150px;
--placeholder-text-color: #d3d3d3;
/* button properties */
--action-icon-color: var(--jami-dark-blue);
--deactivated-icon-color: #bebebe;
--action-icon-hover-color: #ededed;
--action-critical-icon-hover-color: rgba(211, 77, 59, 0.3); /* complementary color of jami light blue */
......
src/web-chatview/chatview.css
+ 2
− 3
View file @ 8ac9e853
......@@ -31,7 +31,6 @@
--placeholder-text-color: #d3d3d3;
/* button properties */
--action-icon-color: var(--jami-dark-blue);
--deactivated-icon-color: #BEBEBE;
--action-icon-hover-color: var(--jami-light-blue);
--action-critical-icon-hover-color: rgba(211, 77, 59, 0.3); /* complementary color of ring light blue */
......@@ -156,11 +155,11 @@ body {
}
.action-button svg {
fill: var(--action-icon-color);
filter: invert(var(--svg-invert-percentage));
}
.action-button.deactivated svg {
fill: var(--deactivated-icon-color);
filter: invert(50%);
}
.message_out .filesvg {
......
src/web-chatview/chatview.html
+ 37
− 14
View file @ 8ac9e853
......@@ -96,15 +96,19 @@
<div id="typing_indicator_container"></div>
<div id="back_to_bottom_button_container">
<div id="back_to_bottom_button" onclick="back_to_bottom()">Jump to latest &#9660;
</div>
<div id="back_to_bottom_button" onclick="back_to_bottom()">Jump to latest &#9660;</div>
</div>
<div id="send_inteface_container" onresize="updateBackToBottomContainer()">
<div id="sendMessage">
<div id="sendFileButton" class="nav-button action-button" onclick="selectFileToSend()">
<svg class="svgicon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path d="M16.5 6v11.5c0 2.21-1.79 4-4 4s-4-1.79-4-4V5c0-1.38 1.12-2.5 2.5-2.5s2.5 1.12 2.5 2.5v10.5c0 .55-.45 1-1 1s-1-.45-1-1V6H10v9.5c0 1.38 1.12 2.5 2.5 2.5s2.5-1.12 2.5-2.5V5c0-2.21-1.79-4-4-4S7 2.79 7 5v12.5c0 3.04 2.46 5.5 5.5 5.5s5.5-2.46 5.5-5.5V6h-1.5z" />
<path d="M0 0h24v24H0z" fill="none" />
<svg class="svgicon" width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="Icones" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Link_Black_24dp" fill="#000000" fill-rule="nonzero" stroke="#000000" stroke-width="0.9">
<g transform="translate(6.981262, 2.084524)" id="Path">
<path d="M4.58333333,20 C2.05607096,20 0,17.943929 0,15.4166667 L0,3.33333333 C0,1.49536133 1.49536133,0 3.33333333,0 C5.17130533,0 6.66666667,1.49536133 6.66666667,3.33333333 L6.66666667,14.1666667 C6.66666667,15.3153483 5.73201496,16.25 4.58333333,16.25 C3.43465171,16.25 2.5,15.3153483 2.5,14.1666667 L2.5,4.56075033 C2.5,4.33064779 2.68636067,4.14408367 2.91666667,4.14408367 C3.14697267,4.14408367 3.33333333,4.33064779 3.33333333,4.56075033 L3.33333333,14.1666667 C3.33333333,14.855957 3.89404296,15.4166667 4.58333333,15.4166667 C5.27262371,15.4166667 5.83333333,14.855957 5.83333333,14.1666667 L5.83333333,3.33333333 C5.83333333,1.95475258 4.71191404,0.833333333 3.33333333,0.833333333 C1.95475262,0.833333333 0.833333333,1.95475263 0.833333333,3.33333333 L0.833333333,15.4166667 C0.833333333,17.4843343 2.51546225,19.1666667 4.58333333,19.1666667 C6.65120442,19.1666667 8.33333333,17.4843343 8.33333333,15.4166667 L8.33333333,4.04276529 C8.33333333,3.81266275 8.519694,3.62609863 8.75,3.62609863 C8.980306,3.62609863 9.16666667,3.81266275 9.16666667,4.04276529 L9.16666667,15.4166667 C9.16666667,17.943929 7.11059571,20 4.58333333,20 Z"></path>
</g>
</g>
</g>
</svg>
</div>
<div id="emojiButton" class=" action-button nav-button">
......@@ -115,23 +119,42 @@
</svg>
</div>
<div id="audioRecordButton" class="action-button nav-button" onclick="audioRecord()">
<svg class="svgicon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path d="M 4 2 C 2.9 2 2 2.9 2 4 L 2 22 L 6 18 L 20 18 C 21.1 18 22 17.1 22 16 L 22 4 C 22 2.9 21.1 2 20 2 L 4 2 z M 11.765625 3.9160156 C 12.508867 3.8551642 13.272016 4.2527996 13.636719 5.0410156 C 13.767503 5.3236557 13.771484 5.4322983 13.771484 7.6992188 C 13.771484 10.028985 13.770647 10.067925 13.625 10.363281 C 13.179285 11.267942 12.168586 11.679676 11.216797 11.34375 C 10.81743 11.202796 10.295752 10.671154 10.15625 10.261719 C 10.06289 9.987737 10.048828 9.6285584 10.048828 7.6992188 C 10.048828 5.1451299 10.0615 5.0663092 10.539062 4.5351562 C 10.881846 4.1538981 11.31968 3.9525265 11.765625 3.9160156 z M 7.4550781 9.6015625 L 8.5390625 9.6015625 C 8.5390625 11.512087 10.156379 12.849609 11.914062 12.849609 C 13.671745 12.849609 15.289062 11.512087 15.289062 9.6015625 L 16.371094 9.6015625 C 16.371094 11.779558 14.639627 13.575172 12.550781 13.880859 L 12.550781 15.970703 L 11.277344 15.970703 L 11.277344 13.880859 C 9.1884992 13.568806 7.4550781 11.773189 7.4550781 9.6015625 z "/>
<path d="M0 0h24v24H0z" fill="none"/>
<svg class="svgicon" width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="Icones_Fill" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Message-audio">
<path d="M12,2 C17.5228475,2 22,6.4771525 22,12 L22,22 L22,22 L12,22 C6.4771525,22 2,17.5228475 2,12 C2,6.4771525 6.4771525,2 12,2 Z" id="Rectangle-Copy-3" fill="#000000"></path>
<g id="Group" transform="translate(9.000000, 7.000000)" fill="#FFFFFF" fill-rule="nonzero">
<path d="M3.2826376,0.0495376956 C2.15075637,0.0495376956 1.23099067,0.969303261 1.23099067,2.10118448 L1.23099067,5.11026918 C1.23099067,6.24214903 2.15075637,7.16191596 3.2826376,7.16191596 C4.41451882,7.16191596 5.33428439,6.24214903 5.33428439,5.11026918 L5.33428439,2.10118448 C5.33428439,0.969303261 4.41451882,0.0495376956 3.2826376,0.0495376956 L3.2826376,0.0495376956 Z" id="Shape"></path>
<path d="M0.277829768,3.46892297 C0.131747046,3.46666758 -0.00228293577,3.60069619 -2.62151977e-05,3.74677891 L-2.62151977e-05,5.1145366 C-2.62151977e-05,6.83681201 1.32262269,8.24623865 3.00908469,8.38435551 L3.00908469,9.35033921 L1.91487307,9.35033921 C1.76379391,9.35033921 1.64132017,9.47280884 1.64132017,9.62389211 C1.64132017,9.77497538 1.76379391,9.89744502 1.91487307,9.89744502 L4.65040212,9.89744502 C4.80148129,9.89744502 4.92395503,9.77497538 4.92395503,9.62389211 C4.92395503,9.47280884 4.80148129,9.35064011 4.65040212,9.35033921 L3.5561905,9.35033921 L3.5561905,8.38435551 C5.24265237,8.24623865 6.56529592,6.83681201 6.56529592,5.1145366 L6.56529592,3.74677891 C6.56731043,3.60225818 6.43625533,3.46933062 6.29171955,3.46933062 C6.14718377,3.46933062 6.01612321,3.60225818 6.01816665,3.74677891 L6.01816665,5.1145366 C6.01816665,6.63475216 4.80285179,7.85006565 3.2826376,7.85006565 C1.76242204,7.85006565 0.547108409,6.63475216 0.547108409,5.1145366 L0.547108409,3.74677891 C0.549351543,3.60354661 0.421062069,3.47118667 0.277829768,3.46892297 Z" id="Path"></path>
</g>
</g>
</g>
</svg>
</div>
<div id="videoRecordButton" class="nav-button action-button" onclick="videoRecord()">
<svg class="svgicon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path d="M 4 2 C 2.9 2 2 2.9 2 4 L 2 22 L 6 18 L 20 18 C 21.1 18 22 17.1 22 16 L 22 4 C 22 2.9 21.1 2 20 2 L 4 2 z M 7.3066406 6.2734375 L 14.75 6.2734375 C 15.091141 6.2734375 15.371094 6.5533905 15.371094 6.8945312 L 15.371094 9.0644531 L 17.851562 6.5839844 L 17.851562 13.40625 L 15.371094 10.925781 L 15.371094 13.097656 C 15.371094 13.438797 15.091141 13.716797 14.75 13.716797 L 7.3066406 13.716797 C 6.9654996 13.716797 6.6875 13.438797 6.6875 13.097656 L 6.6875 6.8945312 C 6.6875 6.5533905 6.9654996 6.2734375 7.3066406 6.2734375 z "/>
<path d="M0 0h24v24H0z" fill="none"/>
<svg class="svgicon" width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="Icones_Fill" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Message-video">
<path d="M12,2 C17.5228475,2 22,6.4771525 22,12 L22,22 L22,22 L12,22 C6.4771525,22 2,17.5228475 2,12 C2,6.4771525 6.4771525,2 12,2 Z" id="Rectangle-Copy-3" fill="#000000"></path>
<g id="noun_Camera_2292906" transform="translate(7.000000, 8.000000)" fill="#FFFFFF" fill-rule="nonzero">
<path d="M8.92857143,0.992063492 L7.25198413,0.992063492 L6.88988095,0.27281746 C6.80555556,0.104166667 6.63690476,0 6.4484127,0 L3.47222222,0 C3.28373016,0 3.11011905,0.104166667 3.03075397,0.27281746 L2.66865079,0.992063492 L0.992063492,0.992063492 C0.446428571,0.992063492 0,1.43849206 0,1.98412698 L0,6.94444444 C0,7.49007937 0.446428571,7.93650794 0.992063492,7.93650794 L8.92857143,7.93650794 C9.47420635,7.93650794 9.92063492,7.49007937 9.92063492,6.94444444 L9.92063492,1.98412698 C9.92063492,1.43849206 9.47420635,0.992063492 8.92857143,0.992063492 Z M2.97619048,4.46428571 C2.97619048,3.36805556 3.8640873,2.48015873 4.96031746,2.48015873 C6.05654762,2.48015873 6.94444444,3.36805556 6.94444444,4.46428571 C6.94444444,5.56051587 6.05654762,6.4484127 4.96031746,6.4484127 C3.8640873,6.4484127 2.97619048,5.56051587 2.97619048,4.46428571 Z" id="Shape"></path>
<path d="M5.95238095,4.46428571 C5.95238095,3.91865079 5.50595238,3.47222222 4.96031746,3.47222222 C4.41468254,3.47222222 3.96825397,3.91865079 3.96825397,4.46428571 C3.96825397,5.00992063 4.41468254,5.45634921 4.96031746,5.45634921 C5.50595238,5.45634921 5.95238095,5.00992063 5.95238095,4.46428571 Z" id="Path"></path>
</g>
</g>
</g>
</svg>
</div>
<textarea id="message" autofocus onkeyup="grow_text_area()" onkeydown="process_messagebar_keydown()"
dir="auto" rows="1"></textarea>
<div id="sendButton" class="nav-button action-button" onclick="sendMessage();">
<svg class="svgicon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path d="M2.01 21L23 12 2.01 3 2 10l15 2-15 2z" />
<path d="M0 0h24v24H0z" fill="none" />
<svg class="svgicon" width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="Icones_Outline" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Send_Black_24dp" fill="#000000" fill-rule="nonzero" stroke="#000000" stroke-width="0.25">
<g id="noun_send_1433498" transform="translate(2.000000, 3.000000)">
<path d="M19.9969592,9.18267179 C19.9781751,8.90024996 19.8058243,8.65095392 19.5482413,8.53362564 L1.08667923,0.0721076923 C0.792197357,-0.0603940747 0.446309543,0.00511313413 0.220671983,0.236119592 C-0.00496557741,0.467126051 -0.0623223924,0.814458413 0.0770664103,1.10574359 L4.01937359,9.23074872 L0.0770376923,17.3557487 C-0.0623821896,17.6470495 -0.00502577103,17.9944168 0.220638232,18.2254358 C0.446302236,18.4564548 0.792229135,18.5219407 1.08671897,18.3893897 L19.5482977,9.92782564 C19.837429,9.79594495 20.0157137,9.49985813 19.9970131,9.18262051 L19.9969592,9.18267179 Z M17.3847821,9.23074872 L2.40077077,16.0977231 L5.56585821,9.56728718 C5.66919895,9.35483568 5.6691929,9.10668236 5.56584179,8.8942359 L2.40077077,2.36378718 L17.3847821,9.23074872 Z" id="Shape"></path>
</g>
</g>
</g>
</svg>
</div>
</div>
......
src/web-chatview/chatview.js
+ 0
− 1
View file @ 8ac9e853
......@@ -2553,7 +2553,6 @@ function setTheme(theme) {
--navbar-padding-bottom: var(--navbar-padding-top);\
--textarea-max-height: 150px;\
--placeholder-text-color: #d3d3d3;\
--action-icon-color: var(--jami-dark-blue);\
--deactivated-icon-color: #BEBEBE;\
--action-icon-hover-color: var(--jami-light-blue);\
--action-critical-icon-hover-color: rgba(211, 77, 59, 0.3);\
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment