TEMPLATES

strawberry love!
posted: i guess July 11, 2024.

i just love strawberries i guess and i was inspired by this person.

calendar tutorial! / Edit calendar here!

Live Preview!

<!DOCTYPE html>
<html lang="en">
<head>

<!--
messy fucking code. (figured it out hehe)
i am not good at explaining, but fujoshi uses grids like me. check her out.
if you want this theme, just credit me somewhere.⠀⠀

theme inspired by oooeee@nekoweb.org

calendar code is from https://www.javascriptfreecode.com/36.htm !
-->

<link href="style.css" rel="stylesheet" type="text/css" media="all">

<link rel="icon" type="image/png" href="favicon.png">
  
  
  <title>strawberry love</title>
        
  <style>

/* link styling! do whatever!! */
a:link {
text-decoration: none;
color:black;
}

a:visited {
text-decoration: none;
color:black;
}

a:hover {
text-decoration: none;
font-style:italic;
color:#FFEFEF;
font-weight:bold;
}

a:active {
text-decoration: none;
color:black;
}
/* end of link styling */

/* these are what you need. background color/image, font color and what font you want to use */
body{
font-family:ms gothic;
font-size:14px;
color:#5D5D5D;
background-color:#FFEFEF;
background-image:url("");
background-size:cover;
background-attachment: fixed;
padding:10px;
overflow:auto;
}

/* this is the container. the mother grid. */
.container {  
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr;
  gap: 0px 0px;
  grid-auto-flow: row;
  grid-template-areas:
    ". 오이 오이 오이 오이 ."
    ". 오이 오이 오이 오이 ."
    ". 오이 오이 오이 오이 ."
    ". 오이 오이 오이 오이 ."
    ". 오이 오이 오이 오이 ."
    ". 오이 오이 오이 오이 .";
  height:800px;
  width:900px;
  margin:auto;
  padding:0px;
  position:relative;
}

/* these are the mother grids kids! */
.오이 {  
  display: grid;
  grid-template-columns: 0.8fr 1.2fr 1fr;
  grid-template-rows: 1.9fr 0.1fr 1.6fr 1fr 1.8fr 0.1fr;
  gap: 0px 0px;
  grid-auto-flow: row;
  grid-template-areas:
    "우유 우유 우유"
    "딸기 딸기 딸기"
    "수박 복숭이 복숭이"
    "수박 복숭이 복숭이"
    "수박 복숭이 복숭이"
    "사과 사과 사과";
  grid-area: 오이;
}

/* header shit! */
.우유 { 
grid-area: 우유; 
border:1px solid black;
border-bottom:none;
background-color:white;
background-image:url("https://file.garden/ZgMuVg_U3BIqPawa/strawberry.png");
}

/* that little cute text under the header! */
.딸기 { 
grid-area: 딸기; 
border:1px solid black;
padding:1px;
background-color:white;
text-align:center;
}

/* this is where the .떡 and .ㅅㅂ is. */
/* you can erase those and make an entirely new navigation style! */
.수박 { 
grid-area: 수박; 
border:1px solid black;
border-top:none;
border-right:none;
border-bottom:none;
background-color:white;
padding:0px 0px 5px 0px;
}

/* this is the mother grids grandkids */
.복숭이 { 
  display: grid; 
  grid-auto-rows: 1fr; 
  grid-template-columns: 1fr 0.7fr 1.3fr; 
  grid-template-rows: 1.1fr 1fr 1fr; 
  gap: 0px 0px; 
  grid-template-areas: 
    "포도 포도 ㅠㅠ"
    "씨발 씨발 씨발"
    "씨발 씨발 씨발"; 
grid-area: 복숭이; 
border:1px solid black;
border-top:none;
border-bottom:none;
background-color:white;
padding:5px;
}

/* this is the site info on the left! */
.포도 { 
grid-area: 포도; 
padding:5px;
line-height:110%;
}

/* this is for the calendar! on the right! */
.ㅠㅠ { 
grid-area: ㅠㅠ; 
padding:0px;
float:right;
}

/* more area under the site info and calendar divs! */
.씨발 { 
grid-area: 씨발; 
padding:5px;
line-height:110%;
}

/* this is the footer! */
.사과 { 
grid-area: 사과; 
border:1px solid black;
text-align:center;
padding:1px;
background-color:white;
}

/* this is the navigation area where they have their own divs */
/* of course you can change this! doesn't have to be in it's own div box! */
.떡 {
background-color: #FFD0D0;
background-image:url("");
border:1px groove black;
border-left:none;
border-right:none;
border-radius:0px;
color: #5d5d5d;
padding:5px;
text-align:center;
}

