Where communities thrive

  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
Repo info
    Css document

    <!DOCTYPE html>

    <html lang="en" xmlns="http://www.w3.org/1999/html">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Transparent Search Box</title>
    <link rel="stylesheet" href="searchbox.css">
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css">

    <div class="wrapper">
    <div class="search_box">
    <input type="text" placeholder="Search a word here/so`zni bu yerda izla">
    <i class="fas fa-search"></i>
    <div class="div"></div>

    CSS document

    @import url('https://fonts.googleapis.com/css?family=Roboto');

    margin: 0;
    padding: 0;
    font-family: 'Roboto', sans-serif;

    background: url("images/bg.png") no-repeat center ;
    width: 100%;
    height: 100vh;
    background-size: cover;
    display: flex;
    justify-content: center;


    width: 50%;
    position: relative;

    .search_box input[type="text"]{
    width: 100%;
    padding: 20px;
    padding-right: 80px;
    box-sizing: border-box;
    background: rgba(0,0,0,0.3);
    border: 2px solid #fff;
    border-radius: 10px;
    font-size: 18px;
    color: #fff;
    outline: none;

    position: absolute;

    transform: translateY(-50%);
    right: 25px;
    color: #fff;
    font-size: 25px;
    justify-content: center;
    margin-top: 34px;

    ::-webkit-input-placeholder {
    / Chrome/Opera/Safari /
    color: #fff;
    ::-moz-placeholder {
    / Firefox 19+ /
    color: #fff;
    :-ms-input-placeholder {
    / IE 10+ /
    color: #fff;

    @media screen and (max-width: 425px){
    width: 95%;
    .div {
    width: 100%;
    padding: 20px;
    padding-right: 80px;
    box-sizing: border-box;
    background: rgba(0,0,0,0.3);
    border: 2px solid #fff;
    border-radius: 10px;
    font-size: 18px;
    color: #fff;
    outline: none;
    width: 100%;
    padding: 20px;
    padding-right: 80px;
    box-sizing: border-box;
    background: rgba(0,0,0,0.3);

    Manan Tank
    Hi Guys! I just released Radioactive-State - A library to make React Truly Reactive! I Made this library using JavaScript Proxies. I would really appreciate it if you guys check it out and let me know what you think. Here's the Repo: https://github.com/MananTank/radioactive-state
    Hi Manan
    Siemienik Pawel
    I am glad to introduce to you XLSX-Import package.
    What it really does? That’s crazy simple – it allows you to import xlsx spreadsheet file with data into your system with defined TypeScript types. Read more:

    Hi, I am doing a freeCodeCamp challenge. I have got a simple question but I do no understand something in the below function. why var testArr is given in the challenge but then in the function is given as arr and not as testArr? Sorry I know it might sound to simple for all of you. function nextInLine(arr, item) {
    let removed = arr.shift();
    return removed;

    var testArr = [1,2,3,4,5];

    console.log("Before: " + JSON.stringify(testArr));
    console.log(nextInLine(testArr, 6));
    console.log("After: " + JSON.stringify(testArr));

    Screenshot 2020-11-14 at 13.21.15.png
    Screenshot 2020-11-14 at 13.29.40.png
    That is the solution. What i do not understand is why "arr" is passed as an argument instead of the given array "testArr". Thank you
    Is anybody on this channel? :-O
    Ajay Prabhakar
    Hello guys,
    During this lockdown, I tried out new UI designs using Flutter which turned out really awesome📱.
    You can find these designs on my GitHub:
    please give a star⭐️ if you like them, any feedback is welcome
    Abulfazl Haidary
    Hi guys, I got a question, i have been working with react for almost 6 months and i want to learn react native, how long it would take me to learn it. thanks
    Siemienik Pawel

    I've released the alpha version of spreadsheet files importer cli: sxi. More details may be found on the package readme:

    (xlsx-import-cli is part of XToolset - set of high level api tools for XLSX files).

    Any feedback welcomed, any stars loved :heart: .

    2 replies
    Rail Batyrshin
    Hello everyone
    Can someone help me with a questions regarding source code? I am looking to see if I can download multiple mp3 files from the code vs downloading it one at a time...any suggestion on how to complete this is greatly appreciated.

    Hey guys!
    I am looking for a front-end developer (JS, React) in Bright Pattern. This is a San Francisco company developing an omnichannel contact center.
    The task is rewriting one of the system modules in React (now it is on Google Web Toolkit).


    • 5+ years of JavaScript development experience, 3+ year of React experience
    • Good understanding of web markup, HTML5 and CSS3
    • Experience with REST API
    • Experience with WebRTC - nice to have

    You'll create a complex highload product with real usersand work in a high-performance expert engineering team, learn and improve working together. At your wish - business trips or relocation to our main office in San Francisco (L1 visa).
    Direct contract with Bright Pattern (USA).

    telegram for requests or questions - @o_kuzi

    Kamal FOUAD
    Computer science needed, mining, data management, my sql, php, java...This is the link: https://chat.whatsapp.com/IZTTpyoDqli9xEI7z23GxD
    Hi everyone 👋 Question about CORs! is it possible to get a response header with client-browser side code Using fetch or an HTTP request? No server side code. How doe you access request variables.
    Hey all
    I am new to JS
    I have one tiny question
    anyone here?
    Siemienik Pawel
    Hi everyone, I want to announce that the xlsx-renderer v2.4.0 has been released.
    That introduce 2 new features that kick the functionality off :) Give it a review, we are very, very curious what do you think about our library ;)
    Hello, anyone there?
    I like to have some programmer friends
    Sadanand Akshay Pai
    A collection of JavaScript modern interview code challenges for beginners to experts
    M4H3NDR4N 5P4RK3R
    How to search deeply nested json tree??any thoughts
    saurav kumar bhagat

    Hi, I'm trying to write a unit test for a class having some real-time functionality, but unable to do it. Can somebody help regarding what should be done to test the class and what behaviour can be easily tested?

    class AccountService{
      constructor() {
        this.client = new Stomp.Cleint({
          brokerURL: url
      async getData() {
        this.client.onConnect = () => {
          this.client.subscribe('/message', this.callback);
        this.client.onStompError = () => { }
      callback(message) {
        const payload = JSON.parse(message);
        pubsub.publish('accountData', payload.body);

    I dont want to make a connection with the stomp server, since it is external service.

    Saptak Bhoumik

    Hi good morning, I would like to have some feedback about this https://github.com/SaptakBhoumik/WebPlus
    Is there something that can be done better?



    I am having a problem to find a selector for the text inside my "li" to target with JavaScript. The problem is that I have a nested "span" element with two icons in my "li". That gives me a problem just to "li" to target it, since, it also covers the "span" with icons. What I am trying to do is add {text-decoration: 'line-through'} when the 'check' icon is clicked. and remove the text, when 'trash'icon is clicked. As I said, my problem is targeting the text within the "li"


            <div class="task-list">
                  <span id="iconPkg"
                    ><i class="fas fa-check"></i> <i class="fas fa-trash-alt"></i


    const inputText = document.querySelector("#InputText");
    const addTask = document.querySelector("#addTask");
    const taskList = document.querySelector(".task-list");
    const iconPkg = document.querySelector("#iconPkg");
    const crossOut = document.querySelector(".fa-check");
    const deleteItem = document.querySelector(".fa-trash-alt");
    const taskItem = document.querySelector("#task-item");
    addTask.addEventListener("submit", (e) => {
      taskList.innerHTML += `
      <div class="task-list">
        <li><span id="task-item">${inputText.value}</span>
            ><i class="fas fa-check"></i> <i class="fas fa-trash-alt"></i
      inputText.value = "";
    crossOut.addEventListener("onmouseover", () => {
      taskItem.style.textDecoration = "underline";
    hi guys
    can i have a little help to replace math.floor with window.crypto?
    Sadanand Akshay Pai
    Hello everyone !
    I am newbie to javascript ...
    can you please help with this
    I would like to add
    1)Repair the display of the time remaining in the game.
    2)Add the endgame jingle
    3)Add an end-of-game message.
    4)Add a control to set the button's “leak” reaction time delay.
    hello i need a bit of help in javascript
    can someone help me plz?
    i have an array i want to save its information to a file
    can someone suggest a way
    array is like a=[343.56,5445.43,55.44,........]