Blame view

src/styles/components/divider.less 2.1 KB
b26389a0   xiaofengsha   * 对照AntDesign,实现了...
1
2
  @divider-prefix-cls: ~"@{css-prefix}divider";
  
b26389a0   xiaofengsha   * 对照AntDesign,实现了...
3
  .@{divider-prefix-cls} {
a0141266   梁灏   update Divider style
4
5
      .reset-component;
      background: @border-color-split;
b26389a0   xiaofengsha   * 对照AntDesign,实现了...
6
  
a0141266   梁灏   update Divider style
7
8
9
10
11
12
13
14
15
      &, // for compatiable
      &-vertical {
          margin: 0 8px;
          display: inline-block;
          height: 0.9em;
          width: 1px;
          vertical-align: middle;
          position: relative;
          top: -0.06em;
b26389a0   xiaofengsha   * 对照AntDesign,实现了...
16
      }
a0141266   梁灏   update Divider style
17
18
19
20
21
22
      &-horizontal {
          display: block;
          height: 1px;
          width: 100%;
          margin: 24px 0;
          clear: both;
b26389a0   xiaofengsha   * 对照AntDesign,实现了...
23
      }
a0141266   梁灏   update Divider style
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
      &-horizontal&-with-text-center,
      &-horizontal&-with-text-left,
      &-horizontal&-with-text-right {
          display: table;
          white-space: nowrap;
          text-align: center;
          background: transparent;
          font-weight: 500;
          color: @title-color;
          font-size: @font-size-large;
          margin: 16px 0;
          &:before,
          &:after {
              content: '';
              display: table-cell;
              position: relative;
              top: 50%;
              width: 50%;
              border-top: 1px solid @border-color-split;
              transform: translateY(50%);
          }
b26389a0   xiaofengsha   * 对照AntDesign,实现了...
45
      }
b26389a0   xiaofengsha   * 对照AntDesign,实现了...
46
  
a0141266   梁灏   update Divider style
47
48
49
50
51
52
53
54
      &-horizontal&-with-text-left,
      &-horizontal&-with-text-right {
          font-size: @font-size-base;
          .@{divider-prefix-cls}-inner-text {
              display: inline-block;
              padding: 0 10px;
          }
      }
b26389a0   xiaofengsha   * 对照AntDesign,实现了...
55
  
a0141266   梁灏   update Divider style
56
57
58
59
60
61
62
63
64
      &-horizontal&-with-text-left {
          &:before {
              top: 50%;
              width: 5%;
          }
          &:after {
              top: 50%;
              width: 95%;
          }
b26389a0   xiaofengsha   * 对照AntDesign,实现了...
65
      }
a0141266   梁灏   update Divider style
66
67
68
69
70
71
72
73
74
75
  
      &-horizontal&-with-text-right {
          &:before {
              top: 50%;
              width: 95%;
          }
          &:after {
              top: 50%;
              width: 5%;
          }
b26389a0   xiaofengsha   * 对照AntDesign,实现了...
76
      }
a0141266   梁灏   update Divider style
77
  
b26389a0   xiaofengsha   * 对照AntDesign,实现了...
78
      &-inner-text {
a0141266   梁灏   update Divider style
79
80
81
82
83
84
85
          display: inline-block;
          padding: 0 24px;
      }
  
      &-dashed {
          background: none;
          border-top: 1px dashed @border-color-split;
b26389a0   xiaofengsha   * 对照AntDesign,实现了...
86
      }
a0141266   梁灏   update Divider style
87
88
89
90
91
92
93
94
      &-horizontal&-with-text&-dashed,
      &-horizontal&-with-text-left&-dashed,
      &-horizontal&-with-text-right&-dashed {
          border-top: 0;
          &:before,
          &:after {
              border-style: dashed none none;
          }
b26389a0   xiaofengsha   * 对照AntDesign,实现了...
95
      }
b26389a0   xiaofengsha   * 对照AntDesign,实现了...
96
  }