@dckj-npm/dc-material 0.1.6 → 0.1.8

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.
Files changed (136) hide show
  1. package/build/index.js +12 -19
  2. package/build/lowcode/assets-daily.json +67 -0
  3. package/build/lowcode/assets-dev.json +67 -0
  4. package/build/lowcode/assets-prod.json +67 -0
  5. package/build/lowcode/designer.html +302 -0
  6. package/build/lowcode/index.html +304 -0
  7. package/build/lowcode/index.js +1 -0
  8. package/build/lowcode/meta.js +1 -0
  9. package/build/lowcode/preview.css +1 -0
  10. package/build/lowcode/preview.html +33 -0
  11. package/build/lowcode/preview.js +308 -0
  12. package/build/lowcode/render/default/view.css +1 -0
  13. package/build/lowcode/render/default/view.js +295 -0
  14. package/build/lowcode/view.css +1 -0
  15. package/build/lowcode/view.js +295 -0
  16. package/dist/BizComps.css +1 -1
  17. package/dist/BizComps.js +5 -5
  18. package/dist/BizComps.js.map +1 -1
  19. package/es/components/bottom-navigation/bottom-navigation.d.ts +13 -13
  20. package/es/components/bottom-navigation/index.d.ts +3 -3
  21. package/es/components/colorful-button/colorful-button.d.ts +12 -12
  22. package/es/components/colorful-button/index.d.ts +3 -3
  23. package/es/components/colorful-input/colorful-input.d.ts +8 -8
  24. package/es/components/colorful-input/index.d.ts +3 -3
  25. package/es/components/dc-slider/index.d.ts +3 -3
  26. package/es/components/dc-slider/slider.d.ts +32 -32
  27. package/es/components/menu-list/index.d.ts +6 -0
  28. package/es/components/menu-list/index.js +6 -0
  29. package/es/components/menu-list/index.scss +16 -0
  30. package/es/components/menu-list/menu-list-item.d.ts +5 -0
  31. package/es/components/menu-list/menu-list-item.js +32 -0
  32. package/es/components/menu-list/menu-list-item.scss +49 -0
  33. package/es/components/menu-list/menu-list.d.ts +5 -0
  34. package/es/components/menu-list/menu-list.js +25 -0
  35. package/es/components/menu-list/types.d.ts +23 -0
  36. package/es/components/menu-list/types.js +1 -0
  37. package/es/components/teletext-list/index.d.ts +6 -6
  38. package/es/components/teletext-list/index.js +2 -2
  39. package/es/components/teletext-list/index.scss +16 -16
  40. package/es/components/teletext-list/teletext-list-item.d.ts +42 -42
  41. package/es/components/teletext-list/teletext-list-item.js +2 -2
  42. package/es/components/teletext-list/teletext-list-item.scss +74 -74
  43. package/es/components/teletext-list/teletext-list.d.ts +53 -53
  44. package/es/components/teletext-list/teletext-list.js +2 -2
  45. package/es/components/title/index.d.ts +8 -8
  46. package/es/components/title/index.js +2 -2
  47. package/es/components/title/title-1.d.ts +10 -10
  48. package/es/components/title/title-1.scss +26 -26
  49. package/es/components/title/title-2.d.ts +18 -18
  50. package/es/components/title/title-2.scss +22 -22
  51. package/es/index.d.ts +14 -12
  52. package/es/index.js +1 -0
  53. package/es/index.scss +3 -3
  54. package/es/variables.d.ts +2 -2
  55. package/lib/components/bottom-navigation/bottom-navigation.d.ts +13 -13
  56. package/lib/components/bottom-navigation/index.d.ts +3 -3
  57. package/lib/components/colorful-button/colorful-button.d.ts +12 -12
  58. package/lib/components/colorful-button/index.d.ts +3 -3
  59. package/lib/components/colorful-input/colorful-input.d.ts +8 -8
  60. package/lib/components/colorful-input/index.d.ts +3 -3
  61. package/lib/components/dc-slider/index.d.ts +3 -3
  62. package/lib/components/dc-slider/slider.d.ts +32 -32
  63. package/lib/components/menu-list/index.d.ts +6 -0
  64. package/lib/components/{position → menu-list}/index.js +5 -2
  65. package/lib/components/menu-list/index.scss +16 -0
  66. package/lib/components/menu-list/menu-list-item.d.ts +5 -0
  67. package/lib/components/menu-list/menu-list-item.js +37 -0
  68. package/lib/components/menu-list/menu-list-item.scss +49 -0
  69. package/lib/components/menu-list/menu-list.d.ts +5 -0
  70. package/lib/components/menu-list/menu-list.js +30 -0
  71. package/lib/components/menu-list/types.d.ts +23 -0
  72. package/lib/components/menu-list/types.js +3 -0
  73. package/lib/components/teletext-list/index.d.ts +6 -6
  74. package/lib/components/teletext-list/index.js +2 -2
  75. package/lib/components/teletext-list/index.scss +16 -16
  76. package/lib/components/teletext-list/teletext-list-item.d.ts +42 -42
  77. package/lib/components/teletext-list/teletext-list-item.js +2 -2
  78. package/lib/components/teletext-list/teletext-list-item.scss +74 -74
  79. package/lib/components/teletext-list/teletext-list.d.ts +53 -53
  80. package/lib/components/teletext-list/teletext-list.js +2 -2
  81. package/lib/components/title/index.d.ts +8 -8
  82. package/lib/components/title/title-1.d.ts +10 -10
  83. package/lib/components/title/title-1.scss +26 -26
  84. package/lib/components/title/title-2.d.ts +18 -18
  85. package/lib/components/title/title-2.scss +22 -22
  86. package/lib/index.d.ts +14 -12
  87. package/lib/index.js +3 -1
  88. package/lib/index.scss +3 -3
  89. package/lib/variables.d.ts +2 -2
  90. package/lowcode/d-c-slider/meta.ts +1 -1
  91. package/lowcode/d-c-slider/snippets.ts +42 -42
  92. package/lowcode/menu-list/meta.ts +147 -0
  93. package/lowcode/navigation/meta.ts +1 -1
  94. package/lowcode/teletext-list/meta.ts +300 -300
  95. package/lowcode/title1/meta.ts +59 -59
  96. package/lowcode/title2/meta.ts +93 -93
  97. package/lowcode_es/d-c-slider/meta.d.ts +140 -140
  98. package/lowcode_es/d-c-slider/meta.js +1 -1
  99. package/lowcode_es/d-c-slider/snippets.d.ts +36 -36
  100. package/lowcode_es/menu-list/meta.d.ts +22 -0
  101. package/lowcode_es/menu-list/meta.js +128 -0
  102. package/lowcode_es/meta.js +8 -7
  103. package/lowcode_es/navigation/meta.d.ts +22 -22
  104. package/lowcode_es/navigation/meta.js +1 -1
  105. package/lowcode_es/teletext-list/meta.d.ts +22 -22
  106. package/lowcode_es/teletext-list/meta.js +8 -3
  107. package/lowcode_es/title1/meta.d.ts +22 -22
  108. package/lowcode_es/title1/meta.js +2 -1
  109. package/lowcode_es/title2/meta.d.ts +22 -22
  110. package/lowcode_es/title2/meta.js +2 -1
  111. package/lowcode_es/view.js +3 -3
  112. package/lowcode_lib/d-c-slider/meta.d.ts +140 -140
  113. package/lowcode_lib/d-c-slider/meta.js +1 -1
  114. package/lowcode_lib/d-c-slider/snippets.d.ts +36 -36
  115. package/lowcode_lib/menu-list/meta.d.ts +22 -0
  116. package/lowcode_lib/menu-list/meta.js +133 -0
  117. package/lowcode_lib/meta.js +8 -7
  118. package/lowcode_lib/navigation/meta.d.ts +22 -22
  119. package/lowcode_lib/navigation/meta.js +1 -1
  120. package/lowcode_lib/teletext-list/meta.d.ts +22 -22
  121. package/lowcode_lib/teletext-list/meta.js +8 -3
  122. package/lowcode_lib/title1/meta.d.ts +22 -22
  123. package/lowcode_lib/title1/meta.js +2 -1
  124. package/lowcode_lib/title2/meta.d.ts +22 -22
  125. package/lowcode_lib/title2/meta.js +2 -1
  126. package/lowcode_lib/view.js +2 -2
  127. package/package.json +4 -4
  128. package/es/components/position/index.d.ts +0 -3
  129. package/es/components/position/index.js +0 -2
  130. package/es/components/position/index.scss +0 -16
  131. package/es/components/position/position.d.ts +0 -13
  132. package/es/components/position/position.js +0 -39
  133. package/lib/components/position/index.d.ts +0 -3
  134. package/lib/components/position/index.scss +0 -16
  135. package/lib/components/position/position.d.ts +0 -13
  136. package/lib/components/position/position.js +0 -46
