Refactor CSS Code for Preloaded and Back-to-Top Button into privcy.html file ✨

[Nishitbaria]

Issue Description: Currently, our website is using the following CSS code for the preloader and back-to-top button. While it works perfectly fine, it can benefit from some refactoring to improve code readability and maintainability. This issue aims to refactor the existing CSS code for better organization and to remove unnecessary duplication.

CSS Code to Refactor:

<style>
  #preloader {
    background: #000 url(https://www.oscode.co.in/assets/img/gifs/OSCode.gif) no-repeat center center;
    background-size: 60%;
    height: 100vh;
    width: 100%;
    position: fixed;
    z-index: 999999;
  }

  .back-to-top {
    position: fixed;
    right: 2.15rem;
    bottom: 3rem;
    z-index: 999;
    background: #5942e9;
    width: 40px;
    height: 40px;
    border-radius: 4px;
    transition: all 0.4s;
    animation: action 1s infinite alternate;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    color: white;
    line-height: 0;
  }

  .back-to-top:hover {
    background: #a95ea9 !important;
    color: white;
    text-decoration: none;
  }

  .back-to-top.active {
    visibility: visible;
    opacity: 1;
  }

  @keyframes action {
    0% {
      transform: translateY(0);
    }
    100% {
      transform: translateY(-15px);
    }
  }
</style>

Refactoring Goals:

1. Move the styles related to the .back-to-top i element inside the .back-to-top class since a separate selector for i element is unnecessary.
2. Remove the no-longer-needed .back-to-top i selector from the CSS.
3. Consolidate styles within the .back-to-top class by incorporating font-size, color, and line-height properties, reducing code duplication and improving maintainability.

Proposed Changes:

1. Move the styles related to .back-to-top i inside the .back-to-top class and remove the separate selector for i element.
2. Remove the no-longer-needed .back-to-top i selector from the CSS.
3. Consolidate the common styles such as font-size, color, and line-height within the .back-to-top class to minimize redundant code.

Expected Outcome: The refactored CSS code should functionally and visually behave the same as the existing code. However, it will be more organized, less redundant, and easier to modify or extend in the future.

[Nishitbaria]

Hey @Vaishnavi-Patil2211 Please assign me this issue.

[github-actions[bot]]

👋 @Nishitbaria

Thank you for raising an issue. We will investigate into the matter and get back to you as soon as possible.

Please make sure you have given us as much context as possible.

[github-actions[bot]]

To reduce notifications, issues are locked. Your issue will be unlocked when we add the label gssoc23. If you're participating in GSSoC'23, please add the gssoc23 label to your issue.