From f4bc2178cb41543a600f5a5583e0c959fa8e30ca Mon Sep 17 00:00:00 2001 From: t404owo Date: Wed, 8 Oct 2025 12:13:32 +0000 Subject: [PATCH 01/15] added contact form (rework soon) --- contacts/index.html | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/contacts/index.html b/contacts/index.html index f266124..2f9bc9d 100644 --- a/contacts/index.html +++ b/contacts/index.html @@ -220,6 +220,20 @@ I write/make/produce EDM music(DTM), and for every releases I'll post my music o +
+
+
+ + +
+ + +

+ + + +
+
© t404:null 2021-2024 - All Rights Reserved
From 66b845fd11cb572f4db880213fa67ca2bd95e1d3 Mon Sep 17 00:00:00 2001 From: t404owo Date: Wed, 8 Oct 2025 12:14:10 +0000 Subject: [PATCH 02/15] uhhh removed stuffs :DDD --- contacts/index.html | 1 - 1 file changed, 1 deletion(-) diff --git a/contacts/index.html b/contacts/index.html index 2f9bc9d..9427161 100644 --- a/contacts/index.html +++ b/contacts/index.html @@ -229,7 +229,6 @@ I write/make/produce EDM music(DTM), and for every releases I'll post my music o

- From 81d6fd2475faebb54a7434deca95e51dcc60550a Mon Sep 17 00:00:00 2001 From: t404owo Date: Wed, 8 Oct 2025 12:15:27 +0000 Subject: [PATCH 03/15] updated pass to subject xD --- contacts/index.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/contacts/index.html b/contacts/index.html index 9427161..5957b43 100644 --- a/contacts/index.html +++ b/contacts/index.html @@ -226,8 +226,8 @@ I write/make/produce EDM music(DTM), and for every releases I'll post my music o
- - + +

From d5915b1b5956a1b96585fb1687cc6c189cadca31 Mon Sep 17 00:00:00 2001 From: t404owo Date: Thu, 16 Oct 2025 03:34:39 +0200 Subject: [PATCH 04/15] Create CNAME --- CNAME | 1 + 1 file changed, 1 insertion(+) create mode 100644 CNAME diff --git a/CNAME b/CNAME new file mode 100644 index 0000000..3d8c40b --- /dev/null +++ b/CNAME @@ -0,0 +1 @@ +t404null.com \ No newline at end of file From 90b7aa5b6f9c2946f8b2c3ccf184318808abe80e Mon Sep 17 00:00:00 2001 From: t404owo Date: Thu, 16 Oct 2025 03:36:04 +0200 Subject: [PATCH 05/15] Delete CNAME --- CNAME | 1 - 1 file changed, 1 deletion(-) delete mode 100644 CNAME diff --git a/CNAME b/CNAME deleted file mode 100644 index 3d8c40b..0000000 --- a/CNAME +++ /dev/null @@ -1 +0,0 @@ -t404null.com \ No newline at end of file From cdb62225535ed1e25cafc457af54792e1cd35154 Mon Sep 17 00:00:00 2001 From: t404owo Date: Thu, 16 Oct 2025 23:06:21 +0000 Subject: [PATCH 06/15] updated form nor now ._." Time to apply CSS and JS --- contacts/index.html | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) diff --git a/contacts/index.html b/contacts/index.html index 5957b43..06f67a3 100644 --- a/contacts/index.html +++ b/contacts/index.html @@ -223,12 +223,19 @@ I write/make/produce EDM music(DTM), and for every releases I'll post my music o
+ + +

- + -

+
+ + +
+
From 1149d1fdfbec9a4ab9d06fac55bf2d9288d5223d Mon Sep 17 00:00:00 2001 From: t404owo Date: Thu, 16 Oct 2025 23:11:37 +0000 Subject: [PATCH 07/15] made the text not too serious to delight my client ofc ;D Some form edit b4 CSS and JS involved.... --- contacts/index.html | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/contacts/index.html b/contacts/index.html index 06f67a3..79f9d5d 100644 --- a/contacts/index.html +++ b/contacts/index.html @@ -224,16 +224,16 @@ I write/make/produce EDM music(DTM), and for every releases I'll post my music o
- +
- +
- +
- +

From 9e7ca86494399c716d5dd2586e7108afdb861d40 Mon Sep 17 00:00:00 2001 From: t404owo Date: Thu, 16 Oct 2025 23:42:15 +0000 Subject: [PATCH 08/15] Updated serveral stuffs JS: added for Empty slots a msg (user request). Updated copyright and ToS/ToU for my tracks / properties. --- about_me/index.html | 2 +- activity/index.html | 2 +- assets/js/index.js | 11 +++++--- contacts/index.html | 2 +- index.html | 10 +++++--- release/index.html | 2 +- song_usage_terms/index.html | 50 ++++++++++++++++++++++++++----------- 7 files changed, 54 insertions(+), 25 deletions(-) diff --git a/about_me/index.html b/about_me/index.html index 9459457..0e74cd9 100644 --- a/about_me/index.html +++ b/about_me/index.html @@ -224,6 +224,6 @@ I write/make/produce EDM music(DTM), and for every releases I'll post my music o
-
© t404:null 2021-2024 - All Rights Reserved
+
© t404:null 2021-2025 - All Rights Reserved
diff --git a/activity/index.html b/activity/index.html index dcf56d1..1caf52b 100644 --- a/activity/index.html +++ b/activity/index.html @@ -278,6 +278,6 @@ I write/make/produce EDM music(DTM), and for every releases I'll post my music o -
© t404:null 2021-2024 - All Rights Reserved
+
© t404:null 2021-2025 - All Rights Reserved
diff --git a/assets/js/index.js b/assets/js/index.js index c997801..616ade6 100644 --- a/assets/js/index.js +++ b/assets/js/index.js @@ -10,7 +10,8 @@ let carousel = document.querySelector(".carousel"); let bg = document.querySelector(".slider-bg"); //Album-cards -let album_cards = document.querySelector(".album-cards"); +let album_cards = document.querySelector(".album-cards"), +half_img_cards = document.querySelector(".half-image-cards"); //The Database call. import { createClient } from "https://cdn.jsdelivr.net/npm/@supabase/supabase-js/+esm"; @@ -291,6 +292,7 @@ async function init_releases(d) {

