Snigdha-OS/Snigdha-OS.github.io
2
0
Fork 0
mirror of https://github.com/Snigdha-OS/Snigdha-OS.github.io.git synced 2025-09-06 04:35:18 +02:00
Code Issues Actions Packages Projects Releases Wiki Activity

🎨 style(css): color deep from coral

Browse Source 
Signed-off-by: Abhiraj Roy <157954129+iconized@users.noreply.github.com>
This commit is contained in:
Abhiraj Roy
2024-06-05 14:32:27 +05:30
parent 1aae6b0d81
commit 2f84f95da2
7 changed files with 40 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
components/AppFooter.vue
View File

@@ -41,7 +41,7 @@ footer a:hover {
} }
#social-icons > a { #social-icons > a {
border-right: 1px solid #1E2D3D; border-right: 0px solid #1E2D3D;
height: 100%; height: 100%;
width: 50px; width: 50px;
} }
@@ -61,6 +61,7 @@ footer > a > img {
#social-icons > a:hover img { #social-icons > a:hover img {
opacity: 1; opacity: 1;
color: #FF416C;
} }
@media (max-width: 768px) { @media (max-width: 768px) {

12
components/AppHeader.vue
View File

@@ -8,24 +8,24 @@
</NuxtLink> </NuxtLink>
<NuxtLink id="nav-link" to="/" :class="{ active: isActive('/') }"> <NuxtLink id="nav-link" to="/" :class="{ active: isActive('/') }">
_hello _hello.py
</NuxtLink> </NuxtLink>
<NuxtLink id="nav-link" to="/about-me" :class="{ active: isActive('/about-me') }"> <NuxtLink id="nav-link" to="/about-me" :class="{ active: isActive('/about-me') }">
_about _about.py
</NuxtLink> </NuxtLink>
<NuxtLink id="nav-link" to="/projects" :class="{ active: isActive('/projects') }"> <NuxtLink id="nav-link" to="/projects" :class="{ active: isActive('/projects') }">
_projects _projects.py
</NuxtLink> </NuxtLink>
<NuxtLink id="nav-link" to="https://forum.snigdhaos.org" :class="{ active: isActive('') }"> <NuxtLink id="nav-link" to="https://forum.snigdhaos.org" :class="{ active: isActive('') }">
_forum _forum.py
</NuxtLink> </NuxtLink>
</div> </div>
<NuxtLink id="nav-link-contact" to="/contact-me" :class="{ active: isActive('/contact-me')}"> <NuxtLink id="nav-link-contact" to="/contact-me" :class="{ active: isActive('/contact-me')}">
_contact _contact.py
</NuxtLink> </NuxtLink>
</nav> </nav>
@@ -86,7 +86,7 @@ export default {
} }
#nav-link.router-link-active, #nav-link-contact.router-link-active { #nav-link.router-link-active, #nav-link-contact.router-link-active {
border-bottom: 2px solid #FF7F53; border-bottom: 1px solid #FF416C;
color: white; color: white;
} }

6
components/CommentedText.vue
View File

@@ -5,9 +5,9 @@
<!-- line numbers and asteriscs --> <!-- line numbers and asteriscs -->
<div v-for="n in lines" class="grid grid-cols-2 justify-end" :key="n"> <div v-for="n in lines" class="grid grid-cols-2 justify-end" :key="n">
<span class="col-span-1 mr-3">{{ n }}</span> <span class="col-span-1 mr-3">{{ n }}</span>
<div v-if="n == 1" class="col-span-1 flex justify-center">/**</div> <div v-if="n == 1" class="col-span-1 flex justify-center">#</div>
<div class="col-span-1 flex justify-center" v-if="n > 1 && n < lines">*</div> <div class="col-span-1 flex justify-center" v-if="n > 1 && n < lines">#</div>
<div class="col-span-1 flex justify-center pl-2" v-if="n == lines">*/</div> <div class="col-span-1 flex justify-center" v-if="n == lines">#</div>
</div> </div>
</div> </div>

32
components/SnakeGame.vue
View File

