diff --git a/Card.css b/Card.css new file mode 100644 index 0000000..570bb0e --- /dev/null +++ b/Card.css @@ -0,0 +1,64 @@ +/* From Uiverse.io by Yaya12085 */ +button { + background: transparent; + position: relative; + padding: 5px 15px; + display: flex; + align-items: center; + font-size: 17px; + font-weight: 600; + text-decoration: none; + cursor: pointer; + border: 1px solid #0163E0; + border-radius: 25px; + outline: none; + overflow: hidden; + color: #0163E0; + transition: color 0.3s 0.1s ease-out; + text-align: center; +} + +button svg { + fill: #0163E0; + height: 25px; + width: 25px; +} + +button span { + margin: 10px; +} + +button::before { + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + margin: auto; + content: ''; + border-radius: 50%; + display: block; + width: 20em; + height: 20em; + left: -5em; + text-align: center; + transition: box-shadow 0.5s ease-out; + z-index: -1; +} + +button:hover { + color: #fff; + border: 1px solid #0163E0; +} + +button:hover svg { + fill: currentColor; +} + +button:hover::before { + box-shadow: inset 0 0 0 10em #0163E0; +} + +/* GitHub */ + + diff --git a/Card.html b/Card.html new file mode 100644 index 0000000..8ce7e8b --- /dev/null +++ b/Card.html @@ -0,0 +1,144 @@ + + + +
+ + + + + + + + +
+ I'm a Software Engineer and my implementation is 'WEB',
+ I'm a student at Faculty of Computers
+ and Artificial Intelligence
+ ,Helwan University
+
latest year inshaa Allah
+