NewClassicalDesign

no, I haven't figured it out. Again the problem only appears when you actually look on a mobile device, not just resize or simulate mobile while on your desktop. I've noticed it specifically in mobile safari and mobile chrome.

Site URL: https://timecraft.group/home-draft password for the site is "metaverse" timecraft.group/home-draft noticed an annoying graphic issue when I designed some custom buttons for a client site. When you view the site on mobile the buttons display a very subtle border around the text within the area of the button. However, when you check mobile view in squarespace or if you use chrome devtools to simulate the size on mobile the issue does not appear. You will likely need to enlarge the image to see what I am talking about, its a very subtle box surround the text of the button. here is the code used for one of the buttons: <style> .button-box { box-sizing:border-box; outline:none; } .drawn-button1 { font-family: 'squada one'; line-height: 1.2rem; align-self: center; text-align: center; background:#242637; padding:.6rem .6rem; margin:0 1rem; transition:all .5s ease; font-size:1.5rem; outline:none; box-shadow: 20px 38px 34px -26px hsla(0,0%,50%,1); border-radius: 255px 15px 225px 15px/15px 225px 15px 255px; border:solid 7px #fff; opacity: 0; animation: appear1 2s linear 5s; animation-fill-mode: forwards; } @keyframes appear1 { 0% { opacity: 0; } 100% { opacity: 1; } } .drawn-button1:hover{ box-shadow:2px 8px 4px -6px hsla(0,0%,50%,1); } </style> <div class="button-box"> <a href="/#web3"> <div class="drawn-button1">TWO.FIVE <br> <span style="font-family:'Roboto Slab';font-size:1rem; line-height:.8rem;margin-top:0px;padding-top:0px;"> start your web3 journey</span> </div></a></div> Anyone know how I can keep the inner box from showing up? It does not show up on desktop.

this worked wonderfully, thank you for your help!

here is some code I found that replaced the month abbreviations with Portuguese abbreviations. Also switches the date to appear first. All I would need would be to pair this down so that it only changes the text of the months to spell them out completely and not have any of the business where it switches the info around. My javascript ability isn't strong enough to know just what to take out and change. <script> (function() { var dates = document.getElementsByClassName("dt-published date-highlight"); var newDate; var i,I; // Create object with 'source' keys on the left, and 'output' values on the right. var months = { "Jan":"Jan", "Feb":"Fev", "Mar":"Mar", "Apr":"Abr", "May":"Mai", "Jun":"Jun", "Jul":"Jul", "Aug":"Ago", "Sep":"Set", "Oct":"Out", "Nov":"Nov", "Dec":"Dez" }; // Loop through all dates, replacing months and reordering display. // - Trim extra white space from beginning and end of date. // - Replace multiple consecutive spaces with a single space. // - Split by space into an array. // - Replace month text based on 'months' object key:value pairs. // - Convert array to string, rearranging display order of elements. // - Set new date HTML. for (i=0, I=dates.length; i<I; i++) { newDate = dates[i].innerHTML.trim(); newDate = newDate = newDate.replace(/ +/g, ' '); newDate = newDate.split(" "); newDate[0] = months[newDate[0]]; newDate = newDate[1] + " " + newDate[0]; dates[i].innerHTML = newDate; } })(); </script>

Site URL: https://www.thevaclaimslawyer.com/blog/good-news-for-military-families-and-civilians-who-live-and-work-at-camp-lejeune A client has requested that the publish dates on individual blog posts are spelled out as opposed to abbreviated. I found some similar javascript code posted elsewhere that changes the date format in general but can't find one that just manipulates the text of the month. So instead of "Jun 10" it would be "June 10." Anyone have a simple script that would do the trick they would be willing to share?

