Django-widget-tweaksでログインフォームを作りました。
ですがメールアドレス入力欄に半角文字が入力できないバグが発生しています。
全角文字なら入力できます。
どうすれば直りますでしょうか?
ネットで調べましたがそれらしい解決方法がなかったので質問させていただきました。
login.html
1{% extends 'app/base.html' %} 2 3{% load widget_tweaks %} 4 5{% block content %} 6 7<div class="card card-auto my-5 mx-auto"> 8 <div class="card-body"> 9 <h5 class="card-title tex-center">ログイン</h5> 10 <form method="post" class="form-auth"> 11 {% csrf_token %} 12 <div class="form-label-group"> 13 {% render_field form.login class='form-control' placeholder='Email' %} 14 </div> 15 <div class="form-label-group"> 16 {% render_field form.password class='form-control' placeholder='Password' %} 17 </div> 18 <div class="buttton mx-auto"> 19 <button class="btn btn-lg btn-primary btn-block mx-auto" type="submit">Login</button> 20 </div> 21 </form> 22 </div> 23</div> 24 25{% endblock %}
CSS
1* { 2 margin: 0; 3 padding: 0; 4 box-sizing: border-box; 5} 6 7boyd { 8 background: #f1f1f1; 9 display: flex; 10 flex-flow: column; 11 min-height: 100vh; 12} 13 14main { 15 flex: 1; 16} 17 18.card-profile { 19 width: 700px; 20 border: 0; 21 border-radius: 1rem; 22 box-shadow: 0 0.2rem 0.2rem 0 rgba(0, 0, 0, 0.1); 23} 24 25.button { 26 width: 150px; 27} 28 29.btn { 30 font-size: 20px; 31 border-radius: 5rem; 32 font-weight: bold; 33} 34 35.profile_table { 36 width: 100px; 37 border: 1px solid #d1dbeb; 38 border-radius: 8px; 39 border-collapse: separate; 40 overflow: hidden; 41} 42 43.profile_table .header { 44 width: 20px; 45 padding: 16px 50px; 46 text-align: left; 47 background: #f1f5fa; 48} 49 50.profile_table .data { 51 padding: 16px 24px; 52} 53 54.form_wrap { 55 display: grid; 56 gap: 16px; 57} 58 59.form_wrap-2 { 60 grid-template-columns: repeat(2, 1fr); 61} 62 63.form-control:focus { 64 box-shadow: none; 65} 66 67.card-auth { 68 width: 400px; 69 border: 0; 70 border-radius: 1rem; 71 box-shadow: 0 0.2rem 0.2rem 0 rgba(0, 0, 0, 0.1); 72} 73 74.card-title { 75 margin-bottom: 2rem; 76 font-size: 1.5rem; 77} 78 79.card-body { 80 padding: 2rem; 81} 82 83.form-auth { 84 width: 100%; 85} 86 87.form-label-group { 88 margin-bottom: 1rem; 89} 90 91.form-label-group input { 92 border-radius: 2rem; 93}
回答1件