Skip to content

Commit

Permalink
stuffed all the css into styles.css, will clean up later
Browse files Browse the repository at this point in the history
  • Loading branch information
EvanCPSC committed Feb 27, 2024
1 parent e8a50ee commit 56e2e3d
Show file tree
Hide file tree
Showing 7 changed files with 173 additions and 232 deletions.
140 changes: 3 additions & 137 deletions hbutton.html
Original file line number Diff line number Diff line change
Expand Up @@ -11,147 +11,13 @@
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Potta+One&display=swap" rel="stylesheet">
<link rel="icon" href="images/favicon.png" type="image/png" sizes="any">

<style>

body { background-color: #696969;
font-family: 'Potta One', cursive;
text-align: center;
background-position: center;
background-repeat: no-repeat;
transition: 0.3s;
-webkit-transition: 0.3s;
}
#home { background-color: #e60073;
border-radius: 8px;
font-size: 20px;
padding: 5px;
font-family: 'Potta One', cursive;
transition: 0.3s;
-webkit-transition: 0.3s;
}
#home:hover {
box-shadow: 0 8px 12px 0 rgba(0,0,0,0.3);
}
#themes { background-color: #e60073;
border-radius: 8px;
font-size: 20px;
padding: 5px;
font-family: 'Potta One', cursive;
transition: 0.3s;
-webkit-transition: 0.3s;
}
#themes:hover {
box-shadow: 0 8px 12px 0 rgba(0, 0, 0, 0.3);
}
.h { font-size: 20px;
border-radius: 50px;
background-color: darksalmon;
font-family: 'Potta One', cursive;
box-shadow: 0 3px #999;
opacity: 0.8;
text-align: center;
transition: 0.3s;
-webkit-transition: 0.3s;
}
.h:active {
box-shadow: 0 3px #666;
transform: translateY(2px);
}
.h:hover { opacity: 1 }

