From d72af54db2f8f3fa2fe7728e5cb2703ca6dcb03e Mon Sep 17 00:00:00 2001 From: leerobertdyer Date: Fri, 11 Aug 2023 16:42:09 -0400 Subject: [PATCH] added flexbox, some styles --- Fast typing/Typing.css | 89 +++++++++++++++++++++++++++-------------- Fast typing/Typing.html | 18 ++++----- 2 files changed, 67 insertions(+), 40 deletions(-) diff --git a/Fast typing/Typing.css b/Fast typing/Typing.css index f0f05340..829e9a25 100644 --- a/Fast typing/Typing.css +++ b/Fast typing/Typing.css @@ -1,50 +1,79 @@ body { - background:radial-gradient(#00faff ,#f981f3 60%); + background:radial-gradient(#1f3300 ,#000000 60%); + border: solid black 40px; + margin: 0; + overflow:hidden; + } -h2 { - animation: type 1.5s steps(17); +h1 { + display: block; + animation: type 1.7s steps(29); overflow: hidden; white-space: nowrap; font-family: monospace; border-right: 16px solid black; - width: 19ch; - color:red; + width: 29ch; + color:rgb(109, 0, 0); + background: rgb(180, 177, 177); + margin: 10px, 0, 0, 0; + padding: 0; +} +marquee { + background: black; + color: antiquewhite; + margin: 0; + font-family: fantasy; +} +#container a { + color: rgb(36, 1, 78); + font-size: 24px; + align-self: center; } +#container { + display: flex; + flex-flow:column nowrap; + align-items:start; + gap: 40px; + width: 80%; + margin-left: 4%; + background:radial-gradient(#00faff ,#f981f3 60%); + border: double rgb(252, 225, 190) 51px; +} + +.Can { +margin-top: 5%; +align-self: center; +padding-bottom: 1vmax; +} + +#startButtonId { + border-radius: 30%; + border-bottom: 14px ; + border-top: 14px ; + width: 100px; + height: 100px; + -webkit-animation: spin 1.5s linear + infinite; + animation: spin 1.8s linear infinite; + background-color: antiquewhite; + margin-top: 0; + margin-bottom: 10%; + padding: 0; + + } @keyframes type { 0% { width: 0ch; } 100% { - width: 19ch; + width: 29ch; } } -Can { - text-align:center; -} -#startButtonId { -position:absolute; -left:34%; -top:195px; -border-radius: 30%; - border-bottom: 14px ; - border-top: 14px ; - width: 100px; - height: 100px; - -webkit-animation: spin 1.5s linear - infinite; - animation: spin 1.8s linear infinite; -background-color: black; - -} -#buttonText { -color: white; -text-align: center; -font-size: x-large ; -padding: 30x; -} + + @-webkit-keyframes spin { 0% {-webkit-transform: rotate(0deg);} 100% { -webkit-transform: diff --git a/Fast typing/Typing.html b/Fast typing/Typing.html index 22951881..d520faec 100644 --- a/Fast typing/Typing.html +++ b/Fast typing/Typing.html @@ -5,18 +5,16 @@ -

Welcome in my code.

-


- - You can follow me on
👇👇👇👇👇👇👇👇
- +
+

Welcome 2 my open source code.

+ + You can follow me on
👇👇👇👇👇👇👇👇
+ My youtube channel
-
SoloLearn -
-
-







- My youtube channel +
+ + \ No newline at end of file