limepotato/limepot-xyz
1
0
Fork 0
Code Issues 3 Pull requests Activity

gallery attemp, link attempt

Browse source
This commit is contained in:
nelle 2022-12-19 18:37:00 -07:00
parent 6aa4f3c51d
commit 7d29f615c5
50 changed files with 167 additions and 67 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
about.html
View file

@ -3,7 +3,7 @@
<head>
<meta charset = "utf-8" />
<title>
Home
About Me
</title>
<!-- add icon link -->
<link rel = "icon" href = "assets/obo-icon.png"

BIN
assets/photogallery/japan-2018/PSX_1.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2.9 MiB

BIN
assets/photogallery/japan-2018/PSX_10.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1.9 MiB

BIN
assets/photogallery/japan-2018/PSX_11.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1.9 MiB

BIN
assets/photogallery/japan-2018/PSX_12.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 3.4 MiB

BIN
assets/photogallery/japan-2018/PSX_13.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 8.4 MiB

BIN
assets/photogallery/japan-2018/PSX_14.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 8.7 MiB

BIN
assets/photogallery/japan-2018/PSX_15.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 7.2 MiB

BIN
assets/photogallery/japan-2018/PSX_16.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 5.2 MiB

BIN
assets/photogallery/japan-2018/PSX_17.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 6.4 MiB

BIN
assets/photogallery/japan-2018/PSX_18.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 5.6 MiB

BIN
assets/photogallery/japan-2018/PSX_19.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 9.1 MiB

BIN
assets/photogallery/japan-2018/PSX_2.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 6.6 MiB

BIN
assets/photogallery/japan-2018/PSX_20.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 6.2 MiB

BIN
assets/photogallery/japan-2018/PSX_21.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 14 MiB

BIN
assets/photogallery/japan-2018/PSX_22.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 17 MiB

BIN
assets/photogallery/japan-2018/PSX_23.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 14 MiB

BIN
assets/photogallery/japan-2018/PSX_24.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 15 MiB

BIN
assets/photogallery/japan-2018/PSX_25.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 12 MiB

BIN
assets/photogallery/japan-2018/PSX_26.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 13 MiB

BIN
assets/photogallery/japan-2018/PSX_27.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 19 MiB

BIN
assets/photogallery/japan-2018/PSX_28.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 19 MiB

BIN
assets/photogallery/japan-2018/PSX_29.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 18 MiB

BIN
assets/photogallery/japan-2018/PSX_3.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 6.8 MiB

BIN
assets/photogallery/japan-2018/PSX_30.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 23 MiB

BIN
assets/photogallery/japan-2018/PSX_31.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 19 MiB

BIN
assets/photogallery/japan-2018/PSX_32.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 9.3 MiB

BIN
assets/photogallery/japan-2018/PSX_33.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 20 MiB

BIN
assets/photogallery/japan-2018/PSX_34.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 17 MiB

BIN
assets/photogallery/japan-2018/PSX_35.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 16 MiB

BIN
assets/photogallery/japan-2018/PSX_36.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 8.7 MiB

BIN
assets/photogallery/japan-2018/PSX_37.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 9.6 MiB

BIN
assets/photogallery/japan-2018/PSX_38.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 12 MiB

BIN
assets/photogallery/japan-2018/PSX_39.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 19 MiB

BIN
assets/photogallery/japan-2018/PSX_4.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 3.1 MiB

BIN
assets/photogallery/japan-2018/PSX_40.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 17 MiB

BIN
assets/photogallery/japan-2018/PSX_41.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 19 MiB

BIN
assets/photogallery/japan-2018/PSX_42.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 16 MiB

BIN
assets/photogallery/japan-2018/PSX_43.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 18 MiB

BIN
assets/photogallery/japan-2018/PSX_44.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 15 MiB

BIN
assets/photogallery/japan-2018/PSX_5.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 5.9 MiB

BIN
assets/photogallery/japan-2018/PSX_6.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 4.4 MiB

BIN
assets/photogallery/japan-2018/PSX_7.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2.5 MiB

BIN
assets/photogallery/japan-2018/PSX_8.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1.5 MiB

BIN
assets/photogallery/japan-2018/PSX_9.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1.4 MiB

1
index.html
View file

@ -13,6 +13,7 @@
<body>
<div class="head"></div>
<div class="navigation">
<div class="mTitle"></div>
<div class="menuToggle"></div>
<ul>
<li class="list active" style="--clr:rgb(0, 196, 157);">

38
photography.html
View file

