browser_app_base 0.1.8 → 0.1.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,178 +1,485 @@
1
- body {
2
- color: #000000;
3
- background-color: #cac3ec4f;
4
- overflow: hidden;
5
- font-size: 12px;
1
+ :root {
2
+ --main-bg: #f6fbff;
3
+ --main-color: #424242;
4
+ --btn-shadow: 0 2px 8px rgba(60, 60, 60, 0.11);
5
+ --btn-gradient: linear-gradient(90deg, #eaf6f9 0%, #61afe7 100%);
6
+ --btn-gradient-accent: linear-gradient(90deg, #eaf6f9 0%, #61afe7 100%);
7
+ --btn-gradient-danger: linear-gradient(90deg, #eaf6f9 0%, #f1f1c7 100%);
6
8
  }
7
9
 
8
- hr {
9
- color: #ffffff;
10
- background-color: #000000;
11
- height: 1px;
12
- /* 線の太さ */
13
- border: 1px;
14
- /* 枠の太さ */
15
- border-style: solid;
16
- /* 枠の種類 */
10
+ body {
11
+ font-family: 'Roboto', Arial, sans-serif;
12
+ background: linear-gradient(135deg, #e3f0fc 0%, #b6d6f6 100%);
13
+ min-height: 100vh;
14
+ margin: 0;
15
+ padding: 0;
16
+ color: #234067;
17
+ font-size: 13px;
17
18
  }
18
19
 
19
- .error {
20
- color: red;
20
+ .main-title-row {
21
+ display: flex;
22
+ align-items: center;
23
+ justify-content: space-between;
24
+ margin-bottom: 6px;
25
+ gap: 18px;
21
26
  }
22
27
 
23
- .outarea {
24
- background-color: #FFFFFF;
25
- margin: 5px;
26
- padding: 5px;
27
- width: 95vw;
28
- height: 50vh;
29
- overflow: auto;
28
+ .main-title {
29
+ color: #234067;
30
+ font-size: 1.2rem;
31
+ letter-spacing: 0.01em;
32
+ margin: 0;
33
+ flex-shrink: 0;
34
+ margin-left: 10px;
30
35
  }
31
36
 
32
- .inarea {
33
- border: thin solid #000000;
34
- margin: 5px;
35
- padding: 5px;
36
- width: 95%;
37
+ .main-title-actions {
38
+ display: flex;
39
+ gap: 10px;
37
40
  }
38
41
 
39
- input.long {
40
- width: 90%;
41
- background-color: #FAFAFA;
42
- margin: 5px;
43
- padding: 5px;
42
+ .main-title-actions .btn {
43
+ font-size: 13px;
44
+ padding: 7px 16px;
45
+ text-decoration: none;
46
+ cursor: pointer;
44
47
  }
45
48
 
46
- textarea.long {
47
- width: 95vw;
48
- height: 50vh;
49
+ .main-title-actions .menu-title {
50
+ position: relative;
51
+ user-select: none;
49
52
  }
50
53
 
51
- .ui-widget {
52
- font-size: 12px;
54
+ .main-title-actions .menuSub {
55
+ display: none;
56
+ position: absolute;
57
+ top: 100%;
58
+ right: 0;
59
+ left: auto;
60
+ background: #f6fbff;
61
+ box-shadow: 0 1px 5px #b6d6f6;
62
+ border-radius: 0 0 5px 5px;
63
+ min-width: 120px;
64
+ z-index: 100;
65
+ padding: 0;
66
+ margin: 0;
53
67
  }
54
68
 
55
- .ui-autocomplete {
56
- max-height: 45vh;
57
- max-width: 90wh;
58
- overflow-y: auto;
59
- overflow-x: auto;
60
- padding-right: 10px;
69
+ .main-title-actions .menu-title:hover .menuSub,
70
+ .main-title-actions .menu-title:focus-within .menuSub {
71
+ display: block;
61
72
  }
62
73
 
63
- #jquery-ui-autocomplete label {
64
- float: left;
65
- margin-right: 0.5em;
66
- color: black;
74
+ .main-title-actions .menuSub li a {
75
+ color: #3b5c7e;
76
+ padding: 7px 15px;
77
+ display: block;
78
+ border-bottom: 1px solid #e3f0fc;
79
+ transition: color 0.2s, background 0.2s;
80
+ text-decoration: none;
81
+ font-size: 13px;
67
82
  }
68
83
 
69
- .ui-autocomplete.ui-front {
70
- max-height: 250px;
71
- overflow-y: auto;
72
- /* prevent horizontal scrollbar */
73
- overflow-x: hidden;
74
- /* add padding to account for vertical scrollbar */
75
- z-index: 1000 !important;
84
+ .main-title-actions .menuSub li:last-child a {
85
+ border-bottom: none;
76
86
  }
77
87
 
78
- .ui-dialog {
79
- position: absolute;
80
- top: 0;
81
- left: 0;
82
- padding: .2em;
83
- outline: 0;
88
+ .main-title-actions .menuSub li a:hover {
89
+ background: #d2e8f7;
90
+ color: #234067;
84
91
  }
85
92
 
86
- .long {
87
- width: 90%;
93
+ hr {
94
+ border: none;
95
+ border-top: 1px solid #b6d6f6;
96
+ margin: 6px 0 14px 0;
97
+ width: 60%;
88
98
  }
89
99
 
90
- #setting_dialog {
91
- color: #796fe9;
92
- background-color: #000000;
100
+ .btn.primary {
101
+ background: var(--btn-gradient);
102
+ border-bottom: 3px solid #333;
93
103
  }
94
104
 
95
- .setting_name {
96
- width: 200px;
97
- color: #796fe9;
98
- background-color: #000000;
105
+ .btn.primary:hover {
106
+ background: #212121;
107
+ color: #fff;
99
108
  }
100
109
 
101
- .setting_value {
102
- width: 300px;
103
- color: #796fe9;
104
- background-color: #000000;
110
+ .btn.danger {
111
+ background: var(--btn-gradient-danger);
112
+ border-bottom: 3px solid #c62828;
105
113
  }
106
114
 
107
- .setting_checkbox {
108
- color: #796fe9;
109
- background-color: #000000;
115
+ .btn.danger:hover {
116
+ background: #b71c1c;
117
+ color: #fff;
110
118
  }
111
119
 
112
- ul.log {
113
- list-style-type: decimal;
114
- font-size: 12px;
115
- color: #5d0a94;
120
+ .app-header {
121
+ display: flex;
122
+ align-items: center;
123
+ background: #b3d6f6;
124
+ padding: 10px 20px;
125
+ box-shadow: 0 1px 8px #afd6f9aa;
126
+ border-bottom: 1px solid #a3c9e6;
116
127
  }
117
128
 
118
- input[type="search"] {
119
- -webkit-appearance: searchfield;
129
+ .app-header .material-icons {
130
+ font-size: 1.6rem;
131
+ color: #539ad9;
132
+ margin-right: 10px;
120
133
  }
121
134
 
122
- input[type="search"]::-webkit-search-cancel-button {
123
- -webkit-appearance: searchfield-cancel-button;
135
+ .app-title {
136
+ font-size: 1.2rem;
137
+ font-weight: 700;
138
+ letter-spacing: 1px;
139
+ color: #234067;
124
140
  }
125
141
 
126
- /* menu */
142
+ /* Modern Menu Styling */
127
143
  .menu {
128
144
  display: flex;
129
- justify-content: flex-start;
130
- list-style-type: none;
131
- color: #393737;
145
+ list-style: none;
132
146
  padding: 0;
133
- font-size: 12px;
134
- font-weight: bold;
147
+ margin: 18px 0 0 18px;
148
+ gap: 10px;
149
+ font-size: 13px;
135
150
  }
136
151
 
137
- .menu li {
152
+ .menu>li {
138
153
  position: relative;
139
- width: 100px;
140
- margin-left: 1px;
141
- padding: 5px;
142
- background: #d8dada;
143
- list-style-type: none;
154
+ background: #e5f2fb;
155
+ border-radius: 5px;
156
+ overflow: visible;
157
+ transition: box-shadow 0.2s;
144
158
  }
145
159
 
146
- .menu li a {
147
- color: rgb(20, 114, 192);
160
+ .menu>li:hover,
161
+ .menu>li:focus-within {
162
+ box-shadow: 0 2px 8px #539ad955;
163
+ background: #d2e8f7;
148
164
  }
149
165
 
150
- .menu li a:hover {
151
- background: #eba399;
166
+ .menu>li>a,
167
+ .menu>li>span {
168
+ display: block;
169
+ color: #234067;
170
+ font-weight: 500;
171
+ padding: 7px 16px;
172
+ text-decoration: none;
173
+ cursor: pointer;
174
+ font-size: 13px;
175
+ transition: background 0.2s;
152
176
  }
153
177
 
178
+ /* サブメニューの表示制御 */
154
179
  .menuSub {
180
+ display: none;
155
181
  position: absolute;
156
- margin-left: -6px;
182
+ top: 100%;
183
+ left: 0;
184
+ background: #f6fbff;
185
+ box-shadow: 0 1px 5px #b6d6f6;
186
+ border-radius: 0 0 5px 5px;
187
+ min-width: 150px;
188
+ z-index: 100;
157
189
  padding: 0;
158
- display: none;
190
+ margin: 0;
159
191
  }
160
192
 
161
- /*.openが付与された時、表示の設定*/
162
- .menuSub.open {
193
+ .menu>li:hover>.menuSub,
194
+ .menu>li:focus-within>.menuSub {
163
195
  display: block;
164
196
  }
165
197
 
198
+ .menuSub li {
199
+ list-style: none;
200
+ }
201
+
166
202
  .menuSub li a {
167
- padding: 5px;
168
- margin-left: -5px;
169
- margin-right: -5px;
170
- margin-bottom: -5px;
203
+ color: #3b5c7e;
204
+ padding: 7px 15px;
171
205
  display: block;
172
- color: rgb(20, 114, 192);
206
+ border-bottom: 1px solid #e3f0fc;
207
+ transition: color 0.2s, background 0.2s;
173
208
  text-decoration: none;
209
+ font-size: 13px;
210
+ }
211
+
212
+ .menuSub li:last-child a {
213
+ border-bottom: none;
174
214
  }
175
215
 
176
216
  .menuSub li a:hover {
177
- background: #eba399;
217
+ background: #d2e8f7;
218
+ color: #234067;
219
+ }
220
+
221
+ /* Main Content Layout */
222
+ .main-content {
223
+ display: flex;
224
+ flex-direction: column;
225
+ margin: 5px 1vw 0 1vw;
226
+ /* 余白を減らす */
227
+ gap: 6px;
228
+ /* 要素間の隙間も少し減らす */
229
+ font-size: 13px;
230
+ }
231
+
232
+ .input-row {
233
+ display: flex;
234
+ align-items: center;
235
+ gap: 10px;
236
+ margin-bottom: 7px;
237
+ font-size: 13px;
238
+ }
239
+
240
+ .input-row input[type="search"],
241
+ .input-row input[type="text"] {
242
+ background: #e5f2fb;
243
+ border: 1px solid #b3d6f6;
244
+ border-radius: 4px;
245
+ padding: 6px 10px;
246
+ color: #234067;
247
+ font-size: 13px;
248
+ outline: none;
249
+ transition: box-shadow 0.2s;
250
+ width: 170px;
251
+ }
252
+
253
+ .input-row input[type="search"]:focus {
254
+ box-shadow: 0 0 0 2px #b6d6f6;
255
+ }
256
+
257
+ .input-row button,
258
+ .input-row input[type="button"] {
259
+ background: #b6d6f6;
260
+ color: #234067;
261
+ border: none;
262
+ border-radius: 4px;
263
+ padding: 6px 13px;
264
+ font-size: 13px;
265
+ cursor: pointer;
266
+ transition: background 0.2s, color 0.2s;
267
+ font-weight: 500;
268
+ margin-left: 1px;
269
+ box-shadow: 0 1px 4px #b6d6f633;
270
+ }
271
+
272
+ .input-row button:hover,
273
+ .input-row input[type="button"]:hover {
274
+ background: #d2e8f7;
275
+ color: #539ad9;
276
+ box-shadow: 0 1px 8px #b6d6f6cc;
277
+ }
278
+
279
+ /* Dialog Styling Overrides */
280
+ .ui-dialog {
281
+ background: #e5f2fb;
282
+ color: #234067;
283
+ border-radius: 6px;
284
+ box-shadow: 0 2px 12px #b6d6f677;
285
+ border: none;
286
+ font-size: 13px;
287
+ }
288
+
289
+ .ui-dialog-titlebar {
290
+ background: #b6d6f6;
291
+ color: #539ad9;
292
+ border: none;
293
+ border-radius: 6px 6px 0 0;
294
+ font-weight: 700;
295
+ font-size: 13px;
296
+ }
297
+
298
+ .ui-dialog-buttonpane button {
299
+ background: #b6d6f6;
300
+ color: #234067;
301
+ border: none;
302
+ border-radius: 4px;
303
+ padding: 5px 11px;
304
+ font-weight: bold;
305
+ margin: 0 5px;
306
+ font-size: 13px;
307
+ transition: background 0.2s, color 0.2s;
308
+ }
309
+
310
+ .ui-dialog-buttonpane button:hover {
311
+ background: #539ad9;
312
+ color: #f6fbff;
313
+ }
314
+
315
+ /* Settings dialog table */
316
+ #setting_dialog table {
317
+ width: 95%;
318
+ margin-bottom: 5px;
319
+ font-size: 13px;
320
+ }
321
+
322
+ #setting_dialog .setting_name {
323
+ color: #539ad9;
324
+ width: 120px;
325
+ font-weight: bold;
326
+ padding-right: 12px;
327
+ font-size: 13px;
328
+ }
329
+
330
+ #setting_dialog .setting_value {
331
+ width: 100%;
332
+ max-width: 100%;
333
+ min-width: 120px;
334
+ box-sizing: border-box;
335
+ }
336
+
337
+ #setting_dialog input,
338
+ #setting_dialog select {
339
+ background: #f6fbff;
340
+ color: #234067;
341
+ border: 1px solid #b3d6f6;
342
+ border-radius: 4px;
343
+ padding: 5px 8px;
344
+ font-size: 13px;
345
+ }
346
+
347
+ #msg_text {
348
+ font-size: 13px;
349
+ color: #234067;
350
+ padding: 10px 0;
351
+ }
352
+
353
+ @media (max-width: 700px) {
354
+ .main-content {
355
+ margin: 7px 2vw;
356
+ }
357
+
358
+ .outarea {
359
+ padding: 7px;
360
+ }
361
+
362
+ .menu>li>a,
363
+ .menu>li>span {
364
+ padding: 7px 7px;
365
+ }
366
+
367
+ .input-row input[type="search"] {
368
+ width: 80px;
369
+ }
370
+ }
371
+
372
+ .input-row input#inDir {
373
+ width: 80vw;
374
+ max-width: 80vw;
375
+ min-width: 200px;
376
+ }
377
+
378
+ .input-row input#outFile {
379
+ width: 80vw;
380
+ max-width: 80vw;
381
+ min-width: 200px;
382
+ }
383
+
384
+ .input-row input#inDir,
385
+ .input-row input#outDir {
386
+ background: #f6fbff;
387
+ color: #234067;
388
+ border: 1px solid #b3d6f6;
389
+ border-radius: 4px;
390
+ padding: 6px 10px;
391
+ font-size: 13px;
392
+ outline: none;
393
+ transition: box-shadow 0.2s;
394
+ }
395
+
396
+ .input-row input#inDir:focus,
397
+ .input-row input#outDir:focus {
398
+ box-shadow: 0 0 0 2px #b6d6f6;
399
+ }
400
+
401
+ .input-row input#outFile,
402
+ .input-row input#outDir {
403
+ background: #f6fbff;
404
+ color: #234067;
405
+ border: 1px solid #b3d6f6;
406
+ border-radius: 4px;
407
+ padding: 6px 10px;
408
+ font-size: 13px;
409
+ outline: none;
410
+ transition: box-shadow 0.2s;
411
+ }
412
+
413
+ .input-row input#outFile:focus,
414
+ .input-row input#outDir:focus {
415
+ box-shadow: 0 0 0 2px #b6d6f6;
416
+ }
417
+
418
+ #dialog1 #search_str {
419
+ width: 80vw;
420
+ min-width: 400px;
421
+ max-width: 100%;
422
+ box-sizing: border-box;
423
+ }
424
+
425
+ #dialog2 #search_str2 {
426
+ width: 80vw;
427
+ min-width: 400px;
428
+ max-width: 100%;
429
+ box-sizing: border-box;
430
+ }
431
+
432
+ .inarea {
433
+ /* font-size: 1.13rem; */
434
+ padding: 3px 3px;
435
+ border: 1.5px soslid #bbb;
436
+ border-radius: var(--border-radius);
437
+ width: 85vw;
438
+ max-width: 100vw;
439
+ min-width: 50vw;
440
+ box-sizing: border-box;
441
+ background: #fafafa;
442
+ outline: none;
443
+ display: block;
444
+ margin-left: 10px;
445
+
446
+ }
447
+
448
+ .inarea:focus {
449
+ border-color: var(--main-color);
450
+ background: #fff;
451
+ }
452
+
453
+ /* Log Output */
454
+ .outarea {
455
+ background: #f6fbff;
456
+ border-radius: 7px;
457
+ min-height: 200px;
458
+ width: 98vw;
459
+ height: 85vh;
460
+ max-width: 100vw;
461
+ max-height: 100vh;
462
+ box-shadow: 1px 1px 1px #b6d6f677;
463
+ margin-top: 4px;
464
+ color: #b0bec5;
465
+ overflow-y: auto;
466
+ font-size: 12px;
467
+ margin-left: 10px;
468
+ margin-right: 1px;
469
+ display: block;
470
+ padding: 3px 1px;
471
+
472
+ }
473
+
474
+ ul.log {
475
+ margin: 0;
476
+ padding-left: 0.5px;
477
+ font-size: 13px;
478
+ color: #539ad9;
479
+ letter-spacing: 0.1px;
480
+ padding: 0.5px 0.5px;
481
+ }
482
+
483
+ ul.log li {
484
+ margin-bottom: 0.3em;
178
485
  }
@@ -1,3 +1,5 @@
1
1
  [
2
-
2
+ "/home/kuwayama/tool/docker/android/work/A13/tools/test",
3
+ "/home/kuwayama/tool/ruby/Gemfile",
4
+ "/home/kuwayama"
3
5
  ]