Merge remote-tracking branch 'origin/form' into form

www/form/app-form.less

@@ -519,6 +519,14 @@
         & > div {
             display: flex;
         }
+        .cp-form-poll-body {
+            flex-flow: column;
+            max-height: 200px;
+            overflow: auto;
+            & > div {
+                display: flex;
+            }
+        }
         .cp-poll-cell {
             width: 100px;
             height: 40px;
@@ -541,6 +549,15 @@
             }
         }
         .cp-poll-answer-name {
+            padding: 0 5px;
+            display: flex;
+            :last-child {
+                flex: 1;
+                min-width: 0;
+                white-space: nowrap;
+                text-overflow: ellipsis;
+                overflow: hidden;
+            }
             .cp-avatar {
                 .avatar_main(30px);
                 margin-right: 10px;
@@ -554,8 +571,20 @@
         }
         &.cp-form-poll-switch {
             flex-flow: row;
+            .cp-avatar {
+                .avatar_main(20px);
+            }
             & > div {
                 flex-flow: column;
+                &.cp-form-poll-body {
+                    flex-flow: row;
+                    max-width: 500px;
+                    max-height: unset;
+                    scroll-snap-type: x mandatory;
+                    & > div {
+                        flex-flow: column;
+                    }
+                }
             }
             .cp-poll-cell:not(.cp-poll-switch) {
                 &:first-child {

www/form/inner.js

@@ -706,6 +706,7 @@ define([
         }
 
         // Add answers
+        var bodyEls = [];
         if (Array.isArray(answers)) {
             answers.forEach(function (answerObj) {
                 var answer = answerObj.results;
@@ -726,9 +727,11 @@ define([
                     avatar,
                     h('span', name)
                 ]));
-                lines.push(h('div', els));
+                bodyEls.push(h('div', els));
             });
         }
+        var body = h('div.cp-form-poll-body', bodyEls);
+        lines.push(body);
 
         var $s = $(switchAxis).click(function () {
             $s.closest('.cp-form-type-poll').toggleClass('cp-form-poll-switch');
@@ -1440,7 +1443,7 @@ define([
                 addLine.unshift(h('div.cp-poll-cell', nameInput));
                 lines.push(h('div', addLine));
 
-                var tag = h('div.cp-form-type-poll', lines);
+                var tag = h('div', h('div.cp-form-type-poll', lines));
                 var $tag = $(tag);
 
                 var cursorGetter;