Widen TODO list only on mobile to be mobile-friendly

Signed-off-by: Takuya Noguchi <takninnovationresearch@gmail.com>

app/assets/stylesheets/page_bundles/todos.scss

@@ -164,6 +164,10 @@
 }
 
 @include media-breakpoint-down(sm) {
+  .container-fluid .todos-list-container {
+    margin: 0 (-$gl-padding);
+  }
+
   .todo {
     .avatar {
       display: none;

app/views/dashboard/todos/index.html.haml

@@ -81,7 +81,7 @@
                 = link_to todos_filter_path(sort: sort_value_oldest_created) do
                   = sort_title_oldest_created
 
-.js-todos-all
+.todos-list-container.js-todos-all
   - if @todos.any?
     .js-todos-list-container
       .js-todos-options{ data: { per_page: @todos.limit_value, current_page: @todos.current_page, total_pages: @todos.total_pages } }

changelogs/unreleased/mobile-friendly-todos-list.yml

+---
+title: Widen TODO list only on mobile to be mobile-friendly
+merge_request: 41244
+author: Takuya Noguchi
+type: other