@@ -1,13 +1,13 @@
1
- import * as React from 'react';
2
- import './index.scss';
3
- interface Navigation {
4
- text: string;
5
- icon: string;
6
- selectedIcon: string;
7
- }
8
- export interface NavigationProps {
9
- itemArray: Navigation[];
10
- selectedColor: string;
11
- }
12
- declare const Navigation: React.FC<NavigationProps>;
13
- export default Navigation;
1
+ import * as React from 'react';
2
+ import './index.scss';
3
+ interface Navigation {
4
+ text: string;
5
+ icon: string;
6
+ selectedIcon: string;
7
+ }
8
+ export interface NavigationProps {
9
+ itemArray: Navigation[];
10
+ selectedColor: string;
11
+ }
12
+ declare const Navigation: React.FC<NavigationProps>;
13
+ export default Navigation;
@@ -1,3 +1,3 @@
1
- import Navigation from './bottom-navigation';
2
- export type { NavigationProps } from './bottom-navigation';
3
- export default Navigation;
1
+ import Navigation from './bottom-navigation';
2
+ export type { NavigationProps } from './bottom-navigation';
3
+ export default Navigation;
@@ -1,12 +1,12 @@
1
- import * as React from 'react';
2
- import './index.scss';
3
- export interface ColorfulButtonProps {
4
- /**
5
- * 类型
6
- */
7
- type?: "primary" | "secondary" | "normal";
8
- color?: string;
9
- style?: object;
10
- }
11
- declare const ColorfulButton: React.FC<ColorfulButtonProps>;
12
- export default ColorfulButton;
1
+ import * as React from 'react';
2
+ import './index.scss';
3
+ export interface ColorfulButtonProps {
4
+ /**
5
+ * 类型
6
+ */
7
+ type?: "primary" | "secondary" | "normal";
8
+ color?: string;
9
+ style?: object;
10
+ }
11
+ declare const ColorfulButton: React.FC<ColorfulButtonProps>;
12
+ export default ColorfulButton;
@@ -1,3 +1,3 @@
1
- import ColorfulButton from './colorful-button';
2
- export type { ColorfulButtonProps } from './colorful-button';
3
- export default ColorfulButton;
1
+ import ColorfulButton from './colorful-button';
2
+ export type { ColorfulButtonProps } from './colorful-button';
3
+ export default ColorfulButton;
@@ -1,8 +1,8 @@
1
- import * as React from 'react';
2
- import './index.scss';
3
- export interface ColorfulInputProps {
4
- color?: string;
5
- style?: object;
6
- }
7
- declare const ColorfulInput: React.FC<ColorfulInputProps>;
8
- export default ColorfulInput;
1
+ import * as React from 'react';
2
+ import './index.scss';
3
+ export interface ColorfulInputProps {
4
+ color?: string;
5
+ style?: object;
6
+ }
7
+ declare const ColorfulInput: React.FC<ColorfulInputProps>;
8
+ export default ColorfulInput;
@@ -1,3 +1,3 @@
1
- import ColorfulInput from './colorful-input';
2
- export type { ColorfulInputProps } from './colorful-input';
3
- export default ColorfulInput;
1
+ import ColorfulInput from './colorful-input';
2
+ export type { ColorfulInputProps } from './colorful-input';
3
+ export default ColorfulInput;
@@ -1,3 +1,3 @@
1
- import DCSlider from './slider';
2
- export type { ComponentProps } from './slider';
3
- export default DCSlider;
1
+ import DCSlider from './slider';
2
+ export type { ComponentProps } from './slider';
3
+ export default DCSlider;
@@ -1,32 +1,32 @@
1
- import * as React from 'react';
2
- import './index.scss';
3
- export interface ComponentProps {
4
- prefix: string;
5
- animation: string;
6
- arrows: true;
7
- arrowSize: string;
8
- arrowPosition: string;
9
- arrowDirection: string;
10
- autoplaySpeed: number;
11
- dots: boolean;
12
- dotsDirection: string;
13
- draggable: boolean;
14
- infinite: boolean;
15
- slide: string;
16
- slideDirection: string;
17
- slidesToShow: number;
18
- slidesToScroll: number;
19
- speed: number;
20
- triggerType: string;
21
- centerPadding: string;
22
- cssEase: string;
23
- edgeFriction: number;
24
- swipe: boolean;
25
- touchMove: boolean;
26
- touchThreshold: number;
27
- useCSS: boolean;
28
- waitForAnimate: boolean;
29
- picUrls: string[];
30
- }
31
- declare const DCSlider: React.FC<ComponentProps>;
32
- export default DCSlider;
1
+ import * as React from 'react';
2
+ import './index.scss';
3
+ export interface ComponentProps {
4
+ prefix: string;
5
+ animation: string;
6
+ arrows: true;
7
+ arrowSize: string;
8
+ arrowPosition: string;
9
+ arrowDirection: string;
10
+ autoplaySpeed: number;
11
+ dots: boolean;
12
+ dotsDirection: string;
13
+ draggable: boolean;
14
+ infinite: boolean;
15
+ slide: string;
16
+ slideDirection: string;
17
+ slidesToShow: number;
18
+ slidesToScroll: number;
19
+ speed: number;
20
+ triggerType: string;
21
+ centerPadding: string;
22
+ cssEase: string;
23
+ edgeFriction: number;
24
+ swipe: boolean;
25
+ touchMove: boolean;
26
+ touchThreshold: number;
27
+ useCSS: boolean;
28
+ waitForAnimate: boolean;
29
+ picUrls: string[];
30
+ }
31
+ declare const DCSlider: React.FC<ComponentProps>;
32
+ export default DCSlider;
@@ -0,0 +1,6 @@
1
+ /**
2
+ * 菜单列表
3
+ */
4
+ import MenuList from './menu-list';
5
+ export type { MenuListDataProps, MenuListProps } from './types';
6
+ export default MenuList;
@@ -0,0 +1,6 @@
1
+ /**
2
+ * 菜单列表
3
+ */
4
+
5
+ import MenuList from "./menu-list";
6
+ export default MenuList;
@@ -0,0 +1,16 @@
1
+ @import '../../variables.scss';
2
+
3
+ .menu-list__panel {
4
+ border-radius: 10px;
5
+ background-color: white;
6
+
7
+ .menu-list__panel__item-list {
8
+ display: flex;
9
+ flex-direction: column;
10
+ gap: 2px;
11
+ padding: 1px 22px;
12
+ }
13
+
14
+ }
15
+
16
+
@@ -0,0 +1,5 @@
1
+ import React from 'react';
2
+ import { MenuListDataProps } from "./types";
3
+ import "./menu-list-item.scss";
4
+ declare const MenuListItem: React.FC<MenuListDataProps>;
5
+ export default MenuListItem;
@@ -0,0 +1,32 @@
1
+ import React from 'react';
2
+ import "./menu-list-item.scss";
3
+ var MenuListItem = function MenuListItem(_ref) {
4
+ var _ref$title = _ref.title,
5
+ title = _ref$title === void 0 ? '菜单名称' : _ref$title,
6
+ _ref$iconUrl = _ref.iconUrl,
7
+ iconUrl = _ref$iconUrl === void 0 ? '' : _ref$iconUrl,
8
+ handleClick = _ref.handleClick;
9
+ return /*#__PURE__*/React.createElement("div", {
10
+ className: "menu-list__panel__item",
11
+ onClick: handleClick
12
+ }, iconUrl ? /*#__PURE__*/React.createElement("div", {
13
+ className: "menu-list__panel__item_icon"
14
+ }, /*#__PURE__*/React.createElement("img", {
15
+ alt: "",
16
+ src: iconUrl
17
+ })) : null, /*#__PURE__*/React.createElement("div", {
18
+ className: "menu-list__panel__item_title"
19
+ }, title), /*#__PURE__*/React.createElement("div", {
20
+ className: "menu-list__panel__item_right"
21
+ }, /*#__PURE__*/React.createElement("svg", {
22
+ xmlns: "http://www.w3.org/2000/svg",
23
+ width: "32",
24
+ height: "32",
25
+ viewBox: "0 0 32 32"
26
+ }, /*#__PURE__*/React.createElement("path", {
27
+ fill: "currentColor",
28
+ d: "M22 16L12 26l-1.4-1.4l8.6-8.6l-8.6-8.6L12 6z"
29
+ }))));
30
+ };
31
+ MenuListItem.displayName = 'MenuListItem';
32
+ export default MenuListItem;
@@ -0,0 +1,49 @@
1
+ @import '../../variables.scss';
2
+
3
+ .menu-list__panel__item {
4
+ display: flex;
5
+ gap: 7px;
6
+ justify-content: space-between;
7
+ align-items: center;
8
+ height: 45px;
9
+
10
+ border-bottom: 1px solid rgba(0, 0, 0, 0.1);
11
+
12
+ &:last-child {
13
+ border-bottom: none;
14
+ }
15
+
16
+ .menu-list__panel__item_icon {
17
+ height: 100%;
18
+ display: flex;
19
+ align-items: center;
20
+
21
+ & > img {
22
+ height: 15px;
23
+ }
24
+ }
25
+
26
+ .menu-list__panel__item_title {
27
+ font-size: 15px;
28
+ color: #666666;
29
+ font-weight: 500;
30
+ margin-right: auto;
31
+ }
32
+
33
+ .menu-list__panel__item_right {
34
+ height: 100%;
35
+ display: flex;
36
+ align-items: center;
37
+
38
+ & > svg {
39
+ height: 16px;
40
+ font-size: 12px;
41
+ color: #666666;
42
+ font-weight: 500;
43
+ }
44
+
45
+
46
+ }
47
+
48
+
49
+ }
@@ -0,0 +1,5 @@
1
+ import React from 'react';
2
+ import './index.scss';
3
+ import { MenuListProps } from "./types";
4
+ declare const MenuList: React.FC<MenuListProps>;
5
+ export default MenuList;
@@ -0,0 +1,25 @@
1
+ import _extends from "@babel/runtime/helpers/extends";
2
+ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
3
+ var _excluded = ["dataList"];
4
+ import React from 'react';
5
+ import "./index.scss";
6
+ import MenuListItem from "./menu-list-item";
7
+ var MenuList = function MenuList(_ref) {
8
+ var dataList = _ref.dataList,
9
+ otherProps = _objectWithoutPropertiesLoose(_ref, _excluded);
10
+ var _otherProps = otherProps || {};
11
+ return /*#__PURE__*/React.createElement("div", _extends({
12
+ className: "menu-list__panel"
13
+ }, _otherProps), /*#__PURE__*/React.createElement("div", {
14
+ className: "menu-list__panel__item-list"
15
+ }, dataList.map(function (item, index) {
16
+ return /*#__PURE__*/React.createElement(MenuListItem, {
17
+ key: index,
18
+ title: item.title,
19
+ iconUrl: item.iconUrl,
20
+ handleClick: item.handleClick
21
+ });
22
+ })));
23
+ };
24
+ MenuList.displayName = 'MenuList';
25
+ export default MenuList;
@@ -0,0 +1,23 @@
1
+ /**
2
+ * 数据
3
+ */
4
+ export interface MenuListDataProps {
5
+ /**
6
+ * 菜单名称
7
+ */
8
+ title: string;
9
+ /**
10
+ * 菜单图标地址
11
+ */
12
+ iconUrl?: string;
13
+ /**
14
+ * 点击事件
15
+ */
16
+ handleClick?: Function;
17
+ }
18
+ export interface MenuListProps {
19
+ /**
20
+ * 数据
21
+ */
22
+ dataList?: MenuListDataProps[];
23
+ }
@@ -0,0 +1 @@
1
+ export {};
@@ -1,6 +1,6 @@
1
- /**
2
- * 图文列表
3
- */
4
- import TeletextList from './teletext-list';
5
- export type { TeletextListProps } from './teletext-list';
6
- export default TeletextList;
1
+ /**
2
+ * 图文列表
3
+ */
4
+ import TeletextList from './teletext-list';
5
+ export type { TeletextListProps } from './teletext-list';
6
+ export default TeletextList;
@@ -1,5 +1,5 @@
1
- /**
2
- * 图文列表
1
+ /**
2
+ * 图文列表
3
3
  */