@@ -29,8 +29,8 @@
<div> <div>
<div id="instructions" class="font-fira_retina text-sm text-white"> <div id="instructions" class="font-fira_retina text-sm text-white">
<p>// use your keyboard</p> <p># use your keyboard</p>
<p>// arrows to play</p> <p># arrows to play</p>
<div id="buttons" class="w-full flex flex-col items-center gap-1 pt-5"> <div id="buttons" class="w-full flex flex-col items-center gap-1 pt-5">
@@ -57,7 +57,7 @@
<!-- score board --> <!-- score board -->
<div id="score-board" class="w-full flex flex-col pl-5"> <div id="score-board" class="w-full flex flex-col pl-5">
<p class="font-fira_retina text-white pt-5">// food left</p> <p class="font-fira_retina text-white pt-5"># food left</p>
<div id="score" class="grid grid-cols-5 gap-5 justify-items-center pt-5 w-fit"> <div id="score" class="grid grid-cols-5 gap-5 justify-items-center pt-5 w-fit">
<div class="food"></div> <div class="food"></div>
@@ -271,9 +271,9 @@
/* Food cell style */ /* Food cell style */
if (j === this.food.x && i === this.food.y) { if (j === this.food.x && i === this.food.y) {
cell.style.backgroundColor = "#43D9AD"; cell.style.backgroundColor = "#FF7F53";
cell.style.borderRadius = "50%"; cell.style.borderRadius = "50%";
cell.style.boxShadow = "0 0 10px #43D9AD"; cell.style.boxShadow = "0 0 10px #FF7F53";
} }
/* Estilo de la serpiente a medida que va crediendo */ /* Estilo de la serpiente a medida que va crediendo */
@@ -282,7 +282,7 @@
); );
if (snakeCell) { if (snakeCell) {
cell.style.backgroundColor = "#43D9AD"; cell.style.backgroundColor = "#FF7F53";
cell.style.opacity = 1 - (this.snake.indexOf(snakeCell) / this.snake.length); cell.style.opacity = 1 - (this.snake.indexOf(snakeCell) / this.snake.length);
cell.classList.add("green"); cell.classList.add("green");
@@ -409,7 +409,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
background: linear-gradient(to bottom, rgba(35, 123, 109, 1), rgba(67, 217, 173, 0.13)); background: linear-gradient(to right, #ff416c, #ff4b2b); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
border-radius: 10px; border-radius: 10px;
padding: 30px; padding: 30px;
position: relative; position: relative;
@@ -419,7 +419,7 @@
#game-screen { #game-screen {
width: 240px; width: 240px;
height: 400px; height: 400px;
border-radius: 10px; border-radius: 0px;
background-color: rgba(1, 22, 39, 0.84); background-color: rgba(1, 22, 39, 0.84);
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
@@ -429,9 +429,9 @@
#start-button { #start-button {
padding-inline: 16px; padding-inline: 16px;
padding-block: 8px; padding-block: 8px;
border-radius: 10px; border-radius: 2px;
border: 1px solid black; border: 1px solid black;
background-color: #FEA55F; background-color: #FF7F53;
color: black; color: black;
cursor: pointer; cursor: pointer;
position: absolute; position: absolute;
@@ -442,7 +442,7 @@
} }
#start-button:hover { #start-button:hover {
background-color: rgb(255, 178, 119); background-color: #ff416c;
} }
#console-menu{ #console-menu{
@@ -461,7 +461,7 @@
#console-button:hover { #console-button:hover {
background-color: #010c15d8; background-color: #010c15d8;
box-shadow: #43D9AD 0 0 10px; box-shadow: #FF7F53 0 0 10px;
} }
#instructions { #instructions {
@@ -471,9 +471,9 @@
} }
.food { .food {
background-color: #43D9AD; background-color: white;
border-radius: 50%; border-radius: 50%;
box-shadow: 0 0 10px #43D9AD; box-shadow: 0 0 10px white;
width: 8px; width: 8px;
height: 8px; height: 8px;
opacity: 0.3; opacity: 0.3;
@@ -482,7 +482,7 @@
#game-over, #congrats { #game-over, #congrats {
position: absolute; position: absolute;
bottom: 12%; bottom: 12%;
color: #43D9AD; color: #FF7F53;
width: 240px; width: 240px;
} }
@@ -555,7 +555,7 @@
#game-over, #congrats { #game-over, #congrats {
position: absolute; position: absolute;
bottom: 10%; bottom: 10%;
color: #43D9AD; color: #FF7F53;
width: 192px; width: 192px;
} }

5
developer.json
View File

