Template:PGPS Cell: Difference between revisions

From Books
Jump to navigation Jump to search
No edit summary
Tag: Reverted
No edit summary
Tag: Manual revert
Line 1: Line 1:
          <div class="pg-psoa-cell"><span style="position:absolute; width: 100%; height: 100%; text-align: center;  padding: 15px 0; "><a href="xxx">PU/CL</a></span>
      <style>
            div.pg-psoa-cell{
                position: relative;
                width: 100px;
                height: 50px;
                border: 0px solid black;
                background-color: #d2d1d4;
            }
            div.pg-psoa-action-chaser {
                width: 100%;
                height: 10%;
                border: 0;
                overflow: hidden;
            }
            div.pg-psoa-action-animation {
                position: absolute;
                height: 100%;
                width: 100%;
                border: 0;
                background: linear-gradient(to right, #d2d1d4, rgb(12, 1, 1));
                animation: pg-chaser-horizontal 2s linear infinite;
            }     
            @keyframes pg-chaser-horizontal{
                0%{
                    transform: translateX(-100%);
                }
                100%{
                    transform: translateX(0%);
            }}</style>
            <div class="pg-psoa-cell"><span style="position:absolute; width: 100%; height: 100%; text-align: center;  padding: 15px 0; "><a href="xxx">PU/CL</a></span>
                 <div class="pg-psoa-action-chaser; visibility: hidden;" style="rotate: 0deg;" >
                 <div class="pg-psoa-action-chaser; visibility: hidden;" style="rotate: 0deg;" >
                     <div class="pg-psoa-action-animation" style="left: 100%;" ></div>
                     <div class="pg-psoa-action-animation" style="left: 100%;" ></div>

Revision as of 18:54, 14 February 2023

     <style>
           div.pg-psoa-cell{
               position: relative;
               width: 100px;
               height: 50px;
               border: 0px solid black;
               background-color: #d2d1d4;
           }
           div.pg-psoa-action-chaser {
               width: 100%;
               height: 10%;
               border: 0;
               overflow: hidden;
           }
           div.pg-psoa-action-animation {
               position: absolute;
               height: 100%;
               width: 100%;
               border: 0;
               background: linear-gradient(to right, #d2d1d4, rgb(12, 1, 1));
               animation: pg-chaser-horizontal 2s linear infinite;
           }       
           @keyframes pg-chaser-horizontal{
               0%{
                   transform: translateX(-100%);
               }
               100%{
                   transform: translateX(0%);
           	}}</style>
<a href="xxx">PU/CL</a>