diff --git a/app/assets/stylesheets/feedback.scss b/app/assets/stylesheets/feedback.scss index a66b780ad..51219d38c 100644 --- a/app/assets/stylesheets/feedback.scss +++ b/app/assets/stylesheets/feedback.scss @@ -70,44 +70,9 @@ background-color: var(--hover-color); cursor: pointer; } -.feedback-check-icon{ - margin-left: 6px; - margin-right: 6px; - display: none; -} .feedback-checks{ max-width: 363px; margin: 0 auto; display: flex; flex-wrap: wrap; -} -.feedback-checks div{ - margin-right: 10px; -} - -.feedback-checks div label{ - cursor: pointer; -} -.feedback-checks div label input[type="checkbox"]{ - display: none; -} -.feedback-checks div label span{ - position: relative; - display: inline-block; - background:white; - border: 0.5px solid #BDBDBD; - color: #a7a7a7; - padding: 8px; - border-radius: 5px; - font-size: 13px; - user-select: none; - -} -.feedback-checks div label input[type="checkbox"]:checked ~ span{ - border: 1px solid var(--primary-color); - color: var(--primary-color); -} - -.feedback-checks div label input[type="checkbox"]:checked ~ span .feedback-check-icon{ - display:unset; -} +} \ No newline at end of file diff --git a/app/views/home/feedback/feedback.html.haml b/app/views/home/feedback/feedback.html.haml index e3deacd4c..5180a4a4a 100644 --- a/app/views/home/feedback/feedback.html.haml +++ b/app/views/home/feedback/feedback.html.haml @@ -49,28 +49,10 @@ Tags %font.register-optional (optional) .feedback-checks - %div - %label{:for => "feedback-bug-check"} - %input#feedback-bug-check{:name => "bug", :type => "checkbox", :value => "Bug"}/ - %span - %img.feedback-check-icon{:src => "#{asset_path('check.svg')}"}/ - Bug - %div - %label{:for => "feedback-proposition-check"} - %input#feedback-proposition-check{:name => "proposition", :type => "checkbox", :value => "Proposition"}/ - %span - %img.feedback-check-icon{:src => "#{asset_path('check.svg')}"}/ - Proposition - %div - %label{:for => "feedback-question-check"} - %input#feedback-question-check{:name => "question", :type => "checkbox", :value => "Question"}/ - %span - %img.feedback-check-icon{:src => "#{asset_path('check.svg')}"}/ - Question - %div - %label{:for => "feedback-ontologysubmissionrequest-check"} - %input#feedback-ontologysubmissionrequest-check{:name => "ontology_submissions_request", :type => "checkbox", :value => "Ontology submissions request"}/ - %span - %img.feedback-check-icon{:src => "#{asset_path('check.svg')}"}/ - Ontology submissions request + = render(ChipsComponent.new(name:"bug", value: "Bug")) + = render(ChipsComponent.new(name:"proposition", value: "Proposition")) + = render(ChipsComponent.new(name:"question", value: "Question")) + = render(ChipsComponent.new(name:"ontology_submissions_request", value: "Ontology submissions request")) + - if using_captcha? + = recaptcha_tags %input.feedback-button{:type => "submit", :value => "Send"}/