mirror of
https://github.com/Snigdha-OS/Snigdha-OS.github.io.git
synced 2025-09-06 04:35:18 +02:00
🎨 style(css): color deep from coral
Signed-off-by: Abhiraj Roy <157954129+iconized@users.noreply.github.com>
This commit is contained in:
@@ -41,7 +41,7 @@ footer a:hover {
|
||||
}
|
||||
|
||||
#social-icons > a {
|
||||
border-right: 1px solid #1E2D3D;
|
||||
border-right: 0px solid #1E2D3D;
|
||||
height: 100%;
|
||||
width: 50px;
|
||||
}
|
||||
@@ -61,6 +61,7 @@ footer > a > img {
|
||||
|
||||
#social-icons > a:hover img {
|
||||
opacity: 1;
|
||||
color: #FF416C;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
|
@@ -8,24 +8,24 @@
|
||||
</NuxtLink>
|
||||
|
||||
<NuxtLink id="nav-link" to="/" :class="{ active: isActive('/') }">
|
||||
_hello
|
||||
_hello.py
|
||||
</NuxtLink>
|
||||
|
||||
<NuxtLink id="nav-link" to="/about-me" :class="{ active: isActive('/about-me') }">
|
||||
_about
|
||||
_about.py
|
||||
</NuxtLink>
|
||||
|
||||
<NuxtLink id="nav-link" to="/projects" :class="{ active: isActive('/projects') }">
|
||||
_projects
|
||||
_projects.py
|
||||
</NuxtLink>
|
||||
|
||||
<NuxtLink id="nav-link" to="https://forum.snigdhaos.org" :class="{ active: isActive('') }">
|
||||
_forum
|
||||
_forum.py
|
||||
</NuxtLink>
|
||||
</div>
|
||||
|
||||
<NuxtLink id="nav-link-contact" to="/contact-me" :class="{ active: isActive('/contact-me')}">
|
||||
_contact
|
||||
_contact.py
|
||||
</NuxtLink>
|
||||
|
||||
</nav>
|
||||
@@ -86,7 +86,7 @@ export default {
|
||||
}
|
||||
|
||||
#nav-link.router-link-active, #nav-link-contact.router-link-active {
|
||||
border-bottom: 2px solid #FF7F53;
|
||||
border-bottom: 1px solid #FF416C;
|
||||
color: white;
|
||||
}
|
||||
|
||||
|
@@ -5,9 +5,9 @@
|
||||
<!-- line numbers and asteriscs -->
|
||||
<div v-for="n in lines" class="grid grid-cols-2 justify-end" :key="n">
|
||||
<span class="col-span-1 mr-3">{{ n }}</span>
|
||||
<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 pl-2" v-if="n == lines">*/</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 == lines">#</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
@@ -29,8 +29,8 @@
|
||||
<div>
|
||||
|
||||
<div id="instructions" class="font-fira_retina text-sm text-white">
|
||||
<p>// use your keyboard</p>
|
||||
<p>// arrows to play</p>
|
||||
<p># use your keyboard</p>
|
||||
<p># arrows to play</p>
|
||||
|
||||
<div id="buttons" class="w-full flex flex-col items-center gap-1 pt-5">
|
||||
|
||||
@@ -57,7 +57,7 @@
|
||||
|
||||
<!-- score board -->
|
||||
<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 class="food"></div>
|
||||
@@ -271,9 +271,9 @@
|
||||
|
||||
/* Food cell style */
|
||||
if (j === this.food.x && i === this.food.y) {
|
||||
cell.style.backgroundColor = "#43D9AD";
|
||||
cell.style.backgroundColor = "#FF7F53";
|
||||
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 */
|
||||
@@ -282,7 +282,7 @@
|
||||
);
|
||||
|
||||
if (snakeCell) {
|
||||
cell.style.backgroundColor = "#43D9AD";
|
||||
cell.style.backgroundColor = "#FF7F53";
|
||||
cell.style.opacity = 1 - (this.snake.indexOf(snakeCell) / this.snake.length);
|
||||
cell.classList.add("green");
|
||||
|
||||
@@ -409,7 +409,7 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
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;
|
||||
padding: 30px;
|
||||
position: relative;
|
||||
@@ -419,7 +419,7 @@
|
||||
#game-screen {
|
||||
width: 240px;
|
||||
height: 400px;
|
||||
border-radius: 10px;
|
||||
border-radius: 0px;
|
||||
background-color: rgba(1, 22, 39, 0.84);
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
@@ -429,9 +429,9 @@
|
||||
#start-button {
|
||||
padding-inline: 16px;
|
||||
padding-block: 8px;
|
||||
border-radius: 10px;
|
||||
border-radius: 2px;
|
||||
border: 1px solid black;
|
||||
background-color: #FEA55F;
|
||||
background-color: #FF7F53;
|
||||
color: black;
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
@@ -442,7 +442,7 @@
|
||||
}
|
||||
|
||||
#start-button:hover {
|
||||
background-color: rgb(255, 178, 119);
|
||||
background-color: #ff416c;
|
||||
}
|
||||
|
||||
#console-menu{
|
||||
@@ -461,7 +461,7 @@
|
||||
|
||||
#console-button:hover {
|
||||
background-color: #010c15d8;
|
||||
box-shadow: #43D9AD 0 0 10px;
|
||||
box-shadow: #FF7F53 0 0 10px;
|
||||
}
|
||||
|
||||
#instructions {
|
||||
@@ -471,9 +471,9 @@
|
||||
}
|
||||
|
||||
.food {
|
||||
background-color: #43D9AD;
|
||||
background-color: white;
|
||||
border-radius: 50%;
|
||||
box-shadow: 0 0 10px #43D9AD;
|
||||
box-shadow: 0 0 10px white;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
opacity: 0.3;
|
||||
@@ -482,7 +482,7 @@
|
||||
#game-over, #congrats {
|
||||
position: absolute;
|
||||
bottom: 12%;
|
||||
color: #43D9AD;
|
||||
color: #FF7F53;
|
||||
width: 240px;
|
||||
}
|
||||
|
||||
@@ -555,7 +555,7 @@
|
||||
#game-over, #congrats {
|
||||
position: absolute;
|
||||
bottom: 10%;
|
||||
color: #43D9AD;
|
||||
color: #FF7F53;
|
||||
width: 192px;
|
||||
}
|
||||
|
||||
|
@@ -9,7 +9,7 @@
|
||||
"icon": "icons/info-professional.svg",
|
||||
"info": {
|
||||
"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."
|
||||
},
|
||||
"hard-skills": {
|
||||
@@ -64,8 +64,7 @@
|
||||
"direct": {
|
||||
"title": "contacts",
|
||||
"sources": {
|
||||
"email": "hello@snigdhaos.org",
|
||||
"phone": "N/A"
|
||||
"email": "hello@snigdhaos.org"
|
||||
}
|
||||
},
|
||||
"social": {
|
||||
|
@@ -8,7 +8,7 @@
|
||||
<section class="hero">
|
||||
|
||||
<div class="head">
|
||||
<span>
|
||||
<span class="mb-12">
|
||||
<h2>greetings,</h2>
|
||||
</span>
|
||||
<h1>{{ config.dev.name }}</h1>
|
||||
@@ -24,15 +24,14 @@
|
||||
or skip to see about "Snigdha OS" -->
|
||||
</span>
|
||||
<span :class="{hide: isMobile}">
|
||||
# source code can be found on <br>
|
||||
# do follow us on github
|
||||
# source code can be found on, do follow us on github
|
||||
</span>
|
||||
<span>#!/usr/bin/python</span>
|
||||
<span :class="{hide: !isMobile}">
|
||||
# source code:<br>
|
||||
# follow us on github
|
||||
</span>
|
||||
<p class="code mb-5">
|
||||
<p class="code mb-2">
|
||||
<!-- <span class="identifier">
|
||||
const
|
||||
</span> -->
|
||||
@@ -53,7 +52,7 @@
|
||||
<span :class="{hide: !isMobile}">
|
||||
# it is recommended to download the <b>ISO</b> file on PC
|
||||
</span>
|
||||
<p class="code mb-5">
|
||||
<p class="code">
|
||||
<!-- <span class="identifier">
|
||||
const
|
||||
</span> -->
|
||||
@@ -74,7 +73,7 @@
|
||||
<span :class="{hide: !isMobile}">
|
||||
# having problem with installation?
|
||||
</span>
|
||||
<p class="code mb-5">
|
||||
<p class="code">
|
||||
<!-- <span class="identifier">
|
||||
const
|
||||
</span> -->
|
||||
@@ -176,7 +175,7 @@ function handleResize() {
|
||||
#hello .head h2, #hello .head .diple {
|
||||
font-size: 32px;
|
||||
line-height: 1;
|
||||
color: #FF7F53;
|
||||
color: #FF416C;
|
||||
font-family: 'Fira Code Retina';
|
||||
}
|
||||
|
||||
@@ -203,7 +202,7 @@ function handleResize() {
|
||||
}
|
||||
|
||||
.code .identifier {
|
||||
color: #FF7F53;
|
||||
color: #FF416C;
|
||||
}
|
||||
|
||||
.code .variable-name {
|
||||
@@ -254,7 +253,7 @@ function handleResize() {
|
||||
height: 300px;
|
||||
border-radius: 0% 50% 0% 50%;
|
||||
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;
|
||||
z-index: 10;
|
||||
}
|
||||
|
@@ -164,7 +164,7 @@ input[type="checkbox"]:checked {
|
||||
}
|
||||
|
||||
input[type="checkbox"]:checked:hover {
|
||||
box-shadow: #FF7F53 0px 0px 0px 2px;
|
||||
box-shadow: #FF416C 0px 0px 0px 2px;
|
||||
}
|
||||
|
||||
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-repeat: no-repeat;
|
||||
background-position: center;
|
||||
box-shadow: #FF7F53 0px 0px 0px 2px;
|
||||
box-shadow: #FF416C 0px 0px 0px 2px;
|
||||
}
|
||||
|
||||
input[type="checkbox"]:hover:not(:checked) {
|
||||
cursor: pointer;
|
||||
background-color: rgba(0, 0, 0, 0.1);
|
||||
background-image: none;
|
||||
box-shadow: #FF7F53 0px 0px 0px 2px;
|
||||
box-shadow: #FF416C 0px 0px 0px 2px;
|
||||
}
|
||||
|
||||
input[type="checkbox"]:focus {
|
||||
|
Reference in New Issue
Block a user