/* this is the navigation area but on hover */
.떡:hover {
background-color: #CA8787;
background-image:url("");
border:1px groove black;
border-left:none;
border-right:none;
border-radius:0px;
font-style:italic;
color:#FFEFEF;
font-weight:bold;
padding:5px;
text-align:center;
}

/* this is that little description info under the navigation area. it has its own div */
.ㅅㅂ {
padding:5px;
}

</style>
        
</head>
    
  <body>

<div class="container">

<div class="오이">

<div class="우유">
  
      
    </div>
    
    
    <div class="딸기">
    ｡･ﾟ･( craving all the <font color="#D37676">strawberry cakes</font> in the world )･ﾟ･｡
    </div>
    
    
    <div class="수박">
    
    	
    	
    	
    	<div class="떡" style="border-bottom:none;border-top:none;background-color:#CA8787;">
        <b>navigation</b>
        </div>
        <div class="떡" style="border-bottom:none;">
        <a href="" style="cursor: not-allowed;">index</a>
        </div>
        <div class="떡" style="border-bottom:none;">
        <a href="" style="cursor: not-allowed;">profile</a>
        </div>
        <div class="떡" style="border-bottom:none;">
        <a href="" style="cursor: not-allowed;">journal</a>
        </div>
        <div class="떡" style="border-bottom:none;">
        <a href="" style="cursor: not-allowed;">links</a>
        </div>
        <div class="떡" style="border-bottom:none;background-color:#CA8787;">
        <b>personal</b>
        </div>
        <div class="떡" style="border-bottom:none;">
        <a href="" style="cursor: not-allowed;">shrines</a>
        </div>
        <div class="떡" style="border-bottom:none;">
        <a href="" style="cursor: not-allowed;">plushies</a>
        </div>
        <div class="떡" style="border-bottom:none;">
        <a href="" style="cursor: not-allowed;">projects</a>
        </div>
        <div class="떡" style="border-bottom:none;">
        <a href="" style="cursor: not-allowed;">artworks</a>
        </div>
        <div class="떡" style="border-bottom:none;background-color:#CA8787;">
        <b>offsite</b>
        </div>
        <div class="떡" style="border-bottom:none;">
        <a href="" style="cursor: not-allowed;">guestbook</a>
        </div>
        <div class="떡">
        <a href="" style="cursor: not-allowed;">discord</a>
        </div>
        
     
     <div class="ㅅㅂ">this specimen is in the works of perfection! check back later!
     
     
     <center><img src="https://file.garden/ZgMuVg_U3BIqPawa/trinket.png" style="width:140px;margin-top:2px;border:1px solid black;"></center>
     </div>
    </div>
    
    
    <div class="복숭이">
        
    	<div class="포도">
      <img src="https://file.garden/ZgMuVg_U3BIqPawa/tumblr_inline_pabkliYUj41t78dpp_75sq.webp" style="float:left;padding-right:5px;"> welcome to the specimen! here lies the construction work of <i>site name</i> that is in the process of perfection! this site is made with blood sweat and tears but also using grid.layout! made by <a href="https://rice.nekoweb.org/">rice</a>!<br><br>
      thank you so much for visiting my site, consinder dropping a comment on my guestbook? <br>|ｮ･ω･｀*)ｽｷｯ.｡.･ﾟ 
      </div>
      
       <div class="ㅠㅠ">
      <iframe id="frame" src="https://rice.nekoweb.org/misc/calendar3.html" width="100%" height="100%" frameborder="0"></iframe>
        </div>
        
        <div class="씨발">
        
        <center><img src="https://file.garden/ZgMuVg_U3BIqPawa/cytmylmvmp.png" style="border:1px solid black;"></center>
        strawberry cakes are a must. it is beautiful, tasty and very delicious. <img src="https://file.garden/ZgMuVg_U3BIqPawa/tumblr_52d95f8a46919c10a266437d4c057802_70803193_250.webp" style="float:right;"> the cream is rich, the strawberries are sweet, the cake is soft and white. and all together, is the most delicious treat in the world. <br><br>
        check out this website for information and recipe on <a href="https://www.justonecookbook.com/japanese-strawberry-shortcake/">japanese strawberry shortcake</a> (いちごのショートケーキ)!
        </div>
    </div>
    
    
    <div class="사과">
    hosted on (<b>知るかぼけ</b>) 2024, made with love.
    </div>
    
  </div>
  
</div>

</body>
    
</html>