Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commitc704ebb

Browse files
committed
Use react-icons
1 parentbb66740 commitc704ebb

File tree

13 files changed

+269
-309
lines changed

13 files changed

+269
-309
lines changed

‎assets/bindata.go‎

Lines changed: 157 additions & 157 deletions
Some generated files are not rendered by default. Learn more aboutcustomizing how changed files appear on GitHub.

‎client/css/fontello.css‎

Lines changed: 0 additions & 62 deletions
This file was deleted.

‎client/css/style.css‎

Lines changed: 61 additions & 59 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,9 @@ textarea {
4747
}
4848

4949
button {
50+
display: inline-flex;
51+
justify-content: center;
52+
align-items: center;
5053
width:100%;
5154
height:50px;
5255
background:#6bb758;
@@ -78,6 +81,21 @@ button:active {
7881
background:#222;
7982
}
8083

84+
.icon-button {
85+
background: none;
86+
width:40px;
87+
color:#222;
88+
font-size:20px;
89+
}
90+
91+
.icon-button:hover {
92+
background: none;
93+
}
94+
95+
.icon-button:active {
96+
background: none;
97+
}
98+
8199
label {
82100
-webkit-tap-highlight-color:rgba(0,0,0,0);
83101
}
@@ -325,20 +343,13 @@ i[class*=' icon-']:before {
325343
border-top:1px solid#1d1d1d;
326344
}
327345

328-
.side-buttonsi {
329-
flex:100%;
330-
color:#999;
331-
line-height:50px;
332-
cursor: pointer;
333-
font-size:18px;
334-
border-left:1px solid#1d1d1d;
335-
}
336-
337346
.side-buttonsbutton {
338-
font-size:24px;
347+
background:#222;
348+
color:#999;
349+
flex:1;
339350
}
340351

341-
.side-buttonsi:hover {
352+
.side-buttonsbutton:hover {
342353
color:#ccc;
343354
background:#1d1d1d;
344355
}
@@ -372,7 +383,7 @@ i[class*=' icon-']:before {
372383

373384
.connect-form {
374385
margin: auto20px;
375-
padding-top:20px;
386+
padding:20px0;
376387
width:350px;
377388
text-align: center;
378389
}
@@ -409,11 +420,6 @@ input::-webkit-inner-spin-button {
409420

410421
.connect-formlabel {
411422
user-select: none;
412-
cursor: default;
413-
}
414-
415-
.connect-formbutton {
416-
margin-bottom:20px;
417423
}
418424

419425
.connect-form-address {
@@ -442,16 +448,14 @@ input::-webkit-inner-spin-button {
442448
color:#777;
443449
}
444450

445-
.connect-formi {
446-
display: block;
447-
cursor: pointer;
448-
color:#999;
449-
text-align: center;
451+
.connect-form-button-optionals {
450452
font-size:24px;
451-
padding:5px0;
453+
color:#999;
454+
height:40px;
455+
width:100%;
452456
}
453457

454-
.connect-formi:hover {
458+
.connect-form-button-optionals:hover {
455459
color:#666;
456460
}
457461

@@ -466,6 +470,7 @@ input::-webkit-inner-spin-button {
466470
border-bottom:1px solid#ddd;
467471
display: flex;
468472
font-size:20px;
473+
padding-right:5px;
469474
}
470475

471476
.chat-channel .chat-title-bar {
@@ -480,15 +485,6 @@ input::-webkit-inner-spin-button {
480485
cursor: pointer;
481486
}
482487

483-
.chat-title-bari {
484-
padding:015px;
485-
cursor: pointer;
486-
}
487-
488-
.chat-server .icon-search {
489-
display: none;
490-
}
491-
492488
.chat-server .userlist,
493489
.chat-private .userlist {
494490
display: none;
@@ -499,17 +495,16 @@ input::-webkit-inner-spin-button {
499495
display: none;
500496
}
501497

502-
.button-leave {
503-
border-left:1px solid#ddd;
498+
.chat-title-bar .icon-button {
499+
color:#999;
504500
}
505501

506-
.button-leave:hover {
507-
background:#ddd;
502+
.chat-title-bar .icon-button:hover {
503+
color:#222;
508504
}
509505

510506
.button-userlist {
511507
display: none;
512-
border-left:1px solid#ddd;
513508
}
514509

515510
.chat-server .button-userlist,
@@ -544,6 +539,7 @@ input.chat-title {
544539
flex:1;
545540
position: relative;
546541
margin-left:15px;
542+
margin-right:5px;
547543
}
548544

549545
.chat-topic {
@@ -559,21 +555,21 @@ input.chat-title {
559555
}
560556

561557
.userlist-bar {
558+
display: flex;
559+
justify-content: center;
560+
align-items: center;
562561
position: absolute;
563562
top:0;
564563
right:0;
565564
width:200px;
566565
height:50px;
567566
border-left:1px solid#ddd;
568567
border-bottom:1px solid#ddd;
569-
line-height:50px;
570-
text-align: center;
571-
padding:015px;
572568
font-family: Montserrat, sans-serif;
573569
}
574570

575-
.userlist-bari {
576-
margin-right:3px;
571+
.userlist-barsvg {
572+
margin-right:5px;
577573
}
578574

579575
.search {
@@ -602,17 +598,19 @@ input.chat-title {
602598
border-bottom:1px solid#ddd;
603599
}
604600

605-
.searchi {
606-
padding:15px;
607-
color:#ddd;
608-
}
609-
610601
.search-input {
611602
flex:1;
612603
padding:15px;
613604
padding-left:0;
614605
}
615606

607+
.search-input-icon {
608+
font-size:20px;
609+
align-self: center;
610+
margin:015px;
611+
color:#ddd;
612+
}
613+
616614
.search-results {
617615
position: absolute;
618616
top:50px;
@@ -956,6 +954,7 @@ input.message-input-nick.invalid {
956954

957955
.modal-header {
958956
display: flex;
957+
align-items: center;
959958
}
960959

961960
.modal-headerh2 {
@@ -965,6 +964,9 @@ input.message-input-nick.invalid {
965964
.modal-close {
966965
color:#999;
967966
cursor: pointer;
967+
width: auto!important;
968+
height: auto;
969+
margin:0!important;
968970
}
969971

970972
.modal-close:hover {
@@ -989,17 +991,21 @@ input.message-input-nick.invalid {
989991

990992
.modal-channel-button-join {
991993
margin:0!important;
992-
width:50px!important;
993-
height:24px;
994-
font-size:12px;
994+
width:60px!important;
995+
height:30px;
995996
}
996997

997998
.modal-channel-input-wrap {
998999
display: flex;
9991000
}
10001001

10011002
.modal-channel-close {
1002-
padding:15px;
1003+
background:#fff;
1004+
width:40px!important;
1005+
margin:0!important;
1006+
}
1007+
1008+
.modal-channel-close:hover {
10031009
background:#fff;
10041010
}
10051011

@@ -1011,6 +1017,7 @@ input.message-input-nick.invalid {
10111017
.modal-channel-result-header {
10121018
display: flex;
10131019
align-items: center;
1020+
margin-bottom:10px;
10141021
}
10151022

10161023
.modal-channel-topic {
@@ -1020,19 +1027,14 @@ input.message-input-nick.invalid {
10201027
}
10211028

10221029
.modal-channel-name {
1023-
margin-bottom:5px;
10241030
cursor: pointer;
1031+
margin-right:15px;
10251032
}
10261033

10271034
.modal-channel-users {
10281035
font-size:16px;
1029-
color:#444;
1030-
margin:015px;
10311036
flex:1;
1032-
}
1033-
1034-
.modal-channel-usersi {
1035-
margin-right:3px;
1037+
margin-left:5px;
10361038
}
10371039

10381040
.modal-channel-results {

‎client/js/components/TabList.js‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
importReact,{PureComponent}from'react';
22
importclassnamesfrom'classnames';
33
importgetfrom'lodash/get';
4+
import{FiPlus,FiUser,FiSettings}from'react-icons/fi';
45
importButtonfrom'components/ui/Button';
56
importTabListItemfrom'containers/TabListItem';
67
import{count}from'utils';
@@ -113,9 +114,9 @@ export default class TabList extends PureComponent {
113114
<divclassName={className}>
114115
<divclassName="tab-container">{tabs}</div>
115116
<divclassName="side-buttons">
116-
<ButtononClick={this.handleConnectClick}>+</Button>
117-
<iclassName="icon-user"/>
118-
<iclassName="icon-cog"onClick={this.handleSettingsClick}/>
117+
<Buttonicon={FiPlus}onClick={this.handleConnectClick}/>
118+
<Buttonicon={FiUser}/>
119+
<Buttonicon={FiSettings}onClick={this.handleSettingsClick}/>
119120
</div>
120121
</div>
121122
);

‎client/js/components/modals/AddChannel.js‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
importReact,{memo,useState,useEffect,useCallback,useRef}from'react';
22
importgetfrom'lodash/get';
3+
import{FiUsers,FiX}from'react-icons/fi';
34
importwithModalfrom'components/modals/withModal';
45
importButtonfrom'components/ui/Button';
56
import{join}from'state/channels';
@@ -16,10 +17,8 @@ const Channel = memo(({ server, name, topic, userCount, joined, ...props }) => {
1617
<h2className="modal-channel-name"onClick={handleJoinClick}>
1718
{name}
1819
</h2>
19-
<spanclassName="modal-channel-users">
20-
<iclassName="icon-user"/>
21-
{userCount}
22-
</span>
20+
<FiUsers/>
21+
<spanclassName="modal-channel-users">{userCount}</span>
2322
{joined ?(
2423
<spanstyle={{color:'#6bb758'}}>Joined</span>
2524
) :(
@@ -115,8 +114,9 @@ const AddChannel = ({ search, payload: { server }, onClose, ...props }) => {
115114
onKeyDown={handleKey}
116115
onChange={handleSearch}
117116
/>
118-
<i
119-
className="icon-cancel modal-close modal-channel-close"
117+
<Button
118+
icon={FiX}
119+
className="modal-close modal-channel-close"
120120
onClick={onClose}
121121
/>
122122
</div>

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp