Merge branch 'text-position-error#4369' of https://github.com/upsaura…

…v12/CircuitVerse into text-position-error#4369
upsaurav12 · Jan 6, 2024 · 53d16e6 · 53d16e6
2 parents f1f85e4 + 8e9fd06
commit 53d16e6
Show file tree

Hide file tree

Showing 10 changed files with 50 additions and 10 deletions.
diff --git a/app/assets/stylesheets/commontator.scss b/app/assets/stylesheets/commontator.scss
@@ -109,6 +109,12 @@
 
 .new-comment {
   display: block;
+  margin-top: 0.3rem;
+}
+
+.new-comment-link{
+  position: relative;
+  top: -3.3em;
 }
 
 //breakpoints

diff --git a/app/assets/stylesheets/layout.scss b/app/assets/stylesheets/layout.scss
@@ -6,6 +6,11 @@ html {
   scroll-behavior: smooth;
 }
 
+::selection {
+  background: $primary-green;
+  color: $white;
+}
+
 body {
   font-family: 'Inter';
   padding-top: 90px;
@@ -194,7 +199,7 @@ body {
 
   .pagination {
     max-width: none;
-    overflow-x: visible;
+    overflow-x: auto;
     padding: 0;
     white-space: nowrap;
   }

diff --git a/app/assets/stylesheets/navbar.scss b/app/assets/stylesheets/navbar.scss
@@ -4,6 +4,7 @@
   top: 0;
   width: 100%;
   z-index: 100;
+  border-bottom: 1px solid $border-color;
 }
 
 .navbar-logo {

diff --git a/app/assets/stylesheets/projects.scss b/app/assets/stylesheets/projects.scss
@@ -217,6 +217,16 @@
   width: 80%;
 }
 
+.char-counter {
+  color: $tooltip-grey;
+  font-size: 14px;
+  margin: 5px 0 0 auto;
+}
+
+.is-invalid {
+  color: $red;
+}
+
 //breakpoints
 @media (max-width: 575px) {
   .projects-collaborators-button-container {

diff --git a/app/models/project.rb b/app/models/project.rb
@@ -8,7 +8,7 @@ class Project < ApplicationRecord
   friendly_id :name, use: %i[slugged history]
   self.ignored_columns += ["data"]
 
-  validates :name, length: { minimum: 1 }
+  validates :name, length: { minimum: 1, maximum: 60 }
   validates :slug, uniqueness: true
 
   belongs_to :author, class_name: "User"

diff --git a/app/views/commontator/threads/_reply.html.erb b/app/views/commontator/threads/_reply.html.erb
@@ -11,7 +11,7 @@
     <p>You must <a href="/users/sign_in" class="anchor-text">login</a> before you can post a comment.</p>
   <% else %>
     <% if @commontator_new_comment.nil? %>
-      <div id="commontator-thread-<%= thread.id %>-new-comment-link" class="new-comment">
+      <div id="commontator-thread-<%= thread.id %>-new-comment-link" class="new-comment new-comment-link">
         <%= link_to "+ Add Comment",
             commontator.new_thread_comment_path(thread),
             remote: true, class: "btn primary-button" %>

diff --git a/app/views/commontator/threads/_show.html.erb b/app/views/commontator/threads/_show.html.erb
@@ -71,6 +71,10 @@
     </span>
   </div>
 
+  <% if thread.config.comment_order != :l %>
+    <%= render partial: 'commontator/threads/reply', locals: { thread: thread, user: user } %>
+  <% end %>
+
   <% if thread.config.comment_order == :l %>
     <%= render partial: 'commontator/threads/reply', locals: { thread: thread, user: user } %>
   <% end %>
@@ -100,9 +104,6 @@
     </div>
   </div>
 
-  <% if thread.config.comment_order != :l %>
-    <%= render partial: 'commontator/threads/reply', locals: { thread: thread, user: user } %>
-  <% end %>
 </div>
 <script>
   <%= render partial: 'commontator/threads/hide_show_links', locals: { thread: thread }, formats: :js %>

diff --git a/app/views/projects/_form.html.erb b/app/views/projects/_form.html.erb
@@ -21,9 +21,10 @@
       </ul>
     </div>
   <% end %>
-  <div class="field form-group">
+  <div class="field form-group d-flex flex-column">
     <h6><%= form.label :name %></h6>
-    <%= form.text_field :name, id: :project_name, class: "form-control form-input" %>
+    <%= form.text_field :name, id: :project_name, class: "form-control form-input", maxlength: 60 %>
+    <span id="name-counter" class="char-counter"></span>
   </div>
   <div class="field form-group projects-tag-form-group">
     <h6><%= form.label :tag_list %></h6> <span><%= t("projects.form.tag_list_description") %></span>
@@ -76,4 +77,22 @@
     });
     $("#featuredCircuit").submit();
   }
+
+  document.addEventListener('DOMContentLoaded', function () {
+    const nameField = document.getElementById('project_name');
+
+    nameField.addEventListener('input', function () {
+      const maxLength = parseInt(this.getAttribute('maxlength'));
+      const currentLength = this.value.length;
+
+      const nameCounter = document.getElementById('name-counter');
+      nameCounter.textContent = `${currentLength} / ${maxLength}`;
+
+      if (currentLength >= maxLength) {
+        nameCounter.classList.add('is-invalid');
+      } else {
+        nameCounter.classList.remove('is-invalid');
+      }
+    });
+  });
 </script>
diff --git a/simulator/src/css/main.stylesheet.css b/simulator/src/css/main.stylesheet.css
@@ -173,7 +173,6 @@ input[type="text"]:focus {
     font-size: 1em;
     text-align: center;
     display: inline-block;
-    white-space: nowrap;
     width: 35vw;
     height: 1.2rem;
     overflow: hidden;

diff --git a/simulator/src/data/save.js b/simulator/src/data/save.js
@@ -28,7 +28,6 @@ export function setProjectName(name) {
     name = stripTags(name);
     projectName = name;
     $('#projectName').html(name);
-    document.getElementById("projectName").setAttribute("title",name);
 }
 
 /**