@eveshipfit/ui-ingame 1.1.0 → 1.2.0
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.
- package/dist/index.d.mts +1 -0
- package/dist/index.mjs +1357 -812
- package/dist/style.css +283 -6
- package/dist/theme.css +7 -0
- package/package.json +6 -6
package/dist/style.css
CHANGED
|
@@ -771,6 +771,10 @@
|
|
|
771
771
|
display: grid;
|
|
772
772
|
}
|
|
773
773
|
|
|
774
|
+
.QyA-_q_text {
|
|
775
|
+
text-box: trim-both cap alphabetic;
|
|
776
|
+
}
|
|
777
|
+
|
|
774
778
|
.QyA-_q_bar[data-damage="thermal"] {
|
|
775
779
|
--colour: var(--esf-damage-thermal);
|
|
776
780
|
}
|
|
@@ -824,6 +828,254 @@
|
|
|
824
828
|
border-radius: 50%;
|
|
825
829
|
position: absolute;
|
|
826
830
|
}
|
|
831
|
+
.gVdevq_panel {
|
|
832
|
+
background: var(--esf-menu-bg);
|
|
833
|
+
border: var(--window-unit) solid var(--esf-input-border);
|
|
834
|
+
box-sizing: border-box;
|
|
835
|
+
color: var(--esf-text);
|
|
836
|
+
gap: calc(10 * var(--window-unit));
|
|
837
|
+
margin: calc(4 * var(--window-unit)) 0;
|
|
838
|
+
padding: calc(12 * var(--window-unit)) calc(2 * var(--window-unit));
|
|
839
|
+
position-anchor: var(--bay-anchor);
|
|
840
|
+
position-area: bottom span-right;
|
|
841
|
+
position-try-fallbacks: flip-block;
|
|
842
|
+
width: calc(370 * var(--window-unit));
|
|
843
|
+
justify-items: center;
|
|
844
|
+
inset: auto;
|
|
845
|
+
}
|
|
846
|
+
|
|
847
|
+
.gVdevq_panel:popover-open {
|
|
848
|
+
display: grid;
|
|
849
|
+
}
|
|
850
|
+
|
|
851
|
+
.gVdevq_panel[data-empty] {
|
|
852
|
+
padding: calc(17 * var(--window-unit)) calc(20 * var(--window-unit));
|
|
853
|
+
width: auto;
|
|
854
|
+
}
|
|
855
|
+
|
|
856
|
+
.gVdevq_list {
|
|
857
|
+
column-gap: calc(8 * var(--window-unit));
|
|
858
|
+
grid-template-columns: minmax(calc(62 * var(--window-unit)), max-content) auto 1fr auto;
|
|
859
|
+
max-height: calc(8 * 32 * var(--window-unit));
|
|
860
|
+
width: 100%;
|
|
861
|
+
margin: 0;
|
|
862
|
+
padding: 0;
|
|
863
|
+
list-style: none;
|
|
864
|
+
display: grid;
|
|
865
|
+
overflow-y: auto;
|
|
866
|
+
}
|
|
867
|
+
|
|
868
|
+
.gVdevq_row {
|
|
869
|
+
grid-column: 1 / -1;
|
|
870
|
+
grid-template-columns: subgrid;
|
|
871
|
+
height: calc(32 * var(--window-unit));
|
|
872
|
+
padding: 0 calc(8 * var(--window-unit));
|
|
873
|
+
align-items: center;
|
|
874
|
+
display: grid;
|
|
875
|
+
}
|
|
876
|
+
|
|
877
|
+
.gVdevq_row:hover {
|
|
878
|
+
background: var(--esf-bay-row-hover);
|
|
879
|
+
}
|
|
880
|
+
|
|
881
|
+
.gVdevq_quantity {
|
|
882
|
+
border: var(--window-unit) solid transparent;
|
|
883
|
+
align-items: center;
|
|
884
|
+
column-gap: calc(8 * var(--window-unit));
|
|
885
|
+
padding: calc(5 * var(--window-unit)) calc(6 * var(--window-unit));
|
|
886
|
+
grid-template-columns: auto auto;
|
|
887
|
+
justify-self: end;
|
|
888
|
+
justify-items: center;
|
|
889
|
+
display: grid;
|
|
890
|
+
}
|
|
891
|
+
|
|
892
|
+
.gVdevq_count {
|
|
893
|
+
appearance: textfield;
|
|
894
|
+
color: inherit;
|
|
895
|
+
font: inherit;
|
|
896
|
+
font-variant-numeric: tabular-nums;
|
|
897
|
+
text-align: right;
|
|
898
|
+
background: none;
|
|
899
|
+
border: none;
|
|
900
|
+
padding: 0;
|
|
901
|
+
}
|
|
902
|
+
|
|
903
|
+
.gVdevq_count::-webkit-inner-spin-button {
|
|
904
|
+
appearance: none;
|
|
905
|
+
}
|
|
906
|
+
|
|
907
|
+
.gVdevq_count:focus {
|
|
908
|
+
outline: none;
|
|
909
|
+
}
|
|
910
|
+
|
|
911
|
+
.gVdevq_times, .gVdevq_steps {
|
|
912
|
+
grid-area: 1 / 2;
|
|
913
|
+
}
|
|
914
|
+
|
|
915
|
+
.gVdevq_steps {
|
|
916
|
+
visibility: hidden;
|
|
917
|
+
}
|
|
918
|
+
|
|
919
|
+
.gVdevq_steps > button {
|
|
920
|
+
cursor: default;
|
|
921
|
+
opacity: .6;
|
|
922
|
+
background: none;
|
|
923
|
+
border: none;
|
|
924
|
+
padding: 0;
|
|
925
|
+
display: block;
|
|
926
|
+
}
|
|
927
|
+
|
|
928
|
+
.gVdevq_steps > button:hover {
|
|
929
|
+
opacity: 1;
|
|
930
|
+
}
|
|
931
|
+
|
|
932
|
+
.gVdevq_steps img {
|
|
933
|
+
height: calc(8 * var(--window-unit));
|
|
934
|
+
width: calc(8 * var(--window-unit));
|
|
935
|
+
display: block;
|
|
936
|
+
}
|
|
937
|
+
|
|
938
|
+
.gVdevq_quantity:hover, .gVdevq_quantity:focus-within {
|
|
939
|
+
border-color: var(--esf-spinner-edge);
|
|
940
|
+
}
|
|
941
|
+
|
|
942
|
+
.gVdevq_quantity:hover .gVdevq_times, .gVdevq_quantity:focus-within .gVdevq_times {
|
|
943
|
+
visibility: hidden;
|
|
944
|
+
}
|
|
945
|
+
|
|
946
|
+
.gVdevq_quantity:hover .gVdevq_steps, .gVdevq_quantity:focus-within .gVdevq_steps {
|
|
947
|
+
visibility: visible;
|
|
948
|
+
}
|
|
949
|
+
|
|
950
|
+
.gVdevq_quantity:focus-within {
|
|
951
|
+
background: var(--esf-spinner-focus);
|
|
952
|
+
border-color: var(--esf-spinner-focus-edge);
|
|
953
|
+
}
|
|
954
|
+
|
|
955
|
+
.gVdevq_icon {
|
|
956
|
+
height: calc(24 * var(--window-unit));
|
|
957
|
+
width: calc(24 * var(--window-unit));
|
|
958
|
+
}
|
|
959
|
+
|
|
960
|
+
.gVdevq_icon > span {
|
|
961
|
+
width: 100%;
|
|
962
|
+
height: 100%;
|
|
963
|
+
display: block;
|
|
964
|
+
}
|
|
965
|
+
|
|
966
|
+
.gVdevq_middle {
|
|
967
|
+
gap: calc(6 * var(--window-unit));
|
|
968
|
+
min-width: 0;
|
|
969
|
+
display: grid;
|
|
970
|
+
}
|
|
971
|
+
|
|
972
|
+
.gVdevq_name {
|
|
973
|
+
text-align: center;
|
|
974
|
+
text-overflow: ellipsis;
|
|
975
|
+
white-space: nowrap;
|
|
976
|
+
overflow: hidden;
|
|
977
|
+
}
|
|
978
|
+
|
|
979
|
+
.gVdevq_activeDrones {
|
|
980
|
+
padding-left: calc(8 * var(--window-unit));
|
|
981
|
+
justify-self: start;
|
|
982
|
+
font-weight: 600;
|
|
983
|
+
}
|
|
984
|
+
|
|
985
|
+
.gVdevq_panel[data-drones] .gVdevq_list {
|
|
986
|
+
grid-template-columns: minmax(calc(52 * var(--window-unit)), max-content) auto 1fr auto;
|
|
987
|
+
max-height: calc(5 * 64 * var(--window-unit));
|
|
988
|
+
}
|
|
989
|
+
|
|
990
|
+
.gVdevq_panel[data-drones] .gVdevq_row {
|
|
991
|
+
height: calc(64 * var(--window-unit));
|
|
992
|
+
}
|
|
993
|
+
|
|
994
|
+
.gVdevq_panel[data-drones] .gVdevq_icon {
|
|
995
|
+
height: calc(60 * var(--window-unit));
|
|
996
|
+
width: calc(60 * var(--window-unit));
|
|
997
|
+
}
|
|
998
|
+
|
|
999
|
+
.gVdevq_panel[data-drones] .gVdevq_name {
|
|
1000
|
+
text-align: left;
|
|
1001
|
+
}
|
|
1002
|
+
|
|
1003
|
+
.gVdevq_selection {
|
|
1004
|
+
color: var(--esf-text-muted);
|
|
1005
|
+
align-items: center;
|
|
1006
|
+
gap: calc(3 * var(--window-unit));
|
|
1007
|
+
display: flex;
|
|
1008
|
+
}
|
|
1009
|
+
|
|
1010
|
+
.gVdevq_box {
|
|
1011
|
+
background: var(--esf-drone-box);
|
|
1012
|
+
border: var(--window-unit) solid var(--esf-button-edge);
|
|
1013
|
+
color: var(--esf-text);
|
|
1014
|
+
cursor: default;
|
|
1015
|
+
font-size: calc(10 * var(--window-unit));
|
|
1016
|
+
height: calc(13 * var(--window-unit));
|
|
1017
|
+
width: calc(13 * var(--window-unit));
|
|
1018
|
+
padding: 0;
|
|
1019
|
+
line-height: 1;
|
|
1020
|
+
}
|
|
1021
|
+
|
|
1022
|
+
.gVdevq_box:first-child {
|
|
1023
|
+
margin-left: calc(2 * var(--window-unit));
|
|
1024
|
+
}
|
|
1025
|
+
|
|
1026
|
+
.gVdevq_box[data-state="active"] {
|
|
1027
|
+
background: var(--esf-button-active);
|
|
1028
|
+
}
|
|
1029
|
+
|
|
1030
|
+
.gVdevq_box[data-state="open"] {
|
|
1031
|
+
background: var(--esf-drone-box-open);
|
|
1032
|
+
}
|
|
1033
|
+
|
|
1034
|
+
.gVdevq_box:enabled:hover {
|
|
1035
|
+
border-color: var(--esf-button-active-edge);
|
|
1036
|
+
}
|
|
1037
|
+
|
|
1038
|
+
.gVdevq_box[data-state="none"] {
|
|
1039
|
+
background: var(--esf-drone-box-empty);
|
|
1040
|
+
border-color: var(--esf-drone-box-empty);
|
|
1041
|
+
}
|
|
1042
|
+
|
|
1043
|
+
.gVdevq_remove {
|
|
1044
|
+
cursor: default;
|
|
1045
|
+
opacity: .6;
|
|
1046
|
+
background: none;
|
|
1047
|
+
border: none;
|
|
1048
|
+
padding: 0;
|
|
1049
|
+
}
|
|
1050
|
+
|
|
1051
|
+
.gVdevq_remove:hover, .gVdevq_remove:focus-visible {
|
|
1052
|
+
opacity: 1;
|
|
1053
|
+
}
|
|
1054
|
+
|
|
1055
|
+
.gVdevq_remove > img {
|
|
1056
|
+
height: calc(16 * var(--window-unit));
|
|
1057
|
+
width: calc(16 * var(--window-unit));
|
|
1058
|
+
display: block;
|
|
1059
|
+
}
|
|
1060
|
+
|
|
1061
|
+
.gVdevq_removeAll {
|
|
1062
|
+
background: var(--esf-button);
|
|
1063
|
+
border: var(--window-unit) solid var(--esf-button-edge);
|
|
1064
|
+
color: inherit;
|
|
1065
|
+
cursor: default;
|
|
1066
|
+
font: inherit;
|
|
1067
|
+
height: calc(31 * var(--window-unit));
|
|
1068
|
+
padding: 0 calc(14 * var(--window-unit));
|
|
1069
|
+
}
|
|
1070
|
+
|
|
1071
|
+
.gVdevq_removeAll:hover, .gVdevq_removeAll:focus-visible {
|
|
1072
|
+
background: var(--esf-button-active);
|
|
1073
|
+
border-color: var(--esf-button-active-edge);
|
|
1074
|
+
}
|
|
1075
|
+
|
|
1076
|
+
.gVdevq_remove:focus-visible, .gVdevq_removeAll:focus-visible, .gVdevq_box:focus-visible {
|
|
1077
|
+
outline: var(--window-unit) solid var(--esf-text);
|
|
1078
|
+
}
|
|
827
1079
|
.L9t91q_window {
|
|
828
1080
|
--window-unit: calc(1px * var(--esf-scale, 1));
|
|
829
1081
|
--browser-width: 0px;
|
|
@@ -831,9 +1083,9 @@
|
|
|
831
1083
|
color: var(--esf-text);
|
|
832
1084
|
font-family: var(--esf-font);
|
|
833
1085
|
font-size: calc(var(--esf-font-size) * var(--esf-scale, 1));
|
|
834
|
-
height: calc(
|
|
1086
|
+
height: calc(672 * var(--window-unit));
|
|
835
1087
|
user-select: none;
|
|
836
|
-
width: calc(
|
|
1088
|
+
width: calc(708 * var(--window-unit) + var(--browser-width) + var(--statistics-width));
|
|
837
1089
|
transition: width .2s;
|
|
838
1090
|
position: relative;
|
|
839
1091
|
}
|
|
@@ -843,11 +1095,11 @@
|
|
|
843
1095
|
}
|
|
844
1096
|
|
|
845
1097
|
.L9t91q_window[data-statistics] {
|
|
846
|
-
--statistics-width: calc(
|
|
1098
|
+
--statistics-width: calc(264 * var(--window-unit));
|
|
847
1099
|
}
|
|
848
1100
|
|
|
849
1101
|
.L9t91q_frame {
|
|
850
|
-
inset:
|
|
1102
|
+
inset: calc(29 * var(--window-unit)) auto 0 var(--browser-width);
|
|
851
1103
|
width: calc(700 * var(--window-unit));
|
|
852
1104
|
transition: left .2s;
|
|
853
1105
|
position: absolute;
|
|
@@ -1002,14 +1254,32 @@
|
|
|
1002
1254
|
}
|
|
1003
1255
|
|
|
1004
1256
|
.L9t91q_bay {
|
|
1257
|
+
color: inherit;
|
|
1005
1258
|
align-items: center;
|
|
1006
1259
|
column-gap: calc(5 * var(--window-unit));
|
|
1260
|
+
cursor: default;
|
|
1261
|
+
font: inherit;
|
|
1007
1262
|
line-height: calc(13 * var(--window-unit));
|
|
1263
|
+
background: none;
|
|
1264
|
+
border: none;
|
|
1008
1265
|
grid-template-columns: repeat(4, auto);
|
|
1009
1266
|
justify-content: start;
|
|
1267
|
+
padding: 0;
|
|
1010
1268
|
display: grid;
|
|
1011
1269
|
}
|
|
1012
1270
|
|
|
1271
|
+
.L9t91q_bayAnchor {
|
|
1272
|
+
anchor-name: var(--bay-anchor);
|
|
1273
|
+
}
|
|
1274
|
+
|
|
1275
|
+
.L9t91q_bay > * {
|
|
1276
|
+
pointer-events: none;
|
|
1277
|
+
}
|
|
1278
|
+
|
|
1279
|
+
.L9t91q_bay:focus-visible {
|
|
1280
|
+
outline: var(--window-unit) solid var(--esf-text);
|
|
1281
|
+
}
|
|
1282
|
+
|
|
1013
1283
|
.L9t91q_bay > img {
|
|
1014
1284
|
height: calc(32 * var(--window-unit));
|
|
1015
1285
|
width: calc(32 * var(--window-unit));
|
|
@@ -1069,8 +1339,8 @@
|
|
|
1069
1339
|
}
|
|
1070
1340
|
|
|
1071
1341
|
.L9t91q_browser, .L9t91q_statistics {
|
|
1072
|
-
bottom:
|
|
1073
|
-
top: calc(
|
|
1342
|
+
bottom: calc(16 * var(--window-unit));
|
|
1343
|
+
top: calc(64 * var(--window-unit));
|
|
1074
1344
|
position: absolute;
|
|
1075
1345
|
overflow: hidden;
|
|
1076
1346
|
}
|
|
@@ -1243,6 +1513,13 @@
|
|
|
1243
1513
|
overflow-y: auto;
|
|
1244
1514
|
}
|
|
1245
1515
|
|
|
1516
|
+
.xFSZwa_empty {
|
|
1517
|
+
color: var(--esf-text-muted);
|
|
1518
|
+
font-size: calc(20 * var(--browser-unit));
|
|
1519
|
+
margin: calc(24 * var(--browser-unit)) 0 0;
|
|
1520
|
+
text-align: center;
|
|
1521
|
+
}
|
|
1522
|
+
|
|
1246
1523
|
.xFSZwa_hull {
|
|
1247
1524
|
font-weight: 600;
|
|
1248
1525
|
}
|
package/dist/theme.css
CHANGED
|
@@ -50,6 +50,13 @@
|
|
|
50
50
|
--esf-tree-hover: #192024;
|
|
51
51
|
--esf-flyable: #00cef6;
|
|
52
52
|
--esf-not-flyable: #be181e;
|
|
53
|
+
--esf-bay-row-hover: #161f24;
|
|
54
|
+
--esf-drone-box: #193036;
|
|
55
|
+
--esf-drone-box-open: #2b4f59;
|
|
56
|
+
--esf-drone-box-empty: #0d1213;
|
|
57
|
+
--esf-spinner-edge: #161718;
|
|
58
|
+
--esf-spinner-focus: #1a2629;
|
|
59
|
+
--esf-spinner-focus-edge: #273437;
|
|
53
60
|
|
|
54
61
|
/* EVE's UI scale; 1 is 100%. */
|
|
55
62
|
--esf-scale: 1;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@eveshipfit/ui-ingame",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.2.0",
|
|
4
4
|
"description": "EVE Online ship fitting UI that looks like the in-game one",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"author": "EVEShipFit Team <info@eveship.fit>",
|
|
@@ -27,11 +27,11 @@
|
|
|
27
27
|
"access": "public"
|
|
28
28
|
},
|
|
29
29
|
"dependencies": {
|
|
30
|
-
"@eveshipfit/react-hooks": "1.
|
|
30
|
+
"@eveshipfit/react-hooks": "1.3.0"
|
|
31
31
|
},
|
|
32
32
|
"devDependencies": {
|
|
33
33
|
"@babel/core": "^7.29.0",
|
|
34
|
-
"@eveshipfit/images": "^1.
|
|
34
|
+
"@eveshipfit/images": "^1.3552227.1",
|
|
35
35
|
"@rolldown/plugin-babel": "^0.2.4",
|
|
36
36
|
"@storybook/react-vite": "^10.6.0",
|
|
37
37
|
"@tsdown/css": "^0.23.0",
|
|
@@ -43,11 +43,11 @@
|
|
|
43
43
|
"storybook": "^10.6.0",
|
|
44
44
|
"tsdown": "^0.23.0",
|
|
45
45
|
"vite": "^8.3.0",
|
|
46
|
-
"@eveshipfit/
|
|
47
|
-
"@eveshipfit/
|
|
46
|
+
"@eveshipfit/fitting": "1.2.0",
|
|
47
|
+
"@eveshipfit/sde-loader": "1.2.0"
|
|
48
48
|
},
|
|
49
49
|
"peerDependencies": {
|
|
50
|
-
"@eveshipfit/images": "^1.
|
|
50
|
+
"@eveshipfit/images": "^1.3552227.1",
|
|
51
51
|
"react": "^19.0.0",
|
|
52
52
|
"react-dom": "^19.0.0"
|
|
53
53
|
},
|