div.hb { position: -webkit-sticky;
position: sticky;
top: 0;
}
.sticky, .counter-display { padding: 0px 25px;
background-color: #696969;
width: 100px;
margin: auto;
}
.sticky { border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
.counter-display { border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
}

.sidenav {
height: 100%;
width: 0;
position: fixed;
z-index: 1;
top: 0;
left: 0;
background-color: #111;
overflow-x: hidden;
transition: 0.5s;
padding-top: 60px;
}
.sidenav a {
padding: 8px 8px 8px 32px;
text-decoration: none;
font-size: 25px;
color: #818181;
display: block;
transition: 0.3s;
}
.sidenav a:hover {
color: #f1f1f1;
}
.sidenav .closebtn {
position: absolute;
top: 0;
right: 25px;
font-size: 36px;
margin-left: 50px;
}
.custnav {
height: 100%;
width: 0;
position: fixed;
z-index: 1;
top: 0;
right: 0;
background-color: #111;
overflow-x: hidden;
transition: 0.5s;
padding-top: 60px;
}
.custnav a {
padding: 8px 8px 8px 32px;
text-decoration: none;
font-size: 25px;
color: #818181;
display: block;
transition: 0.3s;
}
.custnav .closebtn2 {
position: absolute;
top: 0;
left: 25px;
font-size: 36px;
margin-right: 50px;
}

@media screen and (max-height: 450px) {
.sidenav {padding-top: 15px;}
.sidenav a {font-size: 18px;}
}
::-webkit-scrollbar {
width: 1.5em;
}
::-webkit-scrollbar-thumb {
background: linear-gradient(to bottom, #ff0080 40%, #999999);
border-radius: 50vw;
}
</style>
<link href="styles.css" rel="stylesheet">

</head>
<body id="body">

<p><a href="/surrealistic" title="go back to the home page"><button id="home" id="topbuttons">home page</button></a>
<a title="page themes"><button id="themes" id="topbuttons" onclick="openNav()">themes</button></a>
<p><a href="/surrealistic" title="go back to the home page"><button id="home" class="header">home page</button></a>
<a title="page themes"><button id="themes" class="header" onclick="openNav()">themes</button></a>
<div id="sidenav" class="sidenav">
<a href="javascript:void(0)" class="closebtn" onclick="closeNav()">&times;</a>
<a href="javascript:void(0)" id="themeori" onclick="themeori()">original</a>
Expand Down
56 changes: 56 additions & 0 deletions hbutton/cookies.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,56 @@

let counterDisplayElem = document.querySelector('.counter-display');
let counterPlusElem = document.querySelector('.h');

let count = 0;

counterPlusElem.addEventListener("click",()=>{
count++;
updateDisplay();
document.cookie = "value=" + count;
});

function updateDisplay(){
counterDisplayElem.innerHTML = count;
};

function getCookie(cname) {
var name = cname + "=";
var decodedCookie = decodeURIComponent(document.cookie);
var ca = decodedCookie.split(';');
for(var i = 0; i <ca.length; i++) {
var c = ca[i];
while (c.charAt(0) == ' ') {
c = c.substring(1);
}
if (c.indexOf(name) == 0) {
return c.substring(name.length, c.length);
}
}
return "";
}
if (getCookie("value") === undefined || getCookie("value") === null) {

}
else {
document.querySelector(".counter-display").innerHTML = getCookie("value");
}



function getCookie(cname) {
var name = cname + "=";
var decodedCookie = decodeURIComponent(document.cookie);
var ca = decodedCookie.split(';');
for(var i = 0; i <ca.length; i++) {
var c = ca[i];
while (c.charAt(0) == ' ') {
c = c.substring(1);
}
if (c.indexOf(name) == 0) {
return c.substring(name.length, c.length);
}
}
return "";
}
console.log(getCookie("value"));
6 changes: 3 additions & 3 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -19,12 +19,12 @@

<div id="top"></div>

<header class="header">
<header id="header">
<p>
<a href="https://github.com/EvanCPSC/surrealistic" target="_blank" title="visit the github">
<button id="header"><img src="images/github.png" height="24px" width="24px"> github</button>
<button class="header"><img src="images/github.png" height="24px" width="24px"> github</button>
</a>
<a title="other pages"><button id="header" onclick="openNav()">pages</button></a>
<a title="other pages"><button class="header" onclick="openNav()">pages</button></a>
<nav id="sidenav" class="sidenav">
<a href="javascript:void(0)" class="closebtn" onclick="closeNav()">&times;</a>
<a href="javascript:void(0)" title="a message based on the time" onclick="goodDay()">hello poppup</a>
Expand Down
16 changes: 16 additions & 0 deletions rick.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
#rick:link {
color: #e60073;
text-decoration: none;
}
#rick:visited {
color: #e60073;
text-decoration: none;
}
#rick:hover {
color: #e60073;
text-decoration: underline;
}
#rick:active {
color: #e60073;
text-decoration: underline;
}
21 changes: 2 additions & 19 deletions rick.html
Original file line number Diff line number Diff line change
Expand Up @@ -10,29 +10,12 @@
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Potta+One&display=swap" rel="stylesheet">
<link rel="icon" href="images/favicon.png" type="image/png" sizes="any">

<style>

body { background-color: #696969;
font-family: 'Potta One', cursive;
text-align: center;
background-position: center;
background-repeat: no-repeat;
}
#home { background-color: #ff0080;
border-radius: 8px;
font-size: 20px;
padding: 5px;
font-family: 'Potta One', cursive;
}


</style>
<link href="styles.css" rel="stylesheet">

</head>
<body>

<p><a href="/surrealistic" title="go back to the home page"><button id="home">get rik roled!!1!</button></a></p>
<p><a href="/surrealistic" title="go back to the home page"><button class="header">get rik roled!!1!</button></a></p>
<br>

<img src="images/rick.gif">
Expand Down
Loading

0 comments on commit 56e2e3d

Please sign in to comment.