Commit | Line | Data |
---|---|---|
b8eab696 | 1 | .messageTabMenu { |
299eb8b4 | 2 | > .messageTabMenuContent { |
b8eab696 | 3 | display: none; |
8a52619a | 4 | |
71212588 MS |
5 | &:not(.messageTabMenu) { |
6 | > nav.menu { | |
7 | display: none; | |
8 | } | |
9 | } | |
8a52619a | 10 | |
b8eab696 | 11 | &.active { |
1a75e228 | 12 | background-color: var(--wcfContentBackground); |
b8eab696 | 13 | display: block; |
299eb8b4 | 14 | margin-top: 0; |
b8eab696 | 15 | } |
8a52619a | 16 | |
71212588 MS |
17 | > .section:first-child { |
18 | margin-top: 0; | |
19 | } | |
b8eab696 | 20 | } |
8a52619a | 21 | |
299eb8b4 AE |
22 | // prevent double formatting with nested tab menus |
23 | &:not(.messageTabMenuContent) > .messageTabMenuContent.active { | |
1a75e228 | 24 | border: 1px solid var(--wcfContentBorderInner); |
299eb8b4 AE |
25 | border-top-width: 0; |
26 | padding: 20px; | |
27 | } | |
8a52619a | 28 | |
299eb8b4 AE |
29 | // sub tab menu |
30 | &.messageTabMenuContent > nav { | |
1a75e228 | 31 | border-bottom: 1px solid var(--wcfContentBorderInner); |
299eb8b4 AE |
32 | margin: -20px -20px 20px -20px; |
33 | padding: 5px 20px; | |
8a52619a | 34 | |
299eb8b4 | 35 | > ul { |
5908f54f | 36 | @include inlineList; |
8a52619a | 37 | |
71212588 | 38 | border: 0; |
8a52619a | 39 | |
299eb8b4 AE |
40 | > li { |
41 | outline: 0; | |
8a52619a | 42 | |
299eb8b4 AE |
43 | &:not(:last-child) { |
44 | margin-right: 20px; | |
45 | } | |
8a52619a | 46 | |
299eb8b4 | 47 | &.active > a { |
1a75e228 | 48 | color: var(--wcfContentLinkActive); |
299eb8b4 | 49 | } |
8a52619a | 50 | |
299eb8b4 AE |
51 | > a { |
52 | display: block; | |
b8eab696 | 53 | outline: 0; |
8a52619a | 54 | |
5908f54f AE |
55 | @include userSelectNone; |
56 | @include wcfFontSmall; | |
b8eab696 AE |
57 | } |
58 | } | |
59 | } | |
b8eab696 AE |
60 | } |
61 | } | |
62 | ||
95fc303c AE |
63 | .messageTabMenu + .innerError, |
64 | .messageTabMenu + .innerSuccess, | |
65 | .messageTabMenu + .innerWarning { | |
87dba389 | 66 | margin-top: -1px; |
45433290 AE |
67 | width: 100%; |
68 | } | |
69 | ||
71212588 | 70 | .messageTabMenu > nav.tabMenu, |
bf5372fc | 71 | .messageTabMenuNavigation { |
bf5372fc | 72 | > ul { |
1a75e228 AE |
73 | background-color: var(--wcfContentBackground); |
74 | border: 1px solid var(--wcfContentBorderInner); | |
299eb8b4 | 75 | border-top-width: 0; |
8a52619a | 76 | |
5908f54f | 77 | @include inlineList; |
8a52619a | 78 | |
bf5372fc | 79 | > li { |
1a75e228 | 80 | border-right: 1px solid var(--wcfContentBorderInner); |
8a52619a | 81 | |
bf5372fc | 82 | &:not(:last-child) { |
299eb8b4 AE |
83 | margin-right: 0; |
84 | } | |
8a52619a | 85 | |
299eb8b4 | 86 | &.active > a { |
1a75e228 | 87 | color: var(--wcfContentLinkActive); |
299eb8b4 | 88 | position: relative; |
8a52619a | 89 | |
299eb8b4 | 90 | &::after { |
1a75e228 | 91 | border-bottom: 1px solid var(--wcfContentBackground); |
299eb8b4 AE |
92 | bottom: -1px; |
93 | content: ""; | |
94 | display: block; | |
95 | left: 0; | |
96 | position: absolute; | |
97 | right: 0; | |
98 | } | |
b8eab696 | 99 | } |
8a52619a | 100 | |
b8eab696 | 101 | > a { |
bf5372fc | 102 | display: block; |
299eb8b4 | 103 | padding: 10px 20px; |
8a52619a | 104 | |
5908f54f | 105 | @include userSelectNone; |
71212588 | 106 | @include wcfFontDefault; |
8a52619a | 107 | |
f216765b | 108 | @include screen-md-up { |
c3d0938e AE |
109 | > .icon { |
110 | display: none; | |
111 | } | |
112 | } | |
8a52619a | 113 | |
f216765b | 114 | @include screen-sm-down { |
c3d0938e AE |
115 | > .icon { |
116 | display: block; | |
117 | } | |
8a52619a | 118 | |
c3d0938e AE |
119 | > span:not(.icon) { |
120 | display: none; | |
121 | } | |
bf5372fc | 122 | } |
b8eab696 AE |
123 | } |
124 | } | |
125 | } | |
8a52619a | 126 | |
bf5372fc | 127 | > span { |
299eb8b4 | 128 | display: none; |
bf5372fc | 129 | } |
b8eab696 AE |
130 | } |
131 | ||
b8eab696 AE |
132 | /* fix for Firefox - fieldsets are set to display: table-column which cause an odd gap between the fieldset |
133 | and the next element, similar to gaps with display: inline-block and font-size > 0 */ | |
134 | @-moz-document url-prefix() { | |
135 | fieldset + .messageTabMenu { | |
136 | margin-top: -3px; | |
137 | } | |
138 | } | |
139 | ||
140 | .uploadButton { | |
141 | overflow: hidden; | |
142 | position: relative; | |
8a52619a | 143 | |
b8eab696 | 144 | > input { |
efe397bc MW |
145 | bottom: 0; |
146 | left: 0; | |
b8eab696 | 147 | opacity: 0; |
b8eab696 | 148 | position: absolute; |
efe397bc | 149 | top: 0; |
b8eab696 AE |
150 | } |
151 | } |