jekyll-theme-satellite 1.1.2 → 1.2.4

Sign up to get free protection for your applications and to get access to all the features.
data/_sass/search.scss CHANGED
@@ -1,248 +1,229 @@
1
1
  #search
2
2
  {
3
- width: 100%;
4
- height: 100%;
5
- top: 0;
6
- left: 0;
7
- position: fixed;
8
- display: none;
9
- background: rgba(255,255,255,0.875);
10
- z-index: 999;
11
- text-align: center;
12
-
13
- ul, input {
14
- min-width: 20rem;
15
- width: 50vw;
3
+ width:100%;
4
+ height:100%;
5
+ top:0;
6
+ left:0;
7
+ position:fixed;
8
+ display:none;
9
+ background:rgba(255,255,255,0.875);
10
+ z-index:999;
11
+ text-align:center;
12
+
13
+ ul, input {
14
+ min-width:20rem;
15
+ width:50vw;
16
+ }
17
+ ul {
18
+ margin:auto;
19
+ margin-top:-1px;
20
+ padding:0;
21
+ overflow-y:auto;
22
+ max-height:60vh;
23
+ border-bottom:2px solid #aaa;
24
+ box-shadow:0px 4px 8px 0 #ccc;
25
+
26
+ i {
27
+ margin-right:0.5rem;
28
+ color:#666;
16
29
  }
17
30
 
18
- ul {
19
- margin: auto;
20
- margin-top: -1px;
21
- padding: 0;
22
- overflow-y: auto;
23
- max-height: 60vh;
24
- border-bottom: 2px solid #aaa;
25
- box-shadow: 0px 4px 8px 0 #ccc;
26
-
27
- i {
28
- margin-right: 0.5rem;
29
- color: #666;
30
- }
31
-
32
- &::-webkit-scrollbar {
33
- width: 8px;
34
- background-color: #ddd;
35
- }
36
-
37
- &::-webkit-scrollbar-thumb { background-color: rosybrown; }
31
+ &::-webkit-scrollbar {
32
+ width:8px;
33
+ background-color:#ddd;
38
34
  }
35
+ &::-webkit-scrollbar-thumb { background-color:rosybrown; }
36
+ }
39
37
 
40
- &.active{ display: flex; }
38
+ &.active{ display:flex; }
41
39
  }
42
40
 
43
41
  .wave {
44
- background: rgba(253, 177, 55, 0.5);
45
- border-radius: 0 0 250% 250%;
46
- position: fixed;
47
- width: 200%;
48
- height: 12rem;
49
- animation: wave 10s -3s linear infinite;
50
- transform: translate3d(0, 0, 0);
51
- opacity: 0.75;
52
- top: 0;
53
- left: 0;
54
- z-index: -1;
42
+ background:rgba(253, 177, 55, 0.5);
43
+ border-radius:0 0 250% 250%;
44
+ position:fixed;
45
+ width:200%;
46
+ height:12rem;
47
+ animation:wave 10s -3s linear infinite;
48
+ transform:translate3d(0, 0, 0);
49
+ opacity:0.75;
50
+ top:0;
51
+ left:0;
52
+ z-index:-1;
55
53
  }
56
-
57
54
  .wave:nth-of-type(2) {
58
- top: -1.5em;
59
- animation: wave 18s linear reverse infinite;
60
- opacity: 0.75;
55
+ top:-1.5em;
56
+ animation:wave 18s linear reverse infinite;
57
+ opacity:0.75;
61
58
  }
62
-
63
59
  .wave:nth-of-type(3) {
64
- top: -3em;
65
- animation: wave 20s -1s reverse infinite;
66
- opacity: 0.875;
60
+ top:-3em;
61
+ animation:wave 20s -1s reverse infinite;
62
+ opacity:0.875;
67
63
  }
68
64
 
69
65
  @keyframes wave {
70
- 2% { transform: translateX(1); }
71
-
72
- 25% { transform: translateX(-25%); }
73
-
74
- 50% { transform: translateX(-50%); }
75
-
76
- 75% { transform: translateX(-25%); }
77
-
78
- 100% { transform: translateX(1); }
66
+ 2% { transform:translateX(1); }
67
+ 25% { transform:translateX(-25%); }
68
+ 50% { transform:translateX(-50%); }
69
+ 75% { transform:translateX(-25%); }
70
+ 100% { transform:translateX(1); }
79
71
  }
80
72
 
81
73
  .search-box {
82
- margin: auto;
83
- margin-top: 2rem;
84
-
85
- mark {
86
- margin-bottom: 1rem;
87
- color: #fff !important;
88
- opacity: 0.8;
89
- font-size: 1.5rem;
90
- font-weight: 200;
91
- display: block;
92
- }
93
-
94
- input {
95
- font-size: 1.25rem;
96
- padding: 0.5rem;
97
- border: 2px solid #aaa;
98
- background: none;
99
- }
74
+ margin:auto;
75
+ margin-top:2rem;
76
+
77
+ mark {
78
+ margin-bottom:1rem;
79
+ color:#fff !important;
80
+ opacity:0.8;
81
+ font-size:1.5rem;
82
+ font-weight:200;
83
+ display:block;
84
+ }
85
+
86
+ input {
87
+ font-size:1.25rem;
88
+ padding:8px;
89
+ border:2px solid #aaa;
90
+ background:none;
91
+ }
100
92
  }
101
93
 
102
94
  .input-box {
103
- position: relative;
104
-
105
- &:before,
106
- &:after {
107
- content: "";
108
- position: absolute;
109
- width: 100%;
110
- height: 100%;
111
- top: 0;
112
- left: 0;
113
- z-index: -1;
114
- }
115
-
116
- &:before { background: #fff; }
117
-
118
- &:after { background-image: url('/assets/img/tile.png'); }
119
-
120
- button {
121
- position: absolute;
122
- display: none;
123
- cursor: pointer;
124
- top: 0;
125
- right: 8px;
126
- width: 22px;
127
- aspect-ratio: 1.0;
128
- border-radius: 50%;
129
- transform: translateY(50%);
130
- font-size: 14px;
131
- background: slategrey !important;
132
-
133
- svg {
134
- fill: #fff !important;
135
- width: 14px;
136
- }
95
+ position:relative;
96
+
97
+ &:before,
98
+ &:after {
99
+ content:"";
100
+ position:absolute;
101
+ width:100%;
102
+ height:100%;
103
+ top:0;
104
+ left:0;
105
+ z-index:-1;
106
+ }
107
+ &:before { background:#fff; }
108
+ &:after { background-image:url('/assets/img/tile.png'); }
109
+
110
+ button {
111
+ position:absolute;
112
+ display:none;
113
+ cursor:pointer;
114
+ top:0;
115
+ right:8px;
116
+ width:22px;
117
+ aspect-ratio:1.0;
118
+ border-radius:50%;
119
+ transform:translateY(50%);
120
+ font-size:14px;
121
+ background:slategrey !important;
122
+
123
+ svg {
124
+ fill:#fff !important;
125
+ width:14px;
137
126
  }
127
+ }
138
128
  }
139
129
 
140
130
  .result-item {
141
- list-style: none;
142
- text-align: justify;
143
- padding: 0.5rem;
144
- border: 1px solid #aaa;
145
- background: #fff;
146
-
147
- &:hover { background: #ffe7a0; }
148
-
149
- table {
150
- th, td {
151
- text-align: left;
152
- vertical-align: top;
153
- }
154
-
155
- th { font-size: 1rem; }
156
-
157
- td { font-size: 0.875rem; }
158
-
159
- svg {
160
- background-color: darkslategrey;
161
- mask-repeat: no-repeat;
162
- display: inline-flex;
163
- width: 14px;
164
- margin-right: 8px;
165
- transform: translateY(2px);
166
- }
167
-
168
- .ico-book {
169
- background-color: dodgerblue !important;
170
- -webkit-mask-image: url(/assets/img/icon/book-solid.svg);
171
- mask-image: url(/assets/img/icon/book-solid.svg);
172
- }
173
-
174
- .ico-folder {
175
- -webkit-mask-image: url(/assets/img/icon/folder-open-regular.svg);
176
- mask-image: url(/assets/img/icon/folder-open-regular.svg);
177
- }
178
-
179
- .ico-tags {
180
- -webkit-mask-image: url(/assets/img/icon/tags-solid.svg);
181
- mask-image: url(/assets/img/icon/tags-solid.svg);
182
- }
183
-
184
- .ico-calendar {
185
- -webkit-mask-image: url(/assets/img/icon/calendar-days-regular.svg);
186
- mask-image: url(/assets/img/icon/calendar-days-regular.svg);
187
- }
188
-
189
- th .ico-folder { background-color: mediumseagreen !important; }
190
-
191
- .ico-book, th .ico-folder { width: 18px; }
131
+ list-style:none;
132
+ text-align:justify;
133
+ padding:8px;
134
+ border:1px solid #aaa;
135
+ background:#fff;
136
+
137
+ &:hover { background:#ffe7a0; }
138
+
139
+ table {
140
+ th, td {
141
+ text-align:left;
142
+ vertical-align:top;
192
143
  }
193
-
194
- .highlight {
195
- font-weight: 900;
196
- color: yellowgreen !important;
144
+ th { font-size:1rem; }
145
+ td { font-size:0.875rem; }
146
+
147
+ svg {
148
+ background-color:darkslategrey;
149
+ mask-repeat:no-repeat;
150
+ display:inline-flex;
151
+ width:14px;
152
+ margin-right:8px;
153
+ transform:translateY(2px);
154
+ }
155
+ .ico-book {
156
+ background-color:dodgerblue !important;
157
+ -webkit-mask-image:url(/assets/img/icon/book-solid.svg);
158
+ mask-image:url(/assets/img/icon/book-solid.svg);
159
+ }
160
+ .ico-folder {
161
+ -webkit-mask-image:url(/assets/img/icon/folder-open-regular.svg);
162
+ mask-image:url(/assets/img/icon/folder-open-regular.svg);
197
163
  }
164
+ .ico-tags {
165
+ -webkit-mask-image:url(/assets/img/icon/tags-solid.svg);
166
+ mask-image:url(/assets/img/icon/tags-solid.svg);
167
+ }
168
+ .ico-calendar {
169
+ -webkit-mask-image:url(/assets/img/icon/calendar-days-regular.svg);
170
+ mask-image:url(/assets/img/icon/calendar-days-regular.svg);
171
+ }
172
+ .ico-book, th .ico-folder { width:18px; }
173
+ th .ico-folder { background-color:mediumseagreen !important; }
174
+ }
175
+
176
+ .highlight {
177
+ font-weight:900;
178
+ color:yellowgreen !important;
179
+ }
198
180
  }
199
181
 
200
182
  @include mq(tablet) {
201
- #search {
202
- ul, input { width: 40rem; }
203
183
 
204
- ul {
205
- div { font-size: 1.125rem; }
184
+ #search {
185
+ ul, input { width:40rem; }
186
+ ul {
187
+ div { font-size:1.125rem; }
188
+ i { margin-right:1rem; }
189
+ }
190
+ }
206
191
 
207
- i { margin-right: 1rem; }
208
- }
209
- }
192
+ .search-box {
193
+ margin-top:4rem;
210
194
 
211
- .search-box {
212
- margin-top: 4rem;
213
-
214
- mark {
215
- font-size: 2.5rem;
216
- margin-bottom: 2rem;
217
- }
218
- }
195
+ mark {
196
+ font-size:2.5rem;
197
+ margin-bottom:2rem;
198
+ }
199
+ }
219
200
 
220
- .search-box input {
221
- font-size: 2rem;
222
- padding: 1rem;
223
- width: 40rem;
224
- }
201
+ .search-box input {
202
+ font-size:2rem;
203
+ padding:1rem;
204
+ width:40rem;
205
+ }
225
206
 
226
- .input-box button {
227
- width: 36px;
228
- right: 16px;
207
+ .input-box button {
208
+ width:36px;
209
+ right:16px;
229
210
 
230
- svg { width: 20px; }
231
- }
211
+ svg { width:20px; }
212
+ }
232
213
 
233
- .result-item {
234
- padding: 1rem;
214
+ .result-item {
215
+ padding:1rem;
235
216
 
236
- table {
237
- th { font-size: 1.25rem; }
217
+ table {
218
+ th { font-size:1.25rem; }
219
+ td { font-size:1rem; }
238
220
 
239
- td { font-size: 1rem; }
221
+ svg { width:16px; }
240
222
 
241
- svg { width: 16px; }
223
+ .ico-book, th .ico-folder { width:20px; }
224
+ }
242
225
 
243
- .ico-book, th .ico-folder { width: 20px; }
244
- }
226
+ .title { font-size:1.25rem; }
227
+ }
245
228
 
246
- .title { font-size: 1.25rem; }
247
- }
248
229
  }