4
4
 
5
5
  import TeletextList from "./teletext-list";
@@ -1,16 +1,16 @@
1
- @import '../../variables.scss';
2
-
3
- .teletext-list__panel {
4
- display: flex;
5
- flex-direction: column;
6
- gap: 10px;
7
-
8
- .teletext-list__panel__item-list {
9
- display: flex;
10
- flex-direction: column;
11
- gap: 10px;
12
- }
13
-
14
- }
15
-
16
-
1
+ @import '../../variables.scss';
2
+
3
+ .teletext-list__panel {
4
+ display: flex;
5
+ flex-direction: column;
6
+ gap: 10px;
7
+
8
+ .teletext-list__panel__item-list {
9
+ display: flex;
10
+ flex-direction: column;
11
+ gap: 10px;
12
+ }
13
+
14
+ }
15
+
16
+
@@ -1,42 +1,42 @@
1
- import React from 'react';
2
- import './teletext-list-item.scss';
3
- /**
4
- * 数据
5
- */
6
- interface TeletextListItemProps {
7
- /**
8
- * 点击事件
9
- */
10
- onClick?: (e: any) => void;
11
- /**
12
- * 标题
13
- */
14
- title?: string;
15
- /**
16
- * 图片地址
17
- */
18
- image?: string;
19
- /**
20
- * 图片位置
21
- */
22
- imagePlacement?: "left" | "right" | "none";
23
- /**
24
- * 说明
25
- */
26
- description?: string;
27
- /**
28
- * 标签列表
29
- */
30
- tags?: {
31
- /**
32
- * 标签名称
33
- */
34
- name: string;
35
- /**
36
- * 标签颜色
37
- */
38
- color: string;
39
- }[];
40
- }
41
- declare const TeletextListItem: React.FC<TeletextListItemProps>;
42
- export default TeletextListItem;
1
+ import React from 'react';
2
+ import './teletext-list-item.scss';
3
+ /**
4
+ * 数据
5
+ */
6
+ interface TeletextListItemProps {
7
+ /**
8
+ * 点击事件
9
+ */
10
+ onClick?: (e: any) => void;
11
+ /**
12
+ * 标题
13
+ */
14
+ title?: string;
15
+ /**
16
+ * 图片地址
17
+ */
18
+ image?: string;
19
+ /**
20
+ * 图片位置
21
+ */
22
+ imagePlacement?: "left" | "right" | "none";
23
+ /**
24
+ * 说明
25
+ */
26
+ description?: string;
27
+ /**
28
+ * 标签列表
29
+ */
30
+ tags?: {
31
+ /**
32
+ * 标签名称
33
+ */
34
+ name: string;
35
+ /**
36
+ * 标签颜色
37
+ */
38
+ color: string;
39
+ }[];
40
+ }
41
+ declare const TeletextListItem: React.FC<TeletextListItemProps>;
42
+ export default TeletextListItem;
@@ -4,8 +4,8 @@ var _excluded = ["onClick", "title", "image", "imagePlacement", "description", "
4
4
  import React from 'react';
5
5
  import "./teletext-list-item.scss";
6
6
 
7
- /**
8
- * 数据
7
+ /**
8
+ * 数据
9
9
  */
10
10
 
11
11
  var TeletextListItem = function TeletextListItem(_ref) {
@@ -1,74 +1,74 @@
1
- @import '../../variables.scss';
2
-
3
- .teletext-list__panel__item {
4
- display: flex;
5
- gap: 5px;
6
- padding-bottom: 10px;
7
- justify-content: space-between;
8
-
9
- border-bottom: 1px solid rgba(0, 0, 0, 0.1);
10
-
11
- .teletext-list__panel__item_image {
12
- width: 90px;
13
- height: 71px;
14
- border-radius: 5px;
15
- flex: 0 0 auto;
16
- overflow: hidden;
17
-
18
- & > img {
19
- width: 100%;
20
- height: 100%;
21
- object-fit: cover;
22
- }
23
-
24
- }
25
-
26
- .teletext-list__panel__item__text {
27
- display: flex;
28
- flex-direction: column;
29
- gap: 3px;
30
-
31
- .teletext-list__panel__item__text__title {
32
- font-size: 15px;
33
- font-weight: 500;
34
- color: #000000;
35
- }
36
-
37
- .teletext-list__panel__item__text__description {
38
- -webkit-line-clamp: 1;
39
- overflow: hidden;
40
- color: #686868;
41
- -webkit-box-orient: vertical;
42
- display: -webkit-box;
43
- font-size: 12px;
44
- text-overflow: ellipsis;
45
- }
46
-
47
- .teletext-list__panel__item__text__tags {
48
- display: flex;
49
- gap: 6px;
50
-
51
- & > span {
52
- padding: 2px 6px;
53
- border-radius: 4px;
54
- background-color: black;
55
- color: white;
56
- font-size: 11px;
57
-
58
- &.orange {
59
- color: #F1770E;
60
- background-color: rgba(241, 119, 14, 0.1);
61
- }
62
-
63
- &.blue {
64
- color: #2972DD;
65
- background-color: rgba(41, 114, 221, 0.1);
66
- }
67
-
68
- }
69
-
70
- }
71
-
72
- }
73
-
74
- }
1
+ @import '../../variables.scss';
2
+
3
+ .teletext-list__panel__item {
4
+ display: flex;
5
+ gap: 5px;
6
+ padding-bottom: 10px;
7
+ justify-content: space-between;
8
+
9
+ border-bottom: 1px solid rgba(0, 0, 0, 0.1);
10
+
11
+ .teletext-list__panel__item_image {
12
+ width: 90px;
13
+ height: 71px;
14
+ border-radius: 5px;
15
+ flex: 0 0 auto;
16
+ overflow: hidden;
17
+
18
+ & > img {
19
+ width: 100%;
20
+ height: 100%;
21
+ object-fit: cover;
22
+ }
23
+
24
+ }
25
+
26
+ .teletext-list__panel__item__text {
27
+ display: flex;
28
+ flex-direction: column;
29
+ gap: 3px;
30
+
31
+ .teletext-list__panel__item__text__title {
32
+ font-size: 15px;
33
+ font-weight: 500;
34
+ color: #000000;
35
+ }
36
+
37
+ .teletext-list__panel__item__text__description {
38
+ -webkit-line-clamp: 1;
39
+ overflow: hidden;
40
+ color: #686868;
41
+ -webkit-box-orient: vertical;
42
+ display: -webkit-box;
43
+ font-size: 12px;
44
+ text-overflow: ellipsis;
45
+ }
46
+
47
+ .teletext-list__panel__item__text__tags {
48
+ display: flex;
49
+ gap: 6px;
50
+
51
+ & > span {
52
+ padding: 2px 6px;
53
+ border-radius: 4px;
54
+ background-color: black;
55
+ color: white;
56
+ font-size: 11px;
57
+
58
+ &.orange {
59
+ color: #F1770E;
60
+ background-color: rgba(241, 119, 14, 0.1);
61
+ }
62
+
63
+ &.blue {
64
+ color: #2972DD;
65
+ background-color: rgba(41, 114, 221, 0.1);
66
+ }
67
+
68
+ }
69
+
70
+ }
71
+
72
+ }
73
+
74
+ }