diff --git a/README.md b/README.md index 50c9e29..3d3da3a 100644 --- a/README.md +++ b/README.md @@ -1,2 +1,2 @@ -# AB_Website - +# website +this is my [website](https://AntiBitrix.github.io/website/) :) you guys can check this out for more details diff --git a/favicon.png b/favicon.png new file mode 100644 index 0000000..e060ef2 Binary files /dev/null and b/favicon.png differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..02dc9ba --- /dev/null +++ b/index.html @@ -0,0 +1,21 @@ + + + + + Dev + + + + +
+

Dev!

+

Hey, I am AntiBitrix(00010110) [Don't ask about the name ..]!

+

just noobie dev ;

+ +
+ + diff --git a/script.js b/script.js new file mode 100644 index 0000000..6743a1a --- /dev/null +++ b/script.js @@ -0,0 +1,11 @@ +function hoverColor() { + var links = document.getElementsByTagName("a"); + for (var i = 0; i < links.length; i++) { + links[i].addEventListener("mouseover", function() { + this.style.color = "green"; + }); + links[i].addEventListener("mouseout", function() { + this.style.color = "white"; + }); + } +} diff --git a/style.css b/style.css new file mode 100644 index 0000000..62a19b3 --- /dev/null +++ b/style.css @@ -0,0 +1,188 @@ +body { + background-color: #0E1111; + text-align: center; + padding: 20px; + font-family: "Hack", Courier, monospace; +} + +h1 { + font-size: 2em; + color: white; + border: 1px solid white; + padding: 10px; +} + +h2 { + font-size: 1.5em; + color: white; + font-family: "Terminal", Terminal, monospace; + text-align: center; + padding: 0 20px; + border-bottom: 1px solid white; +} + +h2::after { + content: "!"; + font-size: 3em; + color: red; + margin-left: 10px; +} + +h2::first-letter { + font-size: 2em; + color: red; +} + +p { + font-size: 1em; + color: white; + border: 1px solid white; + padding: 10px; +} + +ul { + list-style-type: none; +} + +li { + display: inline-block; + margin: 0 10px; +} + +a { + text-decoration: none; + color: white; + border: 1px solid white; + padding: 10px; + transition: all 0.3s; +} + +a:hover { + color: red; + border-color: red; +} + +@media only screen and (max-width: 768px) { + h1 { + font-size: 1.5em; + } + h2 { + font-size: 1.2em; + padding: 0 10px; + } + h2::after { + font-size: 2em; + margin-left: 5px; + } + h2::first-letter { + font-size: 1.5em; + } + p { + font-size: 0.9em; + } + li { + margin: 0 5px; + } + a { + font-size: 0.9em; + padding: 5px; + } +} + +.container { + max-width: 800px; + margin: 0 auto; + text-align: center; +} + +h1 { + font-size: 3em; + margin-bottom: 1em; +} + +h2 { + font-size: 2em; + margin-bottom: 1em; +} + +h2 span { + font-size: 2em; +} + +p { + font-size: 1.2em; + margin-bottom: 2em; +} + +ul { + margin: 0; + padding: 0; +} + +li { + display: block; + margin-bottom: 1em; +} + +a { + display: inline-block; + padding: 0.5em 1em; + font-size: 1.2em; + border: 2px solid #c1c1c1; + color: white; + text-decoration: none; + transition: background-color 0.3s ease; +} + +a:hover { + background-color: white; + color: black; +} + +.container { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + height: 100vh; +} + +body { + margin: 0; +} + + +.social-icons { + display: flex; + justify-content: center; + align-items: center; +} + +.social-icons a { + display: inline-block; + margin: 0 10px; + padding: 0; + margin: 0 0.5em; + color: white; + text-decoration: none; + transition: all 0.3s; +} + +.social-icons a:hover { + color: black; + background-color: white; +} + +.social-icons a:not(:last-child) { + border-radius: 0; +} + +.social-icons a:before { + content: ""; + display: none; +} + +.social-icons a:not(:last-child):after { + content: ""; + display: none; +}