All files / src/bubble/_example BubbleContentExample.jsx

100% Statements 2/2
100% Branches 0/0
100% Functions 1/1
100% Lines 2/2

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29        1x 1x                                              
import React from "react";
import { BubbleContent } from "@tencent/tea-component/lib/bubble";
 
export default function BubbleExample() {
  const mr5 = { marginRight: 5 };
  return (
    <div style={{ position: "relative", height: 160 }}>
      <BubbleContent style={mr5}>气泡内容</BubbleContent>
      <BubbleContent style={mr5} error>
        异常提示
      </BubbleContent>
      <BubbleContent style={mr5} dark>
        反色提示
      </BubbleContent>
      <section
        style={{
          display: "block",
          marginTop: 12,
        }}
      >
        <BubbleContent style={mr5}>
          <strong>宽度自适应:</strong>
          近未来,科学家们发现太阳急速衰老膨胀,短时间内包括地球在内的整个太阳系都将被太阳所吞没。为了自救,人类提出一个名为“流浪地球”的大胆计划,即倾全球之力在地球表面建造上万座发动机和转向发动机,推动地球离开太阳系。
        </BubbleContent>
      </section>
    </div>
  );
}