|
20 | 20 | .vp-apiblock-board-body {
|
21 | 21 | position: relative;
|
22 | 22 | overflow: hidden auto;
|
23 |
| - height: 100%; |
| 23 | + height: calc(100% - 100px); |
| 24 | +} |
| 25 | + |
| 26 | +.vp-apiblock-tab-container { |
| 27 | + |
| 28 | +} |
| 29 | + |
| 30 | +.vp-apiblock-tab-header { |
| 31 | + height: 40px; |
| 32 | + line-height: 40px; |
| 33 | + background: white; |
| 34 | + /* padding: 0px 20px; */ |
| 35 | + |
| 36 | + display: grid; |
| 37 | + grid-template-columns: repeat(2, 50%); |
| 38 | +} |
| 39 | + |
| 40 | +.vp-apiblock-tab-button { |
| 41 | + display: inline-block; |
| 42 | + height: 40px; |
| 43 | + background: var(--light-gray-color); |
| 44 | + border: 0.25px solid #E4E4E4; |
| 45 | + text-align: center; |
| 46 | + font-weight: bold; |
| 47 | +} |
| 48 | +.vp-apiblock-tab-button.selected { |
| 49 | + color: var(--hightlight-color); |
| 50 | + background: white; |
| 51 | + border-bottom: 2px solid var(--hightlight-color); |
| 52 | +} |
| 53 | +.vp-apiblock-tab-button:hover { |
| 54 | + background: var(--light-gray-color); |
24 | 55 | }
|
25 | 56 |
|
| 57 | + |
| 58 | +.vp-apiblock-tab-box { |
| 59 | + height: calc(100% - 90px); |
| 60 | +} |
| 61 | + |
| 62 | + |
26 | 63 | .vp-apiblock-left {
|
27 | 64 | /* padding: 1.5rem; */
|
28 | 65 | /* padding: 5px; */
|
29 | 66 | background-color: white;
|
30 | 67 |
|
31 | 68 | /* 수정 */
|
32 |
| - width: 200px; |
| 69 | + /* width: 200px; */ |
| 70 | + width: 100%; |
33 | 71 | height: 100%;
|
34 | 72 | overflow: hidden auto;
|
35 | 73 |
|
|
38 | 76 |
|
39 | 77 | .vp-apiblock-right {
|
40 | 78 | position: relative;
|
41 |
| - margin-left: 5px; |
42 |
| - margin-right: 5px; |
| 79 | + /* margin-left: 5px; |
| 80 | + margin-right: 5px; */ |
43 | 81 |
|
44 | 82 | /* min-width: 282px; */
|
45 | 83 | min-width: 265px;
|
46 | 84 |
|
| 85 | + height: 100%; |
| 86 | + |
47 | 87 | color: #000;
|
48 | 88 | background-size: 5px 5px;
|
49 | 89 | /* background-image: repeating-linear-gradient( to right, #F5F5F5 0, #F5F5F5 0.25px, transparent 1px, transparent 50px ), repeating-linear-gradient( to bottom, #F5F5F5 0, #F5F5F5 0.25px, transparent 1px, transparent 50px ); */
|
|
63 | 103 | .vp-menu-search-box {
|
64 | 104 | width: 100%;
|
65 | 105 | height: 30px;
|
| 106 | + |
| 107 | + border: 0.25px solid #E4E4E4; |
| 108 | + box-sizing: border-box; |
| 109 | + box-shadow: 2px 2px 1px rgb(0 0 0 / 10%); |
| 110 | + border-radius: 2px; |
66 | 111 | }
|
67 | 112 |
|
68 | 113 | .vp-menu-search-icon {
|
|
108 | 153 | }
|
109 | 154 | .vp-apiblock-menu-apps-grid {
|
110 | 155 | display: grid;
|
111 |
| - grid-template-columns: repeat(3, 58px); |
112 |
| - grid-template-rows: repeat(3, 58px); |
| 156 | + grid-template-columns: repeat(auto-fill, 58px); |
| 157 | + grid-template-rows: repeat(auto-fill, 58px); |
113 | 158 | grid-column-gap: 5px;
|
114 | 159 | grid-row-gap: 5px;
|
115 | 160 |
|
|
119 | 164 | width: 58;
|
120 | 165 | height: 58px;
|
121 | 166 | text-align: center;
|
122 |
| - border: 0.25px solid #C4C4C4; |
| 167 | + /* border: 0.25px solid #C4C4C4; */ |
123 | 168 | box-sizing: border-box;
|
124 | 169 | box-shadow: 2px 2px 1px rgba(0, 0, 0, 0.1);
|
125 | 170 | border-radius: 2px;
|
|
185 | 230 | left: unset !important;
|
186 | 231 | z-index: 12;
|
187 | 232 |
|
| 233 | + margin-left: 5px; |
| 234 | + |
188 | 235 | border: 0.25px solid var(--border-gray-color);
|
189 | 236 | }
|
190 | 237 |
|
|
259 | 306 | .vp-apiblock-option-buttons-container {
|
260 | 307 | position: sticky;
|
261 | 308 | bottom: 0;
|
262 |
| - height: 52px; |
| 309 | + height: 50px; |
263 | 310 | width: 100%;
|
264 | 311 | background: #FFFFFF;
|
265 | 312 | border-top: 0.25px solid #E4E4E4;
|
|
282 | 329 | right: 105px;
|
283 | 330 | }
|
284 | 331 |
|
285 |
| -.vp-apiblock-option-apply-button { |
| 332 | +/* .vp-apiblock-option-apply-button { |
286 | 333 | top: 11px;
|
287 | 334 | right: 15px;
|
| 335 | +} */ |
| 336 | +.vp-apiblock-option-addrun-button { |
| 337 | + top: 11px; |
| 338 | + right: 15px; |
| 339 | + width: fit-content; |
| 340 | + height: 30px; |
| 341 | + background: #F38504; |
| 342 | + border-radius: 2px; |
| 343 | +} |
| 344 | +.vp-apiblock-option-run-button { |
| 345 | + display: inline-block; |
| 346 | + width: 60px; |
| 347 | + border-radius: 2px 0px 0px 2px; |
| 348 | + border-right: 0.25px solid white !important; |
| 349 | +} |
| 350 | +.vp-apiblock-option-detail-button { |
| 351 | + display: inline-block; |
| 352 | + width: 20px; |
| 353 | + border-radius: 0px 2px 2px 0px; |
| 354 | +} |
| 355 | +.vp-apiblock-option-detail-box { |
| 356 | + background: white; |
| 357 | + border: 0.25px solid var(--border-gray-color); |
| 358 | + position: absolute; |
| 359 | + bottom: 35px; |
| 360 | + right: 1px; |
| 361 | + width: 84px; |
| 362 | + height: 30px; |
| 363 | + text-align: center; |
| 364 | + line-height: 30px; |
| 365 | +} |
| 366 | +.vp-apiblock-option-detail-item { |
| 367 | + color: var(--font-primary); |
| 368 | +} |
| 369 | +.vp-apiblock-option-detail-item:hover { |
| 370 | + color: var(--font-hightlight); |
| 371 | + background: var(--light-gray-color); |
288 | 372 | }
|
289 | 373 |
|
290 | 374 | .vp-block-container {
|
|
351 | 435 | }
|
352 | 436 |
|
353 | 437 | .vp-block-class-def {
|
354 |
| - background-color: rgba(47, 133, 90, 0.2); |
| 438 | + /* background-color: rgba(47, 133, 90, 0.2); */ |
355 | 439 | }
|
356 | 440 |
|
357 | 441 | .vp-block-control {
|
358 |
| - background-color: rgba(246, 173, 85, 0.2); |
| 442 | + /* background-color: rgba(246, 173, 85, 0.2); */ |
359 | 443 | }
|
360 | 444 |
|
361 | 445 | .vp-block-text div {
|
362 | 446 | white-space: normal;
|
363 | 447 | }
|
364 | 448 |
|
365 | 449 | .vp-block-api {
|
366 |
| - background-color: rgba(255, 165, 112, 0.2); |
| 450 | + /* background-color: rgba(255, 165, 112, 0.2); */ |
367 | 451 | }
|
368 | 452 | .vp-apiblock-tab-navigation-node-block-body-btn.api.vp-block-api {
|
369 |
| - width: 100% !important; |
370 |
| - max-width: 130px !important; |
| 453 | + /* width: 100% !important; |
| 454 | + max-width: 130px !important; */ |
371 | 455 | overflow: hidden;
|
372 | 456 | text-overflow: ellipsis;
|
373 | 457 | }
|
|
417 | 501 | background-color:rgb(253, 239, 221);
|
418 | 502 | }
|
419 | 503 | .vp-block-blockcodelinetype-code {
|
420 |
| - background-color: rgb(229, 229, 229); |
| 504 | + /* background-color: rgb(229, 229, 229); */ |
421 | 505 | }
|
422 | 506 |
|
423 | 507 | .vp-block-name {
|
|
441 | 525 | .vp-apiblock-category {
|
442 | 526 | cursor: pointer;
|
443 | 527 | background: var(--light-gray-color);
|
| 528 | + border-radius: 2px; |
444 | 529 | /* padding: 7px 0px 7px 0px !important; */
|
445 | 530 | padding: 7px 7px !important; /* 수정 */
|
446 | 531 | margin-top: 5px;
|
|
461 | 546 | font-size: 10px;
|
462 | 547 | }
|
463 | 548 |
|
| 549 | +.vp-apiblock-group-list:empty::after { |
| 550 | + content: 'Work In Progress...'; |
| 551 | + color: var(--gray-color); |
| 552 | +} |
| 553 | + |
464 | 554 |
|
465 | 555 | .vp-apiblock-tab-title {
|
466 | 556 | font-size: 16px;
|
|
484 | 574 | padding-left: 15px;
|
485 | 575 |
|
486 | 576 | overflow: auto;
|
487 |
| - height: calc(100% - 102px); |
| 577 | + height: calc(100% - 100px); |
488 | 578 | }
|
489 | 579 |
|
490 | 580 | .vp-apiblock-tab-navigation-node-block-title {
|
|
501 | 591 | .vp-apiblock-tab-navigation-node-block-body-btn {
|
502 | 592 |
|
503 | 593 | position: relative;
|
504 |
| - text-align: center; |
| 594 | + /* text-align: center; */ |
| 595 | + |
| 596 | + /* width: 130px; */ |
| 597 | + width: 95%; |
505 | 598 |
|
506 |
| - width: 130px; |
507 | 599 |
|
508 | 600 | padding: 0.25rem 0.5rem;
|
509 | 601 | z-index: 1000;
|
|
516 | 608 |
|
517 | 609 | display: flex;
|
518 | 610 | flex-direction: row;
|
519 |
| - justify-content: space-around; |
| 611 | + /* justify-content: space-around; */ |
520 | 612 |
|
521 | 613 | color: #777;
|
522 | 614 | }
|
|
547 | 639 | transition: mask-position 0.3s, -webkit-mask-position 0.3s; */
|
548 | 640 |
|
549 | 641 | overflow-y: auto;
|
550 |
| - -webkit-mask-position: left top; |
| 642 | + --webkit-mask-position: left top; |
551 | 643 | }
|
552 | 644 |
|
553 | 645 | /* .vp-apiblock-scrollbar:hover {
|
|
559 | 651 | width: 5px;
|
560 | 652 | height: 5px;
|
561 | 653 | }
|
562 |
| -.vp-apiblock-scrollbar::-webkit-scrollbar-track { |
| 654 | +/* .vp-apiblock-scrollbar::-webkit-scrollbar-track { |
563 | 655 | box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.3);
|
564 |
| -} |
| 656 | +} */ |
565 | 657 | .vp-apiblock-scrollbar::-webkit-scrollbar-thumb {
|
566 | 658 | border: 0.3px solid #C4C4C4;
|
567 | 659 | background: #C4C4C4;
|
|
1290 | 1382 |
|
1291 | 1383 | .vp-apiblock-board-button-container {
|
1292 | 1384 | width: 100%;
|
1293 |
| - height: 52px; |
1294 |
| - position: absolute; |
| 1385 | + height: 50px; |
| 1386 | + /* position: absolute; */ |
1295 | 1387 | bottom: 0;
|
1296 | 1388 | background: #FFFFFF;
|
1297 | 1389 | border-top: 0.25px solid #E4E4E4;
|
|
0 commit comments