UNPKG

1.83 kBtext/lessView Raw
1.emoji-dialog {
2 &.open {
3 display: flex;
4 }
5
6 display: none;
7
8 z-index: 10001;
9
10 position: fixed;
11 top: 0;
12 left: 0;
13 max-height: 100vh;
14
15 height: 400px;
16 width: 400px;
17
18 flex-direction: column;
19 justify-content: flex-start;
20
21 border: 1px solid @modal-content-border-color;
22 border-radius: 11px;
23 background: @modal-content-bg;
24 overflow: auto;
25
26 .top-bar {
27 height: 15px;
28 background: #eee;
29 flex-shrink: 0;
30 }
31}
32
33
34@media (max-width: @screen-sm-max) {
35 html.composing.emoji-insert .composer {
36 bottom: calc(~"40% - 36px");
37 height: auto;
38 }
39
40 .emoji-dialog {
41 z-index: 10001;
42
43 bottom: 0 !important;
44 left: 0 !important;
45 right: 0 !important;
46 top: 60% !important;
47
48 width: auto;
49 height: auto;
50 border: none;
51 border-radius: 0;
52
53 .top-bar {
54 display: none;
55 }
56 }
57}
58
59.emoji-tabs {
60 display: flex;
61 flex-direction: column;
62 height: 100%;
63
64 .emoji-dialog-search-container {
65 display: flex;
66 flex-shrink: 0;
67
68 .emoji-dialog-search {
69 flex-grow: 2;
70 }
71
72 button.close {
73 opacity: 1;
74 width: 30px;
75
76 color: @input-color;
77 border: 1px solid @input-border;
78 }
79 }
80
81 .nav-tabs {
82 overflow: hidden;
83 overflow-x: auto;
84 white-space: nowrap;
85 flex-shrink: 0;
86
87 > li, html[data-dir="rtl"] & > li {
88 display: inline-block;
89 float: none;
90 }
91 }
92
93 .tab-content {
94 overflow: auto;
95 flex-shrink: 1;
96 flex-grow: 1;
97 }
98 .tab-pane {
99 padding-top: 10px;
100 padding-bottom: 10px;
101 padding-left: 5px;
102 padding-right: 5px;
103 flex-wrap: wrap;
104
105 margin: auto;
106
107 &.active {
108 display: flex;
109 }
110 }
111}
112
113.emoji-link {
114 > span, > img {
115 height: 30px;
116 font-size: 30px;
117 line-height: 30px;
118 }
119
120 min-width: 40px;
121 min-height: 40px;
122 text-align: center;
123}