.pollOptionContainer .pollOptionInput {
align-items: center;
margin: 5px 0;
-
+
/* using `display: flex` inside a native list-item is pretty weird */
display: inline-flex;
width: 100%;
-
+
> .icon {
flex: 0 0 auto;
margin: 0 5px;
}
-
+
> input {
flex: 1 1 auto;
margin-left: 5px;
.pollContainer {
border: 1px solid $wcfContentBorder;
border-width: 1px 0;
- margin-bottom: 10px ;
+ margin-bottom: 10px;
min-width: 300px;
padding: 10px 0;
-
+
@include screen-sm-up {
- float: left;
- margin-right: 20px;
- max-width: 50%;
+ &.pollContainerFullWidth {
+ margin-bottom: 20px;
+ }
+
+ &:not(.pollContainerFullWidth) {
+ float: left;
+ margin-right: 20px;
+ max-width: 50%;
+ }
}
-
+
h2 {
@include wcfFontHeadline;
}
-
+
.pollInnerContainer {
margin-top: 30px;
-
+
dd:not(:last-child) {
margin-bottom: 5px;
}
}
-
+
.formSubmit {
border-top: 1px solid $wcfContentBorderInner;
padding-top: 10px;
}
-
+
.pollResultItem {
& + .pollResultItem {
margin-top: 20px;
}
-
+
/* option name in result list */
.pollResultItemCaption {
align-items: flex-end;
display: flex;
-
+
> .pollOptionName {
flex: 1 1 auto;
}
-
+
> .pollOptionRelativeValue {
color: rgb(125, 130, 135);
flex: 0 0 50px;
text-align: right;
}
}
-
+
/* visual representation of relative votes per option */
.pollMeter {
background-color: $wcfContentBorderInner;
height: 5px;
margin-top: 5px;
-
+
> .pollMeterValue {
background-color: $wcfContentBorder;
height: 100%;