@ -3,7 +3,7 @@
<head>
<meta charset = "utf-8" />
<title>
Home
Photography - ALPHA
</title>
<!-- add icon link -->
<link rel = "icon" href = "assets/obo-icon.png"
@ -59,6 +59,41 @@
</ul>
</div>
<div class="content">
<a href="#japan2018">
<span class="icon"><ion-icon name="airplane-outline"></ion-icon></span>
<span class="text">Japan Trip - 2018</span>
</a>
</div>
<div class="gallery">
<div id="japan2018">
<figure class=”gallery__item gallery__item--1>
<img src="assets/photogallery/japan-2018/PSX_1.jpg" class="gallery__img" alt="Image 1">
</figure>
<figure class=”gallery__item gallery__item--2>
<img src="assets/photogallery/japan-2018/PSX_2.jpg" class="gallery__img" alt="Image 2">
</figure>
<figure class=”gallery__item gallery__item--3>
<img src="assets/photogallery/japan-2018/PSX_3.jpg" class="gallery__img" alt="Image 3">
</figure>
<figure class=”gallery__item gallery__item--4>
<img src="assets/photogallery/japan-2018/PSX_4.jpg" class="gallery__img" alt="Image 4">
</figure>
<figure class=”gallery__item gallery__item--5>
<img src="assets/photogallery/japan-2018/PSX_5.jpg" class="gallery__img" alt="Image 5">
</figure>
<figure class=”gallery__item gallery__item--6>
<img src="assets/photogallery/japan-2018/PSX_6.jpg" class="gallery__img" alt="Image 6">
</figure>
<figure class=”gallery__item gallery__item--7>
<img src="assets/photogallery/japan-2018/PSX_7.jpg" class="gallery__img" alt="Image 7">
</figure>
<figure class=”gallery__item gallery__item--8>
<img src="assets/photogallery/japan-2018/PSX_8.jpg" class="gallery__img" alt="Image 8">
</figure>
<figure class=”gallery__item gallery__item--9>
<img src="assets/photogallery/japan-2018/PSX_9.jpg" class="gallery__img" alt="Image 9">
</figure>
</div>
</div>
@ -78,7 +113,6 @@
list.forEach((item) =>
item.addEventListener('click',activeLink))
</script>
<script type="module" src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.esm.js"></script>
<script nomodule src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.js"></script>
</body>

6
projects.html
View file

@ -3,7 +3,7 @@
<head>
<meta charset = "utf-8" />
<title>
Home
Projects
</title>
<!-- add icon link -->
<link rel = "icon" href = "assets/obo-icon.png"
@ -28,13 +28,13 @@
</a>
</li>
<li class="list active" style="--clr:rgb(0, 196, 157);">
<a href="projects.html">
<a href="#">
<span class="icon"><ion-icon name="code-slash"></ion-icon></span>
<span class="text">Projects</span>
</a>
</li>
<li class="list" style="--clr:rgb(0, 196, 157);">
<a href="#">
<a href="photography.html">
<span class="icon"><ion-icon name="camera"></ion-icon></span>
<span class="text">Photography</span>
</a>

179
style.css
View file