@@ -9,7 +9,7 @@
"icon": "icons/info-professional.svg", "icon": "icons/info-professional.svg",
"info": { "info": {
"experience": { "experience": {
"title": "experience", "title": "about",
"description": "<br>Over the past 5 years, Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. <br><br> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur." "description": "<br>Over the past 5 years, Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. <br><br> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur."
}, },
"hard-skills": { "hard-skills": {
@@ -64,8 +64,7 @@
"direct": { "direct": {
"title": "contacts", "title": "contacts",
"sources": { "sources": {
"email": "hello@snigdhaos.org", "email": "hello@snigdhaos.org"
"phone": "N/A"
} }
}, },
"social": { "social": {

17
pages/index.vue
View File

@@ -8,7 +8,7 @@
<section class="hero"> <section class="hero">
<div class="head"> <div class="head">
<span> <span class="mb-12">
<h2>greetings,</h2> <h2>greetings,</h2>
</span> </span>
<h1>{{ config.dev.name }}</h1> <h1>{{ config.dev.name }}</h1>
@@ -24,15 +24,14 @@
or skip to see about "Snigdha OS" --> or skip to see about "Snigdha OS" -->
</span> </span>
<span :class="{hide: isMobile}"> <span :class="{hide: isMobile}">
# source code can be found on <br> # source code can be found on, do follow us on github
# do follow us on github
</span> </span>
<span>#!/usr/bin/python</span> <span>#!/usr/bin/python</span>
<span :class="{hide: !isMobile}"> <span :class="{hide: !isMobile}">
# source code:<br> # source code:<br>
# follow us on github # follow us on github
</span> </span>
<p class="code mb-5"> <p class="code mb-2">
<!-- <span class="identifier"> <!-- <span class="identifier">
const const
</span> --> </span> -->
@@ -53,7 +52,7 @@
<span :class="{hide: !isMobile}"> <span :class="{hide: !isMobile}">
# it is recommended to download the <b>ISO</b> file on PC # it is recommended to download the <b>ISO</b> file on PC
</span> </span>
<p class="code mb-5"> <p class="code">
<!-- <span class="identifier"> <!-- <span class="identifier">
const const
</span> --> </span> -->
@@ -74,7 +73,7 @@
<span :class="{hide: !isMobile}"> <span :class="{hide: !isMobile}">
# having problem with installation? # having problem with installation?
</span> </span>
<p class="code mb-5"> <p class="code">
<!-- <span class="identifier"> <!-- <span class="identifier">
const const
</span> --> </span> -->
@@ -176,7 +175,7 @@ function handleResize() {
#hello .head h2, #hello .head .diple { #hello .head h2, #hello .head .diple {
font-size: 32px; font-size: 32px;
line-height: 1; line-height: 1;
color: #FF7F53; color: #FF416C;
font-family: 'Fira Code Retina'; font-family: 'Fira Code Retina';
} }
@@ -203,7 +202,7 @@ function handleResize() {
} }
.code .identifier { .code .identifier {
color: #FF7F53; color: #FF416C;
} }
.code .variable-name { .code .variable-name {
@@ -254,7 +253,7 @@ function handleResize() {
height: 300px; height: 300px;
border-radius: 0% 50% 0% 50%; border-radius: 0% 50% 0% 50%;
filter: blur(70px); filter: blur(70px);
background: radial-gradient(circle at 50% 50%,rgba(67, 217, 173, 1), rgba(76, 0, 255, 0)); background: radial-gradient(circle at 50% 50%,rgba(255, 127, 83, 1), rgba(76, 0, 255, 0));
opacity: 0.5; opacity: 0.5;
z-index: 10; z-index: 10;
} }

6
pages/projects.vue
View File

@@ -164,7 +164,7 @@ input[type="checkbox"]:checked {
} }
input[type="checkbox"]:checked:hover { input[type="checkbox"]:checked:hover {
box-shadow: #FF7F53 0px 0px 0px 2px; box-shadow: #FF416C 0px 0px 0px 2px;
} }
input[type="checkbox"]:not(:checked) { input[type="checkbox"]:not(:checked) {
@@ -177,14 +177,14 @@ input[type="checkbox"]:hover {
background-image: url("data:image/svg+xml;utf8,<svg width='13' height='10' viewBox='0 0 13 10' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M5.38587 7.2802L11.9718 0.693573L12.9856 1.70668L5.38587 9.30641L0.826172 4.74671L1.83928 3.73361L5.38587 7.2802Z' fill='white'/></svg>"); background-image: url("data:image/svg+xml;utf8,<svg width='13' height='10' viewBox='0 0 13 10' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M5.38587 7.2802L11.9718 0.693573L12.9856 1.70668L5.38587 9.30641L0.826172 4.74671L1.83928 3.73361L5.38587 7.2802Z' fill='white'/></svg>");
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center; background-position: center;
box-shadow: #FF7F53 0px 0px 0px 2px; box-shadow: #FF416C 0px 0px 0px 2px;
} }
input[type="checkbox"]:hover:not(:checked) { input[type="checkbox"]:hover:not(:checked) {
cursor: pointer; cursor: pointer;
background-color: rgba(0, 0, 0, 0.1); background-color: rgba(0, 0, 0, 0.1);
background-image: none; background-image: none;
box-shadow: #FF7F53 0px 0px 0px 2px; box-shadow: #FF416C 0px 0px 0px 2px;
} }
input[type="checkbox"]:focus { input[type="checkbox"]:focus {