diff --git a/index.html b/index.html index 7de4677..18c6713 100644 --- a/index.html +++ b/index.html @@ -5,20 +5,21 @@
My Projects
├─ eaglercraft152 - Minecraft 1.5.2
diff --git a/script.js b/script.js
index db42934..24fe0a3 100644
--- a/script.js
+++ b/script.js
@@ -1,3 +1,13 @@
function showAlert() {
- alert("Hey! this is under development. i told u not to click.");
+ alert("Hey! this is under development. i told u not to click.");
+}
+
+function notLink() {
+ var notLinkToast = document.getElementById("notLinkToast");
+ notLinkToast.className = "show";
+ setTimeout(
+ function() {
+ x.className = x.className.replace("show", "");
+ }
+ , 3000);
}
\ No newline at end of file
diff --git a/style.css b/style.css
index b1a8fc0..b2111dc 100644
--- a/style.css
+++ b/style.css
@@ -48,7 +48,14 @@
.contentPush{
height: 65px;
}
-
+.notLink {
+ position: fixed;
+ top: 47.5px;
+ width: 100%;
+ border-radius: 0% 0% 15% 15%;
+ text-align: center;
+ font-size: 0px;
+}
/* Bar styling*/
.bar {
width: 100%;
@@ -75,16 +82,24 @@
display: block;
color: #222;
text-decoration: none;
- font-size: 16px;
- padding: 12px;
+ font-size: 20px;
+ padding: 9.20px 12px;
}
.barItem h1 {
-
+ font-size: 30px;
+ padding-top: 2.5px;
+ padding-bottom: 2.5px;
}
.barItem:hover {
flex: 1.5;
background-color: #eee;
}
+ .barItem *:hover {
+ font-size: 30px;
+ font-weight: 600;
+ padding-top: 2.5px;
+ padding-bottom: 2.5px;
+ }
.barItem a:hover {
background-color: #111;
color: #eee;
@@ -98,16 +113,52 @@
-moz-box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.25);
box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.25);
}
- .bar:has(a:hover) .barItem {
+ html:has(.barItem a:hover) .notLink {
+ font-size: 16px;
}
- @keyframes wiggleRainbow{
- 0% {background-color:red;}
- 25% {background-color:yellow;}
- 50% {background-color:blue;}
- 75% {background-color:green;}
- 100% {background-color:red;}
- }
-/* Bar styling*/
+ /* not Link toast*/
+ #notLinkToast {
+ visibility: hidden;
+ min-width: 250px;
+ margin-left: -125px;
+ background-color: #333;
+ color: #fff;
+ text-align: center;
+ border-radius: 2px;
+ padding: 16px;
+ position: fixed;
+ z-index: 1;
+ left: 50%;
+ top: 30px;
+ font-size: 17px;
+ }
+
+ #notLinkToast.show {
+ visibility: visible;
+ -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
+ animation: fadein 0.5s, fadeout 0.5s 2.5s;
+ }
+ @-webkit-keyframes fadein {
+ from {top: 0; opacity: 0;}
+ to {top: 30px; opacity: 1;}
+ }
+
+ @keyframes fadein {
+ from {top: 0; opacity: 0;}
+ to {top: 30px; opacity: 1;}
+ }
+
+ @-webkit-keyframes fadeout {
+ from {top: 30px; opacity: 1;}
+ to {top: 0; opacity: 0;}
+ }
+
+ @keyframes fadeout {
+ from {top: 30px; opacity: 1;}
+ to {top: 0; opacity: 0;}
+ }
+ /* not Link toast */
+/* Bar styling */
@media (prefers-color-scheme: dark) {
body {