How can I place icon at the end of the text like in the image and based on the percentage the text will hide and shown instead of that, is it possible to keep the text in the screen?

File myloader.html, to put in the app folder:

 <div class="myloader">
      <h1>
        <span></span>
      </h1>
    </div>

File myloader.css, to put in the www subfolder:

    .myloader {
  text-align:center; 
  align-items: center;
}

.myloader > h1 {
  display: flex;
  justify-content: center;
  color: blue;
}

.myloader > h1 > span::before {
  content: "";
  animation-name: animate;
  animation-duration: 6s;
  animation-direction: normal;
  animation-fill-mode: forwards;
  padding-left: 10px;
}

@keyframes animate {
  0% {
    content: "Analyzing", ;
  }

  90% {
    content: "Fetching Data"....;
    
  }
  100% {
    content: "Fetching Items!";
  }
}

And the Shiny app:

library(shiny)
library(shinycustomloader)

ui <- fluidPage(
  actionButton("go", "Go"),
  withLoader(
    plotOutput("plot"),
    type = "html",
    loader = "myloader"
  )
)

server <- function(input, output) {
  output$plot <- renderPlot({
    input$go
    x <- NULL
    for(. in 1:30000){
      x <- c(x, runif(1))
    }
    plot(x)
  })
}

shinyApp(ui, server)