← All changes | widgets/table/css/table.scss +83 -83 1.3.9 → 1.2.1 View file →

		@@ -1,83 +1,83 @@
1		-:root {
2		- --e-global-color-primary: #FFD012;
3		- --e-global-color-secondary: #0B3665;
4		-}
5		-
6		-.easyel-table.table {
7		- overflow: hidden;
8		- width: 100%;
9		-}
10		-
11		-.easyel-tooltip {
12		- position: relative;
13		- display: inline-block;
14		- cursor: pointer;
15		- line-height: 0;
16		- top: 3px;
17		- left: 4px;
18		- svg{
19		- height: 1em;
20		- width: 1em;
21		- }
22		-}
23		-
24		-.easyel-tooltip .easyel-tooltip-content {
25		- position: absolute;
26		- bottom: 125%; /* show above icon */
27		- left: 50%;
28		- transform: translateX(-50%);
29		- background: #121212;
30		- color: #fff;
31		- padding: 5px 8px;
32		- font-size: 13px;
33		- border-radius: 4px;
34		- white-space: nowrap;
35		- opacity: 0;
36		- pointer-events: none;
37		- transition: opacity 0.3s ease, transform 0.3s ease;
38		- z-index: 9999;
39		-}
40		-
41		-.easyel-tooltip.show .easyel-tooltip-content {
42		- opacity: 1;
43		- pointer-events: auto;
44		- transform: translateX(-50%) translateY(-5px);
45		-}
46		-
47		-.easyel-header-icon {
48		- position: relative;
49		- display: inline-block;
50		- cursor: pointer;
51		- line-height: 0;
52		- top: 4px;
53		- left: 0;
54		- margin-right: 10px;
55		- svg {
56		- width: 15px;
57		- height: auto;
58		- fill: currentColor;
59		- }
60		-}
61		-
62		-.easyel-table-body td.data-flex {
63		- display: flex;
64		- align-items: center;
65		- gap: 10px;
66		-}
67		-
68		-.easyel-table-body .easyel-table-image {
69		- width: 100%;
70		- max-width: 40px;
71		- height: 40px;
72		- object-fit: cover;
73		-}
74		-
75		-@media (max-width: 880px) {
76		- .easyel-table.table {
77		- display: block;
78		- overflow: scroll;
79		- }
80		- .table.easyel-table .easyel-table-body td {
81		- min-width: 150px;
82		- }
83		-}
	1	+:root {
	2	+ --e-global-color-primary: #FFD012;
	3	+ --e-global-color-secondary: #0B3665;
	4	+}
	5	+
	6	+.easyel-table.table {
	7	+ overflow: hidden;
	8	+ width: 100%;
	9	+}
	10	+
	11	+.easyel-tooltip {
	12	+ position: relative;
	13	+ display: inline-block;
	14	+ cursor: pointer;
	15	+ line-height: 0;
	16	+ top: 3px;
	17	+ left: 4px;
	18	+ svg{
	19	+ height: 1em;
	20	+ width: 1em;
	21	+ }
	22	+}
	23	+
	24	+.easyel-tooltip .easyel-tooltip-content {
	25	+ position: absolute;
	26	+ bottom: 125%; /* show above icon */
	27	+ left: 50%;
	28	+ transform: translateX(-50%);
	29	+ background: #121212;
	30	+ color: #fff;
	31	+ padding: 5px 8px;
	32	+ font-size: 13px;
	33	+ border-radius: 4px;
	34	+ white-space: nowrap;
	35	+ opacity: 0;
	36	+ pointer-events: none;
	37	+ transition: opacity 0.3s ease, transform 0.3s ease;
	38	+ z-index: 9999;
	39	+}
	40	+
	41	+.easyel-tooltip.show .easyel-tooltip-content {
	42	+ opacity: 1;
	43	+ pointer-events: auto;
	44	+ transform: translateX(-50%) translateY(-5px);
	45	+}
	46	+
	47	+.easyel-header-icon {
	48	+ position: relative;
	49	+ display: inline-block;
	50	+ cursor: pointer;
	51	+ line-height: 0;
	52	+ top: 4px;
	53	+ left: 0;
	54	+ margin-right: 10px;
	55	+ svg {
	56	+ width: 15px;
	57	+ height: auto;
	58	+ fill: currentColor;
	59	+ }
	60	+}
	61	+
	62	+.easyel-table-body td.data-flex {
	63	+ display: flex;
	64	+ align-items: center;
	65	+ gap: 10px;
	66	+}
	67	+
	68	+.easyel-table-body .easyel-table-image {
	69	+ width: 100%;
	70	+ max-width: 40px;
	71	+ height: 40px;
	72	+ object-fit: cover;
	73	+}
	74	+
	75	+@media (max-width: 880px) {
	76	+ .easyel-table.table {
	77	+ display: block;
	78	+ overflow: scroll;
	79	+ }
	80	+ .table.easyel-table .easyel-table-body td {
	81	+ min-width: 150px;
	82	+ }
	83	+}