@ -1,4 +1,14 @@
/*GENERAL*/
@import url('https://fonts.googleapis.com/css2?family=Martian+Mono&display=swap');
a:link {
color: rgb(173, 173, 173);
}
a:visited{
color:rgb(173, 173, 173);
}
/*GENERAL*/
/*NAVIGATION BAR*/
*
{
margin: 0;
@ -6,12 +16,10 @@
box-sizing: border-box;
font-family: 'Martian', monospace;
}
body
{
body{
background:#332e33;
}
.navigation
{
.navigation{
position: fixed;
inset: 20px 0 20px 20px;
width: 80px;
@ -21,11 +29,45 @@ body
justify-content: center;
align-items: center;
}
.navigation.open
{
.navigation.open{
width: 250px;
}
.navigation .menuToggle
.navigation .menuToggle{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 60px;
border-bottom: 1px solid rgba(0,0,0,0.25);
cursor: pointer;
display: flex;
align-items: center;
justify-content: flex-start;
padding: 0 23px;
}
.navigation .menuToggle::before{
content: '';
position: absolute;
width: 30px;
height: 2px;
background: #413b41;
transform: translateY(-8px);
transition: 0.5s;
}
.navigation.open .menuToggle::before{
transform: translateY(0px) rotate(45deg);
}
.navigation .menuToggle::after{
content: '';
position: absolute;
width: 30px;
height: 2px;
background: #413b41;
transform: translateY(8px);
transition: 0.5s;
box-shadow: 0 -8px 0 #413b41;
}
.navigation .mTitle
{
position: absolute;
top: 0;
@ -39,45 +81,20 @@ body
justify-content: flex-start;
padding: 0 23px;
}
.navigation .menuToggle::before
{
content: '';
position: absolute;
width: 30px;
height: 2px;
background: #413b41;
transform: translateY(-8px);
transition: 0.5s;
.navigation.mTitle .menuToggle::after{
content:'Limepot';
}
.navigation.open .menuToggle::before
{
transform: translateY(0px) rotate(45deg);
}
.navigation .menuToggle::after
{
content: '';
position: absolute;
width: 30px;
height: 2px;
background: #413b41;
transform: translateY(8px);
transition: 0.5s;
box-shadow: 0 -8px 0 #413b41;
}
.navigation.open .menuToggle::after
{
.navigation.open .menuToggle::after{
transform: translateY(0px) rotate(-45deg);
box-shadow: 0 0 0 #413b41;
}
.navigation ul
{
.navigation ul{
display: flex;
flex-direction: column;
gap: 10px;
width: 100%
}
.navigation ul li
{
.navigation ul li{
list-style: none;
position: relative;
width: 100%;
@ -85,16 +102,13 @@ body
padding: 0 10px;
transition: 0.5s;
}
.navigation ul li.active
{
.navigation ul li.active{
transform: translateX(30px)
}
.navigation.open ul li.active
{
.navigation.open ul li.active{
transform: translateX(10px)
}
.navigation ul li a
{
.navigation ul li a{
position: relative;
display: flex;
align-items: center;
@ -102,8 +116,7 @@ body
text-align: center;
text-decoration: none;
}
.navigation ul li a .icon
{
.navigation ul li a .icon{
position: relative;
display: block;
min-width: 55px;
@ -114,13 +127,11 @@ body
font-size: 1.75em;
color: rgb(90, 90, 90);
}
.navigation ul li.active a .icon
{
.navigation ul li.active a .icon{
color: #fff;
background: var(--clr);
}
.navigation ul li a .icon::before
{
.navigation ul li a .icon::before{
content: '';
position: absolute;
top: 10px;
@ -132,12 +143,10 @@ body
opacity: 0;
transition: 0.5s;
}
.navigation ul li.active a .icon::before
{
.navigation ul li.active a .icon::before{
opacity: 0.5;
}
.navigation ul li a .text
{
.navigation ul li a .text{
position: relative;
padding: 0 15px;
height: 60px;
@ -148,17 +157,69 @@ body
visibility: hidden;
transition: 0.5s;
}
.navigation.open ul li a .text
{
.navigation.open ul li a .text{
opacity: 1;
visibility: visible;
}
.navigation ul li.active a .text
{
.navigation ul li.active a .text{
color: var(--clr);
}
.content
{
/*NAVIGATION BAR*/
/*PAGE CONTENT*/
.content{
color: rgb(173, 173, 173);
text-align: center;
padding-top: 60px;
}
.content .icon{
display: block;
min-width: 55px;
height: 55px;
transition: 05.s;
border-radius: 10px;
font-size: 2.75em;
}
.content .text{
height: 60px;
align-items: center;
color: rgb(173, 173, 173);
opacity: 0;
visibility: visible;
transition: 0.5s;
padding-left: 500px;
}
.content.text a:link{
visibility: hidden;
}
/*PAGE CONTENT*/
/*AWFUL FUCKING GALLERY BULLSHIT FUCK FUCK FUCK FUCK FUCK FUCK*/
.gallery {
display: grid;
grid-template-columns: repeat(8, 1fr);
grid-template-rows: repeat(8, 5vw);
grid-gap: 15px;
padding-left: 280px;
}
.gallery__img {
width: 200%;
height: 100%;
object-fit: cover;
}
.gallery__item--1 {
grid-column-start: 1;
grid-column-end: 3;
grid-row-start: 1;
grid-row-end: 3;
}
.gallery__item--2 {
grid-column-start: 1;
grid-column-end: 3;
grid-row-start: 1;
grid-row-end: 3;
}
/*AWFUL FUCKING GALLERY BULLSHIT FUCK FUCK FUCK FUCK FUCK FUCK*/

8
videography.html
View file

@ -3,12 +3,13 @@
<head>
<meta charset = "utf-8" />
<title>
Home
Videography
</title>
<!-- add icon link -->
<link rel = "icon" href = "assets/obo-icon.png"
type = "image/x-icon">
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div class="head"></div>
@ -59,7 +60,10 @@
</ul>
</div>
<div class="content">
<a href="https://www.youtube.com/channel/UCk_yKIpDnMv_DvuDb9RGfcA">
<span class="icon"><ion-icon name="logo-youtube"></ion-icon></span>
<span class="text">YouTube</span>
</a>
</div>
<script>