Page 451 - MDP2022-3
P. 451

<h1>Welcome  To  SemiColon</h1>
                <router-view  />
            </template>
            <script>
            //  @  is  an  alias  to  /src
            //  import  HelloWorld  from  "@/components/HelloWorld.vue";
            export  default  {
                name:  "HomeView",
                components:  {
                    //  HelloWorld,
                },
            };
            </script>
            <style  scoped>
            h1  {
                font-size:  40px;
                min-width:  15px;
                white-space:  nowrap;
                margin:  0;
                position:  fixed;
                color:  transparent;
                top:  50%;
                left:  50%;
                transform:  translate(-50%,  -50%);
            }
            h1::before  {
                content:  "Welcome  To  SemiColon";
                position:  absolute;
                top:  0;
                left:  0;
                width:  100%;
                height:  100%;
                color:  black;
                overflow:  hidden;
                border-right:  1px  solid  black;
                animation:  typing  5s  steps(31)  infinite;
            }
            @keyframes  typing  {
                0%  {
                    width:  0%;
                }
                50%  {
                    width:  100%;
                }
                100%  {
   446   447   448   449   450   451   452   453   454   455   456