Expandable search bar

Once again, one of those "basic" projects, but I had a few issues until I made it to work the way I imagined.

This was my first try 

Everything worked fine, except the typewritter effect that I wanted to achieve. The letters were showing up, but not the way I wanted. They were showing one by one and then disappearing, and I wanted them to show up without disappearing. After 40+ minutes of fiddling around and googleing, somehow I manage to come up with my own solution and it looks like this

So, I just dropped getAttribute and simply displayed input message as a current character that is added from placeholderMessage variable into inputMessage variable when typeWriterEffect function runs.

Also, I've used classList API add, toggle and remove methods to manipulate with CSS.

Github link

Small fixes on my Cinemash site

Today I've added some small fixes on my Cinemash site, few new classes in HTML to meet BEM standard, and also some changes in my CSS to apply thoses changes on these new classes.

Digital clock

Yeah, still pretty basic stuff, but I had some issues with making those template literals work. Also, I found out that in JavaScript, days of the week start with Sunday being at the index position of 0.

There was also a string variable named period, which would change despite if it was AM or PM time, but I later dismissed it since the clock is based on European standard.

edit: fixed an issue where clock showed 12 insted of 00 hours.

Github link

JavaScript calculator using grid layout

Since I'm getting to grasp basics of grid layout, what project could be better than the good old calculator ?

Despite my initial thinking that it will be somehow complex to implement, it was actually pretty easy and neat, about 3 lines of code. I've learned about grid-template and grid-column shorthand, repeat function and span option on grid-column.

About JavaScript part, there is nothing too fancy, just some usual functionalities - basic arithmetic operations. Also, this is the first time that I have used eval() function, since I didn't really want to bother with regular expressions, and I think that this way the code is much neater and easier to read.

edit 30.1: changed variable name to be more readable

Github link

Test

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque et nibh auctor, imperdiet nulla nec, congue turpis. Sed pulvinar a massa sit amet congue. Cras a tincidunt lacus. Vivamus et neque sodales, viverra lacus nec, consequat est. Etiam non mollis augue. Vestibulum eu ultricies ex. Nullam ornare ipsum in diam iaculis elementum. Aenean odio felis, aliquam eu felis eget, pretium mattis ligula. Nulla convallis lacinia est vel tristique. Morbi eu turpis dictum dolor rhoncus mattis. Nullam vestibulum arcu vitae nulla dictum imperdiet.

Aenean metus enim, sodales eget blandit fermentum, vestibulum et magna. Vivamus vulputate scelerisque lorem. Curabitur pharetra purus tortor. Curabitur congue molestie neque, nec pharetra dui dignissim nec. Praesent hendrerit, diam ac iaculis elementum, nulla massa consectetur tellus, et bibendum dui felis id mi. Integer pharetra vestibulum erat. Suspendisse suscipit dapibus sapien vitae tempus. Proin vitae sapien turpis. Duis eleifend, ipsum et tincidunt hendrerit, libero erat dapibus ante, non porttitor turpis ipsum quis tortor. Donec ut dui vitae tellus elementum fermentum. Sed consectetur, ligula sed pretium aliquam, nisi elit varius neque, sed suscipit tortor quam sed sem. Cras elit augue, finibus sit amet tristique non, dictum quis sapien.