mirror of
https://github.com/liyunze-coding/RythonDev.git
synced 2026-09-22 15:53:57 +00:00
removed borders
This commit is contained in:
liyunze
parent
8dd3662cec
commit
64463e2c59
3 changed files with 49 additions and 39 deletions
|
|
@ -7,65 +7,66 @@
|
|||
<input type="checkbox" aria-label="Toggle menu" />
|
||||
<span class="bottom-bun"></span>
|
||||
</label>
|
||||
<aside class="sidebar flex z-20 border-l border-white">
|
||||
<aside class="sidebar flex z-20">
|
||||
<nav class="flex flex-col capitalize" role="navigation">
|
||||
<a
|
||||
class="sidebar-url px-5 py-2 mt-10 text-center rounded-md hover:text-gray-600 hover:bg-gray-100 transition-colors duration-500"
|
||||
class="sidebar-url px-5 py-2 mt-10 text-center rounded-md hover:text-gray-600 hover:bg-gray-100 transition-colors duration-300"
|
||||
href="#home">Home</a
|
||||
>
|
||||
<a
|
||||
class="sidebar-url px-5 py-2 mt-2 text-center rounded-md hover:text-gray-600 hover:bg-gray-100 transition-colors duration-500"
|
||||
class="sidebar-url px-5 py-2 mt-2 text-center rounded-md hover:text-gray-600 hover:bg-gray-100 transition-colors duration-300"
|
||||
href="#what-i-do">What I Do</a
|
||||
>
|
||||
<a
|
||||
class="sidebar-url px-5 py-2 mt-2 text-center rounded-md hover:text-gray-600 hover:bg-gray-100 transition-colors duration-500"
|
||||
class="sidebar-url px-5 py-2 mt-2 text-center rounded-md hover:text-gray-600 hover:bg-gray-100 transition-colors duration-300"
|
||||
href="#projects">Projects</a
|
||||
>
|
||||
<a
|
||||
class="sidebar-url px-5 py-2 mt-2 text-center rounded-md hover:text-gray-600 hover:bg-gray-100 transition-colors duration-500"
|
||||
class="sidebar-url px-5 py-2 mt-2 text-center rounded-md hover:text-gray-600 hover:bg-gray-100 transition-colors duration-300"
|
||||
href="#skills">Skills</a
|
||||
>
|
||||
<a
|
||||
class="sidebar-url px-5 py-2 mt-2 text-center rounded-md hover:text-gray-600 hover:bg-gray-100 transition-colors duration-500"
|
||||
class="sidebar-url px-5 py-2 mt-2 text-center rounded-md hover:text-gray-600 hover:bg-gray-100 transition-colors duration-300"
|
||||
href="#education">Education</a
|
||||
>
|
||||
<a
|
||||
class="sidebar-url px-5 py-2 mt-2 text-center rounded-md hover:text-gray-600 hover:bg-gray-100 transition-colors duration-500"
|
||||
class="sidebar-url px-5 py-2 mt-2 text-center rounded-md hover:text-gray-600 hover:bg-gray-100 transition-colors duration-300"
|
||||
href="#contact">Contact</a
|
||||
>
|
||||
</nav>
|
||||
</aside>
|
||||
<div
|
||||
id="navbar"
|
||||
class="fixed z-50 top-0 w-full hidden md:flex justify-center bg-[#202020] border-b border-solid border-white"
|
||||
class="fixed z-50 top-0 w-full hidden md:flex justify-center
|
||||
bg-[linear-gradient(180deg,_rgba(32,32,32,1)_70%,_rgba(32,32,32,0)_100%)]"
|
||||
>
|
||||
<div
|
||||
id="navbar-div"
|
||||
class="py-4 uppercase w-full flex flex-row justify-center items-center"
|
||||
>
|
||||
<a
|
||||
class="px-3 mx-2 py-1 text-white hover:bg-gray-200 hover:text-black transition-colors duration-500 rounded-md"
|
||||
class="px-3 mx-2 py-1 text-white hover:bg-gray-200 hover:text-black transition-colors duration-300 rounded-md"
|
||||
href="#home">home</a
|
||||
>
|
||||
<a
|
||||
class="px-3 mx-2 py-1 text-white hover:bg-gray-200 hover:text-black transition-colors duration-500 rounded-md"
|
||||
class="px-3 mx-2 py-1 text-white hover:bg-gray-200 hover:text-black transition-colors duration-300 rounded-md"
|
||||
href="#what-i-do">What I Do</a
|
||||
>
|
||||
|
||||
<a
|
||||
class="px-3 mx-2 py-1 text-white hover:bg-gray-200 hover:text-black transition-colors duration-500 rounded-md"
|
||||
class="px-3 mx-2 py-1 text-white hover:bg-gray-200 hover:text-black transition-colors duration-300 rounded-md"
|
||||
href="#projects">projects</a
|
||||
>
|
||||
<a
|
||||
class="px-3 mx-2 py-1 text-white hover:bg-gray-200 hover:text-black transition-colors duration-500 rounded-md"
|
||||
class="px-3 mx-2 py-1 text-white hover:bg-gray-200 hover:text-black transition-colors duration-300 rounded-md"
|
||||
href="#skills">skills</a
|
||||
>
|
||||
<a
|
||||
class="px-3 mx-2 py-1 text-white hover:bg-gray-200 hover:text-black transition-colors duration-500 rounded-md"
|
||||
class="px-3 mx-2 py-1 text-white hover:bg-gray-200 hover:text-black transition-colors duration-300 rounded-md"
|
||||
href="#education">education</a
|
||||
>
|
||||
<a
|
||||
class="px-3 mx-2 py-1 text-white hover:bg-gray-200 hover:text-black transition-colors duration-500 rounded-md"
|
||||
class="px-3 mx-2 py-1 text-white hover:bg-gray-200 hover:text-black transition-colors duration-300 rounded-md"
|
||||
href="#contact">contact</a
|
||||
>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -268,7 +268,10 @@
|
|||
target="_blank"
|
||||
class="absolute [transform:translateX(-50%)_translateY(-50%)] top-1/2 left-1/2
|
||||
px-5 py-3 bg-blue-500 rounded-xl opacity-1
|
||||
font-bold">Visit site</a
|
||||
font-bold
|
||||
transition-colors duration-300
|
||||
hover:bg-white hover:text-blue-500
|
||||
">Visit site</a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -406,7 +409,10 @@
|
|||
target="_blank"
|
||||
class="absolute [transform:translateX(-50%)_translateY(-50%)] top-1/2 left-1/2
|
||||
px-5 py-3 bg-blue-500 rounded-xl opacity-1
|
||||
font-bold">View repository</a
|
||||
font-bold
|
||||
transition-colors duration-300
|
||||
hover:bg-white hover:text-blue-500
|
||||
">View repository</a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -448,7 +454,10 @@
|
|||
target="_blank"
|
||||
class="absolute [transform:translateX(-50%)_translateY(-50%)] top-1/2 left-1/2
|
||||
px-5 py-3 bg-blue-500 rounded-xl opacity-1
|
||||
font-bold">Visit site</a
|
||||
font-bold
|
||||
transition-colors duration-300
|
||||
hover:bg-white hover:text-blue-500
|
||||
">Visit site</a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -24,84 +24,84 @@ import Line from "../components/NetworkLine.astro";
|
|||
<div
|
||||
class="w-fit text-white bg-gray-500 hover:bg-orange-700
|
||||
rounded-full px-3 py-1 mr-1 my-1
|
||||
transition-colors duration-500"
|
||||
transition-colors duration-300"
|
||||
>
|
||||
HTML
|
||||
</div>
|
||||
<div
|
||||
class="w-fit text-white bg-gray-500 hover:bg-blue-700
|
||||
rounded-full px-3 py-1 mr-1 my-1
|
||||
transition-colors duration-500"
|
||||
transition-colors duration-300"
|
||||
>
|
||||
CSS
|
||||
</div>
|
||||
<div
|
||||
class="w-fit text-white bg-gray-500 hover:bg-yellow-400 hover:text-black
|
||||
rounded-full px-3 py-1 mr-1 my-1
|
||||
transition-colors duration-500"
|
||||
transition-colors duration-300"
|
||||
>
|
||||
Javascript
|
||||
</div>
|
||||
<div
|
||||
class="w-fit text-white bg-gray-500 hover:bg-blue-400 hover:text-black
|
||||
rounded-full px-3 py-1 mr-1 my-1
|
||||
transition-colors duration-500"
|
||||
transition-colors duration-300"
|
||||
>
|
||||
TypeScript
|
||||
</div>
|
||||
<div
|
||||
class="w-fit text-white bg-gray-500 hover:bg-[#617CBE]
|
||||
rounded-full px-3 py-1 mr-1 my-1
|
||||
transition-colors duration-500"
|
||||
transition-colors duration-300"
|
||||
>
|
||||
PHP
|
||||
</div>
|
||||
<div
|
||||
class="w-fit text-white bg-gray-500 hover:bg-yellow-500 hover:text-black
|
||||
rounded-full px-3 py-1 mr-1 my-1
|
||||
transition-colors duration-500"
|
||||
transition-colors duration-300"
|
||||
>
|
||||
Express
|
||||
</div>
|
||||
<div
|
||||
class="w-fit text-white bg-gray-500 hover:bg-orange-500
|
||||
rounded-full px-3 py-1 mr-1 my-1
|
||||
transition-colors duration-500"
|
||||
transition-colors duration-300"
|
||||
>
|
||||
Svelte
|
||||
</div>
|
||||
<div
|
||||
class="w-fit text-white bg-gray-500 hover:bg-[#00D8FF] hover:text-black
|
||||
rounded-full px-3 py-1 mr-1 my-1
|
||||
transition-colors duration-500"
|
||||
transition-colors duration-300"
|
||||
>
|
||||
React
|
||||
</div>
|
||||
<div
|
||||
class="w-fit text-white bg-gray-500 hover:bg-white hover:text-black
|
||||
rounded-full px-3 py-1 mr-1 my-1
|
||||
transition-colors duration-500"
|
||||
transition-colors duration-300"
|
||||
>
|
||||
Astro
|
||||
</div>
|
||||
<div
|
||||
class="w-fit text-white bg-gray-500 hover:bg-purple-400 hover:text-black
|
||||
rounded-full px-3 py-1 mr-1 my-1
|
||||
transition-colors duration-500"
|
||||
transition-colors duration-300"
|
||||
>
|
||||
Qwik
|
||||
</div>
|
||||
<div
|
||||
class="w-fit text-white bg-gray-500 hover:bg-[#07B6D4] hover:text-black
|
||||
rounded-full px-3 py-1 mr-1 my-1
|
||||
transition-colors duration-500"
|
||||
transition-colors duration-300"
|
||||
>
|
||||
TailwindCSS
|
||||
</div>
|
||||
<div
|
||||
class="w-fit text-white bg-gray-500 hover:bg-[#8500C7]
|
||||
rounded-full px-3 py-1 mr-1 my-1
|
||||
transition-colors duration-500"
|
||||
transition-colors duration-300"
|
||||
>
|
||||
Vite
|
||||
</div>
|
||||
|
|
@ -126,58 +126,58 @@ import Line from "../components/NetworkLine.astro";
|
|||
</p>
|
||||
<div class="w-full flex flex-row flex-wrap justify-start">
|
||||
<div
|
||||
class="w-fit text-white bg-gray-500 hover:text-black hover:bg-[linear-gradient(_125deg,_#4b8bbe_0%,_#4b8bbe_50%,_#ffd43b_51%,_#f0c808_100%_)]
|
||||
class="w-fit text-white bg-gray-500 hover:text-white hover:bg-blue-700
|
||||
rounded-full px-3 py-1 mr-1 my-1
|
||||
transition-colors duration-500"
|
||||
transition-colors duration-300"
|
||||
>
|
||||
Python
|
||||
</div>
|
||||
<div
|
||||
class="w-fit text-white bg-gray-500 hover:bg-cyan-500
|
||||
rounded-full px-3 py-1 mr-1 my-1
|
||||
transition-colors duration-500"
|
||||
transition-colors duration-300"
|
||||
>
|
||||
R
|
||||
</div>
|
||||
<div
|
||||
class="w-fit text-white bg-gray-500 hover:bg-green-600 hover:bg-[linear-gradient(_90deg,_#BB0000_0%,_#BB0000_32%,_#00AA00_33%,_#00AA00_65%,_#0000BB_66%,_#0000BB_100%_)]
|
||||
class="w-fit text-white bg-gray-500 hover:bg-green-600
|
||||
rounded-full px-3 py-1 mr-1 my-1
|
||||
transition-colors duration-500"
|
||||
transition-colors duration-300"
|
||||
>
|
||||
OpenCV
|
||||
</div>
|
||||
<div
|
||||
class="w-fit text-white bg-gray-500 hover:bg-blue-500 hover:text-black
|
||||
rounded-full px-3 py-1 mr-1 my-1
|
||||
transition-colors duration-500"
|
||||
transition-colors duration-300"
|
||||
>
|
||||
SAS
|
||||
</div>
|
||||
<div
|
||||
class="w-fit text-white bg-gray-500 hover:bg-orange-700
|
||||
rounded-full px-3 py-1 mr-1 my-1
|
||||
transition-colors duration-500"
|
||||
transition-colors duration-300"
|
||||
>
|
||||
MySQL
|
||||
</div>
|
||||
<div
|
||||
class="w-fit text-white bg-gray-500 hover:bg-blue-800
|
||||
rounded-full px-3 py-1 mr-1 my-1
|
||||
transition-colors duration-500"
|
||||
transition-colors duration-300"
|
||||
>
|
||||
Pandas
|
||||
</div>
|
||||
<div
|
||||
class="w-fit text-white bg-gray-500 hover:bg-green-700
|
||||
rounded-full px-3 py-1 mr-1 my-1
|
||||
transition-colors duration-500"
|
||||
transition-colors duration-300"
|
||||
>
|
||||
Selenium
|
||||
</div>
|
||||
<div
|
||||
class="w-fit text-white bg-gray-500 hover:bg-gray-200 hover:text-black
|
||||
rounded-full px-3 py-1 mr-1 my-1
|
||||
transition-colors duration-500"
|
||||
transition-colors duration-300"
|
||||
>
|
||||
BeautifulSoup4
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in a new issue