"Even if you don't remember me now, I will bring the you I once knew back from them."

*/ + if(releases.length>0)album_cards.context=""; releases.forEach((a) => { let _card = document.createElement("a"), _bg_img = document.createElement("div"), @@ -321,7 +323,7 @@ async function init_activities(d) { if (d.error) { console.error("Error fetching data:", d.error); } else { - releases = d.data; + activities = d.data; /*
{ let _card = document.createElement("a"), _bg_img = document.createElement("div"), _h2 = document.createElement("h2"), @@ -390,7 +393,7 @@ async function init_activities(d) { _card.appendChild(_h2); _card.appendChild(_p_subtitle); _card.appendChild(_p_preview); - album_cards.appendChild(_card); + half_img_cards.appendChild(_card); }); } } diff --git a/contacts/index.html b/contacts/index.html index 79f9d5d..530ebe2 100644 --- a/contacts/index.html +++ b/contacts/index.html @@ -241,6 +241,6 @@ I write/make/produce EDM music(DTM), and for every releases I'll post my music o
-
© t404:null 2021-2024 - All Rights Reserved
+
© t404:null 2021-2025 - All Rights Reserved
\ No newline at end of file diff --git a/index.html b/index.html index c13d3f5..e67dd64 100644 --- a/index.html +++ b/index.html @@ -219,14 +219,18 @@ I write/make/produce EDM music(DTM), and for every releases I'll post my music o

Releases (Click for more)

-
+
+ Nothing here yet. ;D +

Activities

-
+
+ Nothing here yet. ;D +
-
© t404:null 2021-2024 - All Rights Reserved
+
© t404:null 2021-2025 - All Rights Reserved
diff --git a/release/index.html b/release/index.html index a4abdf7..5b9b697 100644 --- a/release/index.html +++ b/release/index.html @@ -195,6 +195,6 @@ I write/make/produce EDM music(DTM), and for every releases I'll post my music o -
© t404:null 2021-2024 - All Rights Reserved
+
© t404:null 2021-2025 - All Rights Reserved
\ No newline at end of file diff --git a/song_usage_terms/index.html b/song_usage_terms/index.html index 5bd68a1..f93c6cf 100644 --- a/song_usage_terms/index.html +++ b/song_usage_terms/index.html @@ -202,23 +202,33 @@
All use of the music/track(s)/song(s) is at your own risk. I'm not responsible for any damage, problems caused by your use of my music/track(s)/song(s) and won't be involved in by any way.
  • - 1.) In the case if you want to use my song(s) / track(s) as a corporation / a company -
    If you wish to use my song as a corporation / a company, no matter how you use it, please contact me and get confirmation at one of the following email address(es):
    - t404.null@gmail.com -
    - t404owo@gmail.com -
    - tags4owo@gmail.com -
    • -
  • -
    - 1.1.) In the case if you want to use my song(s) / track(s) as an educational institution or a volunteer organization / a company for volunteer -
    You are allowed use my songs as well as individuals.
    If you can, it would be (very) helpful for me if you could confirm it once in the following email adress(es):
    + 1.) In the case if you want to use my song(s) / track(s) as a corporation / a company material +
    If you wish to use my song as a corporation / a company material, no matter how you use it, please contact me and get confirmation at one of the following email address(es):
    + request@t404null.com +

    + Or: +
    t404.null@gmail.com
    t404owo@gmail.com
    tags4owo@gmail.com +
    +
    • +
  • +
    + 1.1.) In the case if you want to use my song(s) / track(s) as an educational institution or a volunteer organization / a company for volunteer +
    You are allowed use my songs as well as individuals.
    If you can, it would be (very) helpful for me if you could confirm it once in the following email adress(es):
    + info@t404null.com +

    + Or: +
    + t404.null@gmail.com +
    + t404owo@gmail.com +
    + tags4owo@gmail.com +

    Please note that this is intended primarily, but not exclusively, for educational institutions related to music.
    • @@ -254,6 +264,10 @@
    3.2.) If you want to distribute the music as an official chart / official music for a rhythm game (in short, if you're a developer/offical charter/owner of that game) or if you want to use my song/track as a BGM that is included for a program / a game or its directory
    Please contact me at one of the following email address(es):
    + request@t404null.com +

    + Or: +
    t404.null@gmail.com
    t404owo@gmail.com @@ -266,6 +280,10 @@
    3.3.) If you want to repost my song
    Please contact me at one of the following email address(es):
    + request@t404null.com +

    + Or: +
    t404.null@gmail.com
    t404owo@gmail.com @@ -277,6 +295,10 @@
  • 4.) Other Uses
    Please contact me at one of the following email address(es):
    + info@t404null.com +

    + Or: +
    t404.null@gmail.com
    t404owo@gmail.com @@ -284,9 +306,9 @@ tags4owo@gmail.com
    • -
    © t404:null 2021-2024 - All Rights Reserved. +
    © t404:null 2021-2025 - All Rights Reserved. -
    © t404:null 2021-2024 - All Rights Reserved
    +
    © t404:null 2021-2025 - All Rights Reserved
    \ No newline at end of file From 1104fd3998ce488d38c1b0b5a4d476cbdfd964a3 Mon Sep 17 00:00:00 2001 From: t404owo Date: Thu, 16 Oct 2025 23:46:14 +0000 Subject: [PATCH 09/15] Fixed a bug.... "context", lmao I cringed hard, replaced w/ innerHTML. --- assets/js/index.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/assets/js/index.js b/assets/js/index.js index 616ade6..b57f0cc 100644 --- a/assets/js/index.js +++ b/assets/js/index.js @@ -292,7 +292,7 @@ async function init_releases(d) {

    "Even if you don't remember me now, I will bring the you I once knew back from them."

    */ - if(releases.length>0)album_cards.context=""; + if(releases.length>0)album_cards.innerHTML=""; releases.forEach((a) => { let _card = document.createElement("a"), _bg_img = document.createElement("div"), @@ -371,7 +371,7 @@ async function init_activities(d) {

    ???

    ???

    */ - if(activities.length>0)album_cards.context=""; + if(activities.length>0)album_cards.innerHTML=""; activities.forEach((a) => { let _card = document.createElement("a"), _bg_img = document.createElement("div"), From d704e025a69b3cd54c2ec3b396fbaae5761f802b Mon Sep 17 00:00:00 2001 From: t404owo Date: Thu, 16 Oct 2025 23:50:42 +0000 Subject: [PATCH 10/15] replaced login submit... --- contacts/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/contacts/index.html b/contacts/index.html index 530ebe2..352e368 100644 --- a/contacts/index.html +++ b/contacts/index.html @@ -237,7 +237,7 @@ I write/make/produce EDM music(DTM), and for every releases I'll post my music o

    - +
    From da810d6a034fbd25f0a0183fc1ff810c89052e0b Mon Sep 17 00:00:00 2001 From: t404owo Date: Thu, 16 Oct 2025 23:55:56 +0000 Subject: [PATCH 11/15] JS fix about /release and /release/ issue --- assets/js/index.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/assets/js/index.js b/assets/js/index.js index b57f0cc..52a7d27 100644 --- a/assets/js/index.js +++ b/assets/js/index.js @@ -56,8 +56,8 @@ if (!params.get("release")) { document.title = "t404:null | Home"; build_event(0); } - if (path_name === "/" || path_name === "/release") build_event(1); - if (path_name === "/" || path_name === "/activity") build_event(2); + if (path_name === "/" || path_name === "/release" || path_name === "/release/") build_event(1); + if (path_name === "/" || path_name === "/activity" || path_name === "/activity/") build_event(2); } else { let main = document.querySelector("main"); main.innerHTML = ""; From f93651422895228ab709333fda9377900da8b95b Mon Sep 17 00:00:00 2001 From: t404owo Date: Thu, 16 Oct 2025 23:58:17 +0000 Subject: [PATCH 12/15] . --- release/index.html | 1 + 1 file changed, 1 insertion(+) diff --git a/release/index.html b/release/index.html index 5b9b697..ca1d9f2 100644 --- a/release/index.html +++ b/release/index.html @@ -192,6 +192,7 @@ I write/make/produce EDM music(DTM), and for every releases I'll post my music o

    Releases

    + Nothing here yet. ;D
    From b6034115c8ee2765ebf867f7773b1356b7f64842 Mon Sep 17 00:00:00 2001 From: t404owo Date: Fri, 17 Oct 2025 00:39:48 +0000 Subject: [PATCH 13/15] some cosmetics fix ;D --- assets/css/main.css | 188 +++++++++++++++++++++++++++++++++++- contacts/index.html | 11 ++- song_usage_terms/index.html | 10 +- 3 files changed, 198 insertions(+), 11 deletions(-) diff --git a/assets/css/main.css b/assets/css/main.css index cbac8ce..dc5c7b3 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -7,21 +7,28 @@ body { margin: 0px; height: 100%; } -main { + +main, textarea, textfield { font-family: Jost, "Noto Sans Japanese", sans-serif, --apple-system; +} + +main { margin: 0.75rem; height: 100%; margin-bottom: 0; margin-top: 0; min-height: calc(100vh - 10vh); } + .main-page { max-width: 2300px; margin: 0 auto; } + hr { margin: 2rem 0px; } + nav { z-index: 4; position: -webkit-sticky; @@ -39,21 +46,25 @@ nav { box-shadow: 0px 0px 12px 0.1px #d0d0d0; display: grid; grid-template-columns: auto 1fr auto; + ul { padding-left: 15px; list-style-type: none; margin: 0px; align-content: center; + li { display: inline-block; padding-right: 4px; vertical-align: middle; + p { padding-top: 0.4rem; vertical-align: middle; margin: 0.5rem 1rem; } } + img { margin-top: 0.25rem; height: 1.5rem; @@ -61,6 +72,7 @@ nav { padding-right: 0.3rem; } } + a { color: black; text-decoration: none; @@ -72,19 +84,23 @@ nav { -ms-user-select: none; user-select: none; } + .vertical-line { width: 0.1rem; background-color: black; height: 100%; } + .social { font-size: 2.5rem; padding-bottom: 0.4rem; transition: 0.3s; } + .social:hover { opacity: 50%; } + .dropdown { margin: 0.75rem; position: absolute; @@ -120,6 +136,7 @@ nav { .menu { padding-top: 0.4rem; padding-bottom: 0.8rem; + p { background-size: 0% 0.2em; background-image: linear-gradient(#000, #000); @@ -128,6 +145,7 @@ nav { background-repeat: no-repeat; transition: 0.3s ease-in-out; } + p:hover, .currentpage { opacity: 60%; @@ -147,6 +165,7 @@ nav { background-color: #f5f5f5; border-radius: 12px; transition: 0.2s ease-in-out; + span { transition: 0.2s ease-in-out; box-sizing: border-box; @@ -154,12 +173,14 @@ nav { background-color: #000; border-radius: 2px; } + #hamburger { position: absolute; height: 100%; width: 100%; top: 0%; left: 0%; + span { width: 70%; height: 5%; @@ -168,16 +189,20 @@ nav { position: relative; margin: 12% 0; } + span:nth-child(1) { transition-delay: 0.2s; } + span:nth-child(2) { transition-delay: 0.3s; } + span:nth-child(3) { transition-delay: 0.4s; } } + #cross { position: absolute; height: 100%; @@ -190,11 +215,13 @@ nav { height: 0%; width: 5%; position: absolute; - right: 46%; /*a / */ + right: 46%; + /*a / */ top: 10%; transform: translate(-50%); transition-delay: 0s; } + span:nth-child(2) { width: 0%; height: 5%; @@ -215,21 +242,26 @@ nav { span { width: 0%; } + span:nth-child(1) { transition-delay: 0s; } + span:nth-child(2) { transition-delay: 0.1s; } + span:nth-child(3) { transition-delay: 0.2s; } } + #cross { span:nth-child(1) { height: 80%; transition-delay: 0.3s; } + span:nth-child(2) { width: 80%; transition-delay: 0.3s; @@ -242,6 +274,7 @@ nav { overflow: auto; max-height: 70vh; } + /*---- main ----*/ .container { position: relative; @@ -250,6 +283,7 @@ nav { margin: auto; margin-top: 1rem; } + .carousel { z-index: 1; width: 100%; @@ -259,6 +293,7 @@ nav { position: relative; overflow: hidden; } + .slider-bg { height: 100%; width: 100%; @@ -279,6 +314,7 @@ nav { border-radius: 0.5rem; transform: scale(1.1); } + .slider section { overflow: hidden; z-index: 1; @@ -293,6 +329,7 @@ nav { border-radius: 0.5rem; font-family: "Plus Jakarta Sans", "Noto Sans Japanese", sans-serif, --apple-system; + div { color: #fff; position: relative; @@ -303,27 +340,33 @@ nav { grid-template-rows: 3.5fr 1fr 1fr 5rem; grid-template-columns: 1fr auto 1fr; } + h1 { font-size: 2rem; grid-row-start: 2; grid-row-end: 3; } + p { font-size: 1.25rem; grid-row-start: 3; grid-row-end: 4; } + p, h1 { width: 60vw; text-align: center; - grid-column-start: 2; /*|•|*/ + grid-column-start: 2; + /*|•|*/ grid-column-end: 3; } } + .slider:hover { cursor: pointer; } + .prev, .next { background-color: rgba(0, 0, 0, 0.3); @@ -346,12 +389,15 @@ nav { -ms-user-select: none; user-select: none; } + .next { right: 1rem; } + .prev { left: 1rem; } + .pgctrl { font-family: sans-serif, --apple-system; z-index: 1; @@ -379,6 +425,7 @@ nav { -ms-user-select: none; user-select: none; } + .control { text-align: center; } @@ -393,6 +440,7 @@ nav { grid-template-rows: repeat(auto-fill, 23rem); grid-template-columns: repeat(auto-fill, 23rem); grid-gap: 1rem; + .card { transition: 0.75s; color: black; @@ -400,6 +448,7 @@ nav { height: 23rem; border-radius: 7px; text-decoration: none; + div { z-index: 1; position: inherit; @@ -409,12 +458,15 @@ nav { border-radius: 7px; transition: 0.5s; } + h2 { font-size: 1.9rem; } + p { font-size: 1.2rem; } + h2, p { color: white; @@ -424,6 +476,7 @@ nav { opacity: 0; transition: 0.5s; } + .bg-img { /* background: url(/assets/img/t404_null-logo.png); */ background-size: cover; @@ -432,11 +485,13 @@ nav { width: 23rem; } } + .card:hover { .bg-img { filter: blur(5px) brightness(50%); -webkit-filter: blur(5px) brightness(50%); } + h2, p { filter: none; @@ -453,6 +508,7 @@ nav { grid-template-rows: repeat(auto-fill, 30rem); grid-template-columns: repeat(auto-fill, minmax(23rem, 60rem)); grid-gap: 1rem; + .card { transition: 0.75s; color: black; @@ -460,6 +516,7 @@ nav { height: 30rem; border-radius: 7px; text-decoration: none; + div { z-index: 1; position: inherit; @@ -469,12 +526,15 @@ nav { border-radius: 7px; transition: 0.5s; } + h2 { font-size: 1.9rem; } + p { font-size: 1.1rem; } + h2, p { /* color: black; */ @@ -484,6 +544,7 @@ nav { opacity: 0; transition: 0.5s; } + .bg-img { /* background: url(/assets/img/t404_null-logo.png); */ background-size: cover; @@ -493,6 +554,7 @@ nav { width: 30rem; } } + .card:hover { .bg-img { filter: brightness(40%); @@ -500,6 +562,7 @@ nav { width: 8vw; border-radius: 7px 0px 0px 7px; } + h2, p { padding: 0.3rem 5vw 0.3rem 10vw; @@ -515,6 +578,7 @@ nav { grid-gap: 1rem; justify-content: center; padding: 0; + li { border-radius: 7px; background-color: #ddd; @@ -526,6 +590,7 @@ nav { font-size: 3rem; margin-top: 3vw; margin-bottom: 7vw; + a { text-decoration: none; color: black; @@ -536,6 +601,7 @@ nav { background-repeat: no-repeat; transition: 0.3s ease-in-out; } + a:hover { opacity: 70%; background-size: 100% 0.2em; @@ -547,10 +613,12 @@ nav { font-size: 2.25rem; font-weight: 500; } + @font-face { font-family: "NerdFontsSymbols Nerd Font"; src: url("/assets/fonts/nf-symbols.woff2") format("woff2"); } + .nf-icons { font-family: "NerdFontsSymbols Nerd Font"; } @@ -564,9 +632,11 @@ nav { padding: 5vw 5vw; border-radius: 10px; border: 1px solid #ddd; + strong { color: #fff; } + .text-box { max-width: 1250px; margin: 25% auto; @@ -576,6 +646,7 @@ nav { padding: 2rem; border-radius: 7px; font-size: 1.2rem; + a { text-decoration: none; color: #fff; @@ -586,6 +657,7 @@ nav { background-repeat: no-repeat; transition: 0.3s ease-in-out; } + a:hover { color: #ccc; background-size: 100% 0.2em; @@ -598,9 +670,11 @@ nav { text-decoration: none; list-style-type: none; font-size: 1.4rem; + li { padding: 1rem; } + a { text-decoration: none; color: #46f; @@ -611,22 +685,104 @@ nav { background-repeat: no-repeat; transition: 0.3s ease-in-out; } + a:hover { opacity: 70%; background-size: 100% 0.2em; } + .title { font-size: 1.6rem; } } + .subdiv { padding: 1rem; } + .long-br { display: block; height: 2rem; } -@media screen and (width >= 1180px) and (width<=1690px) { + + +.contact-email { + + .inputbox { + outline: none; + height: 3rem; + width: 100%; + display: block; + background: #EFEFEF; + color: black; + border: 0px solid #505050; + border-radius: 5px; + transition: 0.3s; + margin-top: 0.5rem; + } + + :not(textarea) { + text-align: center; + } + + .inputbox:hover { + background: #DEDEDE; + } + + .inputbox:focus { + background: #CECECE; + } + + button { + width: 100%; + height: 3rem; + border-radius: 5px; + text-align: center; + } + + .formbutton { + background: #272727; + color: #fff; + border: 0px; + transition-duration: 300ms; + cursor: pointer; + } + + .formbutton:hover { + background: #727272; + } + + .form { + border-radius: 5px; + align-items: center; + justify-content: center; + margin: auto; + padding: 4rem 2.5rem; + width: 65%; + background: #FDFDFD; + box-shadow: rgba(50, 50, 50, 0.1) 0px 4px 12px; + } + + .error_box { + background: #FFEEEE; + border-radius: 5px; + + margin: auto; + align-items: center; + justify-content: center; + text-align: center; + padding: 1rem 1rem; + margin-bottom: 1.5rem; + } +} + +textarea, textfield { + padding: 5px; + font-size: 0.95rem; +} + + +@media screen and (width >=1180px) and (width<=1690px) { /*if(width<1620px&&width>=1125px)*/ nav { @@ -635,6 +791,7 @@ nav { position: relative; width: 17.5rem; padding: 0rem 0rem; + a { transition: 0.2s; display: flex; @@ -642,33 +799,40 @@ nav { border-radius: 7px; margin: 0.3rem 0; } + a:hover { background-color: #ddd; } + strong { margin-left: auto; margin-right: auto; align-content: center; } + p { margin: 0.5rem 0; } } + .dropdown-menu { display: none; } } + .menu, .dropdown-open.dropdown, .dropdown-open.dropdown-social { opacity: 1; display: initial; } + .social, .dropdown-open.dropdown-menu { opacity: 0; display: none; } + .burger { display: block; } @@ -680,11 +844,13 @@ nav { nav { font-size: 1.4rem; + ul { img { height: 2.5rem; } } + .social { font-size: 2rem; } @@ -693,19 +859,24 @@ nav { height: 100px; width: 100px; } + .dropdown { + .dropdown-social, .dropdown-menu { position: relative; } + .dropdown-menu { width: 18rem; padding: 0rem 0rem; } + .dropdown-social { display: flex; flex-wrap: wrap; } + .dropdown-menu p, .dropdown-social a { transition: 0.2s; @@ -713,6 +884,7 @@ nav { border-radius: 7px; margin: 0.3rem 0; } + .dropdown-menu p:hover { background-color: #ddd; } @@ -720,31 +892,37 @@ nav { .dropdown-social a:hover { opacity: 50%; } + hr { margin: 0.75rem 0rem; padding: 1rem; border: 1px solid #aaa; } } + .social-name { display: none; } + .social, .menu-item { display: none; } + .dropdown-open { transition: 0.3s; opacity: 1; display: initial; + .dropdown, .dropdown-social, .downdown-menu { display: initial; } } + .burger { display: block; } } -} +} \ No newline at end of file diff --git a/contacts/index.html b/contacts/index.html index 352e368..e8e1b10 100644 --- a/contacts/index.html +++ b/contacts/index.html @@ -200,6 +200,12 @@ I write/make/produce EDM music(DTM), and for every releases I'll post my music o
  • Email

    + info@t404null.com +
    + request@t404null.com +
    + t404.null@t404null.com +

    Or:
    t404.null@gmail.com
    t404owo@gmail.com @@ -221,6 +227,9 @@ I write/make/produce EDM music(DTM), and for every releases I'll post my music o

    • +

    + (Or) Contact me here +

    @@ -233,7 +242,7 @@ I write/make/produce EDM music(DTM), and for every releases I'll post my music o
    - +

    diff --git a/song_usage_terms/index.html b/song_usage_terms/index.html index f93c6cf..633947f 100644 --- a/song_usage_terms/index.html +++ b/song_usage_terms/index.html @@ -205,7 +205,7 @@ 1.) In the case if you want to use my song(s) / track(s) as a corporation / a company material
    If you wish to use my song as a corporation / a company material, no matter how you use it, please contact me and get confirmation at one of the following email address(es):
    request@t404null.com -

    +
    Or:
    t404.null@gmail.com @@ -220,7 +220,7 @@ 1.1.) In the case if you want to use my song(s) / track(s) as an educational institution or a volunteer organization / a company for volunteer
    You are allowed use my songs as well as individuals.
    If you can, it would be (very) helpful for me if you could confirm it once in the following email adress(es):
    info@t404null.com -

    +
    Or:
    t404.null@gmail.com @@ -265,7 +265,7 @@ 3.2.) If you want to distribute the music as an official chart / official music for a rhythm game (in short, if you're a developer/offical charter/owner of that game) or if you want to use my song/track as a BGM that is included for a program / a game or its directory
    Please contact me at one of the following email address(es):
    request@t404null.com -

    +
    Or:
    t404.null@gmail.com @@ -281,7 +281,7 @@ 3.3.) If you want to repost my song
    Please contact me at one of the following email address(es):
    request@t404null.com -

    +
    Or:
    t404.null@gmail.com @@ -296,7 +296,7 @@ 4.) Other Uses
    Please contact me at one of the following email address(es):
    info@t404null.com -

    +
    Or:
    t404.null@gmail.com From 0a0310b4104d524404f4ae1615f8ac50141f1530 Mon Sep 17 00:00:00 2001 From: t404owo Date: Fri, 17 Oct 2025 00:52:43 +0000 Subject: [PATCH 14/15] fixed X icons thingy... --- contacts/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/contacts/index.html b/contacts/index.html index e8e1b10..7414ce2 100644 --- a/contacts/index.html +++ b/contacts/index.html @@ -221,7 +221,7 @@ I write/make/produce EDM music(DTM), and for every releases I'll post my music o
  • - 𝕏 X / Twitter + X / Twitter

    @t404_null
    • From b0709aa77eaf69fbea482d297965ae8a0a739f1c Mon Sep 17 00:00:00 2001 From: t404owo Date: Fri, 17 Oct 2025 00:56:29 +0000 Subject: [PATCH 15/15] old.css updated --- assets/css/main.css | 9 +- assets/css/old.css | 204 ++++++++++++++++++++++++++++++++++++++++++-- 2 files changed, 203 insertions(+), 10 deletions(-) diff --git a/assets/css/main.css b/assets/css/main.css index dc5c7b3..5d7c31c 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -8,11 +8,13 @@ body { height: 100%; } -main, textarea, textfield { +main, +textarea, +textfield { font-family: Jost, "Noto Sans Japanese", sans-serif, --apple-system; } -main { +main { margin: 0.75rem; height: 100%; margin-bottom: 0; @@ -776,7 +778,8 @@ nav { } } -textarea, textfield { +textarea, +textfield { padding: 5px; font-size: 0.95rem; } diff --git a/assets/css/old.css b/assets/css/old.css index 458eb63..8dc5c1d 100644 --- a/assets/css/old.css +++ b/assets/css/old.css @@ -1,25 +1,35 @@ @import url("/assets/css/fonts/jost.css"); @import url("/assets/css/fonts/noto-sans-jp.css"); @import url("/assets/css/fonts/plus-jarkata-sans.css"); + body { margin: 0px; height: 100%; } -main { + +main, +textarea, +textfield { font-family: Jost, "Noto Sans Japanese", sans-serif, --apple-system; +} + +main { margin: 0.75rem; height: 100%; margin-bottom: 0; margin-top: 0; min-height: calc(100vh - 10vh); } + .main-page { max-width: 2300px; margin: 0 auto; } + hr { margin: 2rem 0px; } + nav { z-index: 4; position: -webkit-sticky; @@ -28,8 +38,7 @@ nav { */ top: 10px; background-color: #f5f5f5; - font-family: "Plus Jakarta Sans", "Noto Sans Japanese", sans-serif, - --apple-system; + font-family: "Plus Jakarta Sans", "Noto Sans Japanese", sans-serif, --apple-system; font-size: 1.25rem; padding: 4px; margin: 10px; @@ -39,28 +48,33 @@ nav { display: grid; grid-template-columns: auto 1fr auto; } + nav ul { padding-left: 15px; list-style-type: none; margin: 0px; align-content: center; } + nav ul li { display: inline-block; padding-right: 4px; vertical-align: middle; } + nav ul li p { padding-top: 0.4rem; vertical-align: middle; margin: 0.5rem 1rem; } + nav ul img { margin-top: 0.25rem; height: 1.5rem; vertical-align: middle; padding-right: 0.3rem; } + nav a { color: black; text-decoration: none; @@ -71,19 +85,23 @@ nav a { -ms-user-select: none; user-select: none; } + nav .vertical-line { width: 0.1rem; background-color: black; height: 100%; } + nav .social { font-size: 2.5rem; padding-bottom: 0.4rem; transition: 0.3s; } + nav .social:hover { opacity: 50%; } + nav .dropdown { margin: 0.75rem; position: absolute; @@ -97,6 +115,7 @@ nav .dropdown { opacity: 0; transition: 0.3s; } + .footer { font-family: Jost, "Plus Jakarta Sans", "Noto Sans Japanese", sans-serif; position: sticky; @@ -114,11 +133,13 @@ nav .dropdown { text-align: center; align-content: center; } + /*---nav---*/ .menu { padding-top: 0.4rem; padding-bottom: 0.8rem; } + .menu p { background-size: 0% 0.2em; background-image: linear-gradient(#000, #000); @@ -127,11 +148,13 @@ nav .dropdown { background-repeat: no-repeat; transition: 0.3s ease-in-out; } + .menu p:hover, .menu .currentpage { opacity: 60%; background-size: 100% 0.2em; } + .burger { border: none; display: none; @@ -145,6 +168,7 @@ nav .dropdown { border-radius: 12px; transition: 0.2s ease-in-out; } + .burger span { transition: 0.2s ease-in-out; box-sizing: border-box; @@ -152,6 +176,7 @@ nav .dropdown { background-color: #000; border-radius: 2px; } + .burger #hamburger { position: absolute; height: 100%; @@ -159,6 +184,7 @@ nav .dropdown { top: 0%; left: 0%; } + .burger #hamburger span { width: 70%; height: 5%; @@ -167,15 +193,19 @@ nav .dropdown { position: relative; margin: 12% 0; } + .burger #hamburger span:nth-child(1) { transition-delay: 0.2s; } + .burger #hamburger span:nth-child(2) { transition-delay: 0.3s; } + .burger #hamburger span:nth-child(3) { transition-delay: 0.4s; } + .burger #cross { position: absolute; height: 100%; @@ -184,6 +214,7 @@ nav .dropdown { left: 1.5%; transform: rotate(45deg); } + .burger #cross span:nth-child(1) { height: 0%; width: 5%; @@ -194,6 +225,7 @@ nav .dropdown { transform: translate(-50%); transition-delay: 0s; } + .burger #cross span:nth-child(2) { width: 0%; height: 5%; @@ -202,34 +234,43 @@ nav .dropdown { top: 48%; transition-delay: 0s; } + .burger:hover { opacity: 40%; } + .burger.open #hamburger span { width: 0%; } + .burger.open #hamburger span:nth-child(1) { transition-delay: 0s; } + .burger.open #hamburger span:nth-child(2) { transition-delay: 0.1s; } + .burger.open #hamburger span:nth-child(3) { transition-delay: 0.2s; } + .burger.open #cross span:nth-child(1) { height: 80%; transition-delay: 0.3s; } + .burger.open #cross span:nth-child(2) { width: 80%; transition-delay: 0.3s; } + .dropdown { display: none; overflow: auto; max-height: 70vh; } + /*---- main ----*/ .container { position: relative; @@ -238,6 +279,7 @@ nav .dropdown { margin: auto; margin-top: 1rem; } + .carousel { z-index: 1; width: 100%; @@ -247,6 +289,7 @@ nav .dropdown { position: relative; overflow: hidden; } + .slider-bg { height: 100%; width: 100%; @@ -267,6 +310,7 @@ nav .dropdown { border-radius: 0.5rem; transform: scale(1.1); } + .slider section { overflow: hidden; z-index: 1; @@ -279,9 +323,9 @@ nav .dropdown { width: 100%; height: 100%; border-radius: 0.5rem; - font-family: "Plus Jakarta Sans", "Noto Sans Japanese", sans-serif, - --apple-system; + font-family: "Plus Jakarta Sans", "Noto Sans Japanese", sans-serif, --apple-system; } + .slider section div { color: #fff; position: relative; @@ -292,16 +336,19 @@ nav .dropdown { grid-template-rows: 3.5fr 1fr 1fr 5rem; grid-template-columns: 1fr auto 1fr; } + .slider section h1 { font-size: 2rem; grid-row-start: 2; grid-row-end: 3; } + .slider section p { font-size: 1.25rem; grid-row-start: 3; grid-row-end: 4; } + .slider section p, .slider section h1 { width: 60vw; @@ -310,9 +357,11 @@ nav .dropdown { /*|•|*/ grid-column-end: 3; } + .slider:hover { cursor: pointer; } + .prev, .next { background-color: rgba(0, 0, 0, 0.3); @@ -334,12 +383,15 @@ nav .dropdown { -ms-user-select: none; user-select: none; } + .next { right: 1rem; } + .prev { left: 1rem; } + .pgctrl { font-family: sans-serif, --apple-system; z-index: 1; @@ -366,9 +418,11 @@ nav .dropdown { -ms-user-select: none; user-select: none; } + .control { text-align: center; } + /* Cards */ .album-cards { margin: auto; @@ -379,6 +433,7 @@ nav .dropdown { grid-template-columns: repeat(auto-fill, 23rem); grid-gap: 1rem; } + .album-cards .card { transition: 0.75s; color: black; @@ -387,6 +442,7 @@ nav .dropdown { border-radius: 7px; text-decoration: none; } + .album-cards .card div { z-index: 1; position: inherit; @@ -396,12 +452,15 @@ nav .dropdown { border-radius: 7px; transition: 0.5s; } + .album-cards .card h2 { font-size: 1.9rem; } + .album-cards .card p { font-size: 1.2rem; } + .album-cards .card h2, .album-cards .card p { color: white; @@ -411,6 +470,7 @@ nav .dropdown { opacity: 0; transition: 0.5s; } + .album-cards .card .bg-img { /* background: url(/assets/img/t404_null-logo.png); */ @@ -419,15 +479,18 @@ nav .dropdown { height: 23rem; width: 23rem; } + .album-cards .card:hover .bg-img { filter: blur(5px) brightness(50%); -webkit-filter: blur(5px) brightness(50%); } + .album-cards .card:hover h2, .album-cards .card:hover p { filter: none; opacity: 1; } + .half-image-cards { margin: auto; margin-bottom: 2.5rem; @@ -437,6 +500,7 @@ nav .dropdown { grid-template-columns: repeat(auto-fill, minmax(23rem, 60rem)); grid-gap: 1rem; } + .half-image-cards .card { transition: 0.75s; color: black; @@ -445,6 +509,7 @@ nav .dropdown { border-radius: 7px; text-decoration: none; } + .half-image-cards .card div { z-index: 1; position: inherit; @@ -454,12 +519,15 @@ nav .dropdown { border-radius: 7px; transition: 0.5s; } + .half-image-cards .card h2 { font-size: 1.9rem; } + .half-image-cards .card p { font-size: 1.1rem; } + .half-image-cards .card h2, .half-image-cards .card p { /* color: black; @@ -470,6 +538,7 @@ nav .dropdown { opacity: 0; transition: 0.5s; } + .half-image-cards .card .bg-img { /* background: url(/assets/img/t404_null-logo.png); */ @@ -479,18 +548,21 @@ nav .dropdown { height: 30rem; width: 30rem; } + .half-image-cards .card:hover .bg-img { filter: brightness(40%); -webkit-filter: brightness(40%); width: 8vw; border-radius: 7px 0px 0px 7px; } + .half-image-cards .card:hover h2, .half-image-cards .card:hover p { padding: 0.3rem 5vw 0.3rem 10vw; filter: none; opacity: 1; } + .contact-cards { display: grid; grid-template-columns: repeat(auto-fill, 23rem); @@ -498,16 +570,19 @@ nav .dropdown { justify-content: center; padding: 0; } + .contact-cards li { border-radius: 7px; background-color: #ddd; } + .topic { padding: 1rem; font-size: 3rem; margin-top: 3vw; margin-bottom: 7vw; } + .topic a { text-decoration: none; color: black; @@ -518,22 +593,27 @@ nav .dropdown { background-repeat: no-repeat; transition: 0.3s ease-in-out; } + .topic a:hover { opacity: 70%; background-size: 100% 0.2em; } + /* overall */ .icons { font-size: 2.25rem; font-weight: 500; } + @font-face { font-family: "NerdFontsSymbols Nerd Font"; src: url("/assets/fonts/nf-symbols.woff2") format("woff2"); } + .nf-icons { font-family: "NerdFontsSymbols Nerd Font"; } + /* Releases */ .release-track { background-size: cover; @@ -544,9 +624,11 @@ nav .dropdown { border-radius: 10px; border: 1px solid #ddd; } + .release-track strong { color: #fff; } + .release-track .text-box { max-width: 1250px; margin: 25% auto; @@ -557,6 +639,7 @@ nav .dropdown { border-radius: 7px; font-size: 1.2rem; } + .release-track .text-box a { text-decoration: none; color: #fff; @@ -567,19 +650,23 @@ nav .dropdown { background-repeat: no-repeat; transition: 0.3s ease-in-out; } + .release-track .text-box a:hover { color: #ccc; background-size: 100% 0.2em; } + /* info */ .info { text-decoration: none; list-style-type: none; font-size: 1.4rem; } + .info li { padding: 1rem; } + .info a { text-decoration: none; color: #46f; @@ -590,27 +677,106 @@ nav .dropdown { background-repeat: no-repeat; transition: 0.3s ease-in-out; } + .info a:hover { opacity: 70%; background-size: 100% 0.2em; } + .info .title { font-size: 1.6rem; } + .subdiv { padding: 1rem; } + .long-br { display: block; height: 2rem; } -@media screen and (width >= 1180px) and (width<=1690px) { + +.contact-email .inputbox { + outline: none; + height: 3rem; + width: 100%; + display: block; + background: #efefef; + color: black; + border: 0px solid #505050; + border-radius: 5px; + transition: 0.3s; + margin-top: 0.5rem; +} + +.contact-email :not(textarea) { + text-align: center; +} + +.contact-email .inputbox:hover { + background: #dedede; +} + +.contact-email .inputbox:focus { + background: #cecece; +} + +.contact-email button { + width: 100%; + height: 3rem; + border-radius: 5px; + text-align: center; +} + +.contact-email .formbutton { + background: #272727; + color: #fff; + border: 0px; + transition-duration: 300ms; + cursor: pointer; +} + +.contact-email .formbutton:hover { + background: #727272; +} + +.contact-email .form { + border-radius: 5px; + align-items: center; + justify-content: center; + margin: auto; + padding: 4rem 2.5rem; + width: 65%; + background: #fdfdfd; + box-shadow: rgba(50, 50, 50, 0.1) 0px 4px 12px; +} + +.contact-email .error_box { + background: #fee; + border-radius: 5px; + margin: auto; + align-items: center; + justify-content: center; + text-align: center; + padding: 1rem 1rem; + margin-bottom: 1.5rem; +} + +textarea, +textfield { + padding: 5px; + font-size: 0.95rem; +} + +@media screen and (width >=1180px) and (width<=1690px) { + /*if(width<1620px&&width>=1125px)*/ nav .dropdown .dropdown-social { position: relative; width: 17.5rem; padding: 0rem 0rem; } + nav .dropdown .dropdown-social a { transition: 0.2s; display: flex; @@ -618,62 +784,78 @@ nav .dropdown { border-radius: 7px; margin: 0.3rem 0; } + nav .dropdown .dropdown-social a:hover { background-color: #ddd; } + nav .dropdown .dropdown-social strong { margin-left: auto; margin-right: auto; align-content: center; } + nav .dropdown .dropdown-social p { margin: 0.5rem 0; } + nav .dropdown .dropdown-menu { display: none; } + nav .menu, nav .dropdown-open.dropdown, nav .dropdown-open.dropdown-social { opacity: 1; display: initial; } + nav .social, nav .dropdown-open.dropdown-menu { opacity: 0; display: none; } + nav .burger { display: block; } } + @media screen and (width<1180px) { + /*if(width<1125px)*/ nav { font-size: 1.4rem; } + nav ul img { height: 2.5rem; } + nav .social { font-size: 2rem; } + nav .burger { height: 100px; width: 100px; } + nav .dropdown .dropdown-social, nav .dropdown .dropdown-menu { position: relative; } + nav .dropdown .dropdown-menu { width: 18rem; padding: 0rem 0rem; } + nav .dropdown .dropdown-social { display: flex; flex-wrap: wrap; } + nav .dropdown .dropdown-menu p, nav .dropdown .dropdown-social a { transition: 0.2s; @@ -681,35 +863,43 @@ nav .dropdown { border-radius: 7px; margin: 0.3rem 0; } + nav .dropdown .dropdown-menu p:hover { background-color: #ddd; } + nav .dropdown .dropdown-social a:hover { opacity: 50%; } + nav .dropdown hr { margin: 0.75rem 0rem; padding: 1rem; border: 1px solid #aaa; } + nav .social-name { display: none; } + nav .social, nav .menu-item { display: none; } + nav .dropdown-open { transition: 0.3s; opacity: 1; display: initial; } + nav .dropdown-open .dropdown, nav .dropdown-open .dropdown-social, nav .dropdown-open .downdown-menu { display: initial; } + nav .burger { display: block; } -} +} \ No newline at end of file