Merge pull request #268 from leepeuker/add-note-icon-to-watch-dates-w…

…ith-comments Add note symbol to watch dates
leepeuker · Feb 2, 2023 · 4f745ff · 4f745ff
2 parents 15982c1 + ac5ac45
commit 4f745ff
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 7 deletions.
diff --git a/public/css/bootstrap-icons-1.10.2.css b/public/css/bootstrap-icons-1.10.2.css
@@ -22,6 +22,7 @@ url("../fonts/bootstrap-icons.woff?24e3eb84d0bcaf83d77f904c78ac1f47") format("wo
 
 .bi-arrow-clockwise::before { content: "\f116"; }
 .bi-calendar-date::before { content: "\f1e4"; }
+.bi-chat-square-text::before { content: "\f264"; }
 .bi-check-circle-fill::before { content: "\f26a"; }
 .bi-chevron-down::before { content: "\f282"; }
 .bi-chevron-up::before { content: "\f286"; }

diff --git a/templates/component/movie-modal-add-watch-date.html.twig b/templates/component/movie-modal-add-watch-date.html.twig
@@ -18,8 +18,8 @@
                     Watch date format is invalid!
                 </div>
                 <div class="input-group" style="margin-top: 1rem">
-                    <i class="input-group-text">Comment</i>
-                    <textarea class="form-control" rows="1" aria-label="Comment" id="addWatchDateModalCommentInput"></textarea>
+                    <i class="input-group-text"><i class="bi bi-chat-square-text"></i></i>
+                    <textarea class="form-control" rows="1" aria-label="Comment" id="addWatchDateModalCommentInput" placeholder="Comment"></textarea>
                 </div>
             </div>
             <div class="modal-footer">

diff --git a/templates/component/movie-modal-edit-watch-date.html.twig b/templates/component/movie-modal-edit-watch-date.html.twig
@@ -21,12 +21,12 @@
                     </div>
                 </div>
                 <div class="input-group" style="margin-top: 1rem">
-                    <i class="input-group-text">Plays</i>
-                    <input type="number" class="datepicker_input form-control" placeholder="" aria-label="Plays" id="editWatchDateModalPlaysInput">
+                    <i class="input-group-text"><i class="bi bi-chat-square-text"></i></i>
+                    <textarea class="form-control" rows="1" aria-label="Comment" id="editWatchDateModalCommentInput" placeholder="Comment"></textarea>
                 </div>
                 <div class="input-group" style="margin-top: 1rem">
-                    <i class="input-group-text">Comment</i>
-                    <textarea class="form-control" rows="1" aria-label="Comment" id="editWatchDateModalCommentInput"></textarea>
+                    <i class="input-group-text">Plays</i>
+                    <input type="number" class="datepicker_input form-control" placeholder="" aria-label="Plays" id="editWatchDateModalPlaysInput">
                 </div>
             </div>
             <div class="modal-footer">

diff --git a/templates/page/movie.html.twig b/templates/page/movie.html.twig
@@ -127,12 +127,13 @@
                 <ul class="list-group col-lg-5 col-xl-4 col-xxl-3 " style="padding-right: 0">
                     {% for watchDate in watchDates|reverse %}
                         <li class="list-group-item {% if currentUsername == routeUsername %}list-group-item-action{% endif %}"
-                            style="text-align: center;{% if currentUsername == routeUsername %}cursor: pointer{% endif %}"
+                            style="text-align: center;{% if currentUsername == routeUsername %}cursor: pointer;{% endif %}position:relative;"
                             {% if currentUsername == routeUsername %}onclick="loadWatchDateModal(this)"{% endif %}
                             data-watch-date="{{ watchDate.watched_at|date(dateFormatPhp) }}"
                             data-plays="{{ watchDate.plays }}"
                             data-comment="{{ watchDate.comment }}">
                             {{ watchDate.watched_at|date(dateFormatPhp) }} {% if watchDate.plays > 1 %}({{ watchDate.plays }}x){% endif %}
+                            {% if watchDate.comment != '' %}<i class="bi bi-chat-square-text" style="position: absolute; right:.7rem; top:25%;">{% endif %}</i>
                         </li>
                     {% endfor %}
                 </ul>