ended up answering my own question. For what its worth I had to add the script in a separate code block in its own <div> since it wasn't letting me append an element in the summary block itself. Then I styled the block so it appeared beneath the author. Also I realized document.getElementsByClassNames produces an array-like object instead of an element so I had to iterate over it to search for the text. Here is the updated script I used: <div id="author-feature" style="margin-top:-100px;"> </div> <script> var img = document.createElement("img"); let author = document.getElementsByClassName('summary-metadata-item--author'); for (i = 0; i < author.length; i++) { if(author[i].innerHTML.includes('Bryan Specht')){ img.src = "https://static1.squarespace.com/static/614a0273f17c0447042d5f78/t/6178ce73e9cfee41177b9e75/1635307123576/BRYAN_b_w_square.png"; img.setAttribute("style", "width:100px; border-radius:50%;"); var block = document.getElementById("author-feature") block.appendChild(img); } else if(author[i].innerHTML.includes('Rick Shaughnessy')){ img.src = "https://static1.squarespace.com/static/614a0273f17c0447042d5f78/t/6178ce8f24061f5729aaf1ad/1635307151493/RICK_b_w_square.png"; img.setAttribute("style", "width:100px; border-radius:50%;"); var block = document.getElementById("author-feature") block.appendChild(img); } else if(author[i].innerHTML.includes('Charlie Witkowski')){ img.src = "https://static1.squarespace.com/static/614a0273f17c0447042d5f78/t/6178ce766084256498dff499/1635307126503/CHARLIE_b_w_square.png"; img.setAttribute("style", "width:100px; border-radius:50%;"); var block = document.getElementById("author-feature") block.appendChild(img); } else if(author[i].innerHTML.includes('Andrea Zimmerman')){ img.src = "https://static1.squarespace.com/static/614a0273f17c0447042d5f78/t/6178ce6c25addd661972eb89/1635307116533/ANDREA_b_w_square.png"; img.setAttribute("style", "width:100px; border-radius:50%;"); var block = document.getElementById("author-feature") block.appendChild(img); } else if(author[i].innerHTML.includes('Jaclyn Johnston')){ img.src = "https://static1.squarespace.com/static/614a0273f17c0447042d5f78/t/6178ce8562c22f532e4a39d8/1635307141583/JACLYN_b_w_square.png"; img.setAttribute("style", "width:100px; border-radius:50%;"); var block = document.getElementById("author-feature") block.appendChild(img); } else if(author[i].innerHTML.includes('Tricia Ewald')){ img.src = "https://static1.squarespace.com/static/614a0273f17c0447042d5f78/t/6178ce95b52a8b6c21764ae0/1635307158005/TRICIA_b_w_square.png"; img.setAttribute("style", "width:100px; border-radius:50%;"); var block = document.getElementById("author-feature") block.appendChild(img); } else if(author[i].innerHTML.includes('Daniel Welch')){ img.src = "https://static1.squarespace.com/static/614a0273f17c0447042d5f78/t/6178ce7b72d1556873b61489/1635307131576/DANIEL_1_b_w_square.png"; img.setAttribute("style", "width:100px; border-radius:50%;"); var block = document.getElementById("author-feature") block.appendChild(img); } else { img.src = "https://static1.squarespace.com/static/614a0273f17c0447042d5f78/t/6178d2e414c5322fe396ec28/1635308260460/salient_favicon.png"; var block = document.getElementById("author-feature") block.appendChild(img); } } </script>

No, it was for the section right below the top video “what’s new from salient fltr” next to where the author of the blog post is listed

Site URL: https://salientglobal.com/home-draft Hey all, I am trying to add in some javascript so I can get the author bio avatar photo to show up on under the featured blog post in a summary block on the home page (using list style). page is https://salientglobal.com/home-draft pw is: pagepreview here is the script i am trying to insert: I've tried it both as a separate code block and injected into the header of the page. <script> var img = document.createElement("img"); if (document.getElementsByClassName("summary-metadata-item--author").innerHTML.indexOf('Author Name1') != -1) { img.src = "INSERT_IMAGE_HERE"; img.setAttribute("style", "width:80px;"); } else if { document.getElementsByClassName("summary-metadata-item--author").innerHTML.indexOf('Author Name2') != -1){ img.src = "INSERT_IMAGE_HERE"; img.setAttribute("style", "width:80px;") } else { img.src = "NO_PHOTO_IMAGE" } var block = document.getElementsByClassName("summary-metadata-item--author"); block.appendChild(img); </script> Any thoughts on if what I am trying is even possible? Or anyone else have a more elegant solution than the above?