Статья

DEV: Протестируем опрос прикрепленный к посту

Хотел сперва сделать опросы в поста, но потому подумал, что сделать опросы более самостоятельными, - это хорошая идея. Ведь их можно будет крепить, например, в каталог.

Создал опрос и прикрепил его сюда.

Ctrl+F5 надо сделать (или что-то подобное), файлы js обновились.


Некоторые решения.

/* Firefox */
progress::-moz-progress-bar { 
    background: black;  
}

/* Chrome */
progress::-webkit-progress-value {
    background: black;
}

Далее мы можем использовать, что-то подобное:

progress[value^="9"]::-moz-progress-bar {
   background-color : red;
}

красную полосу для значений начинающихся с 9 (т.е. 91,92,93…). Не забывая сделать обработку ещё для -webkit-progress-value, т.е. для Chrome.

А вот тупо подобрать цвет, вдохновение надо. :) буду ждать.

А вы делаете по утрам зарядку?

20%
6
Делаю
20%
46.7%
14
Нет
46.666666666667%
33.3%
10
Свой вариант
33.333333333333%
Всего голосовало: 30 • 21 Апреля 2023

16 Ответов

  1. Ничего себе, работает! ) Возможно ещё надо вывести сколько проголосовало, где дата создания опроса?

    1. Честно, не совсем знаю, как выглядят эти опросы, 2 примера посмотрел. Может и надо вывести, над внешним видом надо поработать (показать, например, где жать). Посмотрю сегодня ещё примеры. Спасибо.

      Вид после голосования

      Вид после голосования…

  1. Иногда делаю зарядку, но чаще забываю )

  1. У меня, что то не получается проголосовать…. вижу вот это и все

    Или уже опрос завершен? Тогда нужно как то вывести что он завершен.

    1. Вы это видите, потому что проголосовали. Отметку надо сделать, что проголосовал участник, вот ещё одно, что надо сделать.

  1. I tried the poll To vote didn’t work on chrome but worked in firefox.

    My suggestion - make a way to show the total votes below - if there is timer for the poll show how long and when the votes ends - make it more interactive I didn’t know when I voted - the design change it to something new that we haven’t seen before 😂

    1. Thanks. Today / tomorrow I will redo and show a new version. It is necessary to change the appearance slightly.


      Сегодня / завтра переделаю и покажу новую версию. Надо изменить внешний вид.

  1. Новый вариант, полностью изменил отображение. Ctrl+F5 и можно заново голосовать, чтобы увидеть изменения. Думаю, такой вид, как изначальный куда лучше. А дальше его отшлифуем. Например, не смотрел ещё, а неавторизированным, что показывать?

    1. Так значительно лучше.

  1. Работает!!! А что означает эти времена? Я так понял второе время - это время когда я проголосовал, а первое? И для чего они выводятся?

    1. Создания опроса и когда проголосовал. Надо убрать )

  1. What do you think of a design like this I think it will look better with more details I also think the poll should be in it’s own card ignore the small profile picture there but total votes and time left should be considered

    1. I like. Let’s count the total number of votes. )

  1. Мн кажется нужно немножко CSS добавить для переменных по типу:

    .max-w780 {
        max-width: 780px;
        margin: 3px 0px 1px 17px;
    }
    
    .content-body {
        max-width: 810px;
        margin-top: 15px;
        overflow-wrap: break-word;
        background: white;
        box-shadow: 0 0 5px rgb(0 0 0 / 10%);
        border: 1px solid #f3f4f6;
    }
    
    .title {
        margin: 0;
        font-weight: 500;
        font-size: 1.3125rem;
        margin: 3px 0px 1px 17px;
    }
    

    Само собой немного дописать стили по типу:

    .poll { }

    и тд.

    Как по мне опрос сливается с общим боди статьи

    Прошу сильно не пинать мое субъективное мнение, делал на скорую руку м допотопного компьютера на работе

    выделить опросы

    1. css тут не особо доработан, - однозначно. Минимальный он только. Давайте добавим что-то, выделим (изменения внес, Контл+F5, чтобы глянуть). Спасибо +

  1. The vorting is working fine now. AJAX Left 😉