v3 development

This commit is contained in:
gurusabarish
2021-05-13 22:48:06 +05:30
parent 14d16483be
commit 54bcff5142
60 changed files with 3626 additions and 491 deletions
+115
View File
@@ -0,0 +1,115 @@
article blockquote {
margin: 0 !;
border-left: 4px solid #248aaa !important;
background-color: #248baa15 !important;
padding: 0.3rem !important;
padding-left: 1rem !important;
}
article blockquote > p {
color: #3c4858 !important;
margin-top: 0.5rem !important;
margin-bottom: 0.5rem !important;
}
article h1,
h2 {
margin-top: 1.4rem;
font-size: 32px;
border-left: 4px solid #77ace9 !important;
background-color: #b2cad43a !important;
padding: 0.3rem !important;
padding-left: 1rem !important;
}
article h3,
h4,
h5,
h6 {
margin-top: 1.3rem;
}
article table {
border-radius: 0.1rem;
background: #e5e9f2;
border: 1px solid #c0ccda;
padding: 0.1rem;
}
article table tr {
height: 40px !important;
}
article table th,
td {
padding: 0.5rem;
border-left: 1px solid #8392a5;
border-bottom: 1px solid #8392a5;
}
article table thead tr {
background: #248aaa;
color: #e5e9f2;
}
article tbody tr:nth-child(odd) {
background-color: #e5e9f2;
}
article tbody tr:hover {
background: #c0ccda;
}
article img {
width: 100%;
}
article caption,
figcaption {
caption-side: bottom;
text-align: center;
color: #8392a5;
}
article pre {
margin: 5px;
padding: 5%;
font-size: 18px;
max-height: 400px;
border-radius: 2%;
background-color: #1f618d !important;
color: white;
}
article pre > code {
padding: 10px !important;
}
article a.header-anchor {
text-decoration: none;
color: #1c2d41;
}
article a.header-anchor i {
font-size: 10pt;
color: #3c4858;
display: none;
margin-left: 0.5rem;
}
article a.header-anchor:hover i {
display: inline-block;
}
article a.header-anchor code {
color: #e83e8c;
}
article kbd {
background-color: #248aaa !important;
color: #f9fafc;
}
article mark {
background-color: #ffc21280;
}
+13
View File
@@ -0,0 +1,13 @@
/*footer*/
.footer {
background: #f2f2f2;
}
.navbar-text {
font-size: 17px;
}
.footer-site {
font-family: "Alata", sans-serif;
font-size: 25px;
}
+203
View File
@@ -0,0 +1,203 @@
a:hover {
text-decoration: none !important;
}
/*home*/
.home {
height: auto;
padding: 0;
padding-bottom: 0;
margin: 0;
background-size: cover;
background-repeat: no-repeat;
}
.name {
font-family: "Alata", sans-serif;
}
.name-intro {
font-size: 20px;
padding-top: 10%;
padding-left: 17%;
}
.profile {
float: right;
padding-right: 22%;
padding-bottom: 10%;
}
.know-more {
padding-bottom: 15%;
font-family: cursive;
}
.know-more a:hover {
text-decoration-line: none;
color: black;
}
.home-content {
padding-top: 0;
padding-left: 18%;
padding-right: 5%;
background-repeat: no-repeat;
background-position: bottom;
}
.social a:hover {
text-decoration-line: none;
}
@media only screen and (max-width: 992px) {
.profile {
padding-right: 35%;
text-align: center !important;
}
}
@media only screen and (max-width: 768px) {
.home {
height: auto;
background-position: left bottom;
}
.name-intro {
height: 200px;
padding-left: 10%;
}
.home-content {
height: 30%;
background: none;
}
.know-more {
padding-top: 10%;
padding-left: 20%;
padding-right: 20%;
padding-bottom: 10%;
}
.know-more a {
color: black;
}
}
/* recent posts */
.recent-posts {
font-family: "Alata", sans-serif;
font-size: 25px;
}
/* do things */
.do-things {
background-color: #e5e9f2;
height: auto;
padding: 0;
padding-bottom: 0;
margin: 0;
}
.things-i-do {
font-family: "Alata", sans-serif;
font-size: 25px;
}
.things {
height: auto;
}
.things-text {
height: 100px;
overflow: hidden;
}
@media only screen and (max-width: 768px) {
.do-things-card {
padding-left: 15%;
padding-right: 15%;
padding-bottom: 15%;
padding-top: 0%;
}
}
/* about */
.about {
height: auto;
background-color: #e5e9f2;
}
.jop {
font-size: 30px;
}
.about-me {
font-family: "Alata", sans-serif;
font-size: 25px;
}
.about-content {
font-size: 20px;
}
.about-content a:hover {
text-decoration-line: none;
color: black;
}
@media only screen and (max-width: 768px) {
.about {
height: auto;
}
}
/* Skill
.skill {
height: 80vh;
background-color: #e5e9f2;
}
.skill-heading {
font-family: 'Alata', sans-serif;
font-size: 25px;
}
*/
/* Projects */
.projects {
height: auto;
background-color: #bd8338;
}
.project-heading {
font-family: "Alata", sans-serif;
font-size: 25px;
}
.card-title {
font-family: "Alata", sans-serif;
font-size: 28px;
}
/* recent posts */
.blog-back {
background-color: #ebb951;
}
.post-card a:hover {
text-decoration-line: none;
}
.post-hover :hover {
background-color: #17a2b8;
}
/* contact */
.contact-head {
font-family: "Alata", sans-serif;
font-size: 25px;
}
@@ -1,120 +1,3 @@
body {
font-family: "Roboto", sans-serif;
}
a:hover {
text-decoration: none;
}
/* do things */
.do-things {
height: auto;
padding: 0;
padding-bottom: 0;
margin: 0;
}
.things-i-do {
font-family: "Alata", sans-serif;
font-size: 25px;
}
.things {
height: auto;
}
.things-text {
height: 100px;
overflow: hidden;
}
@media only screen and (max-width: 768px) {
.things-i-do {
padding-top: 7% !important;
}
.do-things-card {
padding-left: 15%;
padding-right: 15%;
padding-bottom: 0%;
padding-top: 0%;
}
}
/* about */
.about {
height: auto;
}
.jop {
font-size: 30px;
}
.about-me {
font-family: "Alata", sans-serif;
font-size: 27px;
}
.about-content {
font-size: 20px;
}
.about-content a:hover {
text-decoration-line: none;
color: black;
}
@media only screen and (max-width: 768px) {
.about {
height: auto;
}
}
/* footer */
footer {
background-color: #1c2d41;
color: #8392a5;
border-top-width: 1px !important;
border-color: #8392a5;
}
footer a {
color: #8392a5;
}
/* news */
.news a {
color: #1c2d41;
text-decoration: none;
}
/*navbar*/
.navbar-color {
color: #101820ff;
}
.navbar-text {
font-size: 17px;
}
.navbar-brand {
font-size: 22px;
}
.nav-link {
color: #101820ff !important;
font-size: 18px;
}
footer {
background-color: #1c2d41;
color: #8392a5;
border-top-width: 1px !important;
border-color: #8392a5;
}
.blog-title {
font-size: 48px;
}
+81
View File
@@ -0,0 +1,81 @@
/* v2 and v3 footer */
footer {
background-color: #1c2d41;
color: #8392a5;
border-top-width: 1px !important;
border-color: #8392a5;
}
footer a {
color: #8392a5;
}
/* v2 and v3 news */
.news a {
color: #1c2d41;
text-decoration: none;
}
/* v2 do things */
.do-things {
height: auto;
padding: 0;
padding-bottom: 0;
margin: 0;
}
.things-i-do {
font-family: "Alata", sans-serif;
font-size: 25px;
}
.things {
height: auto;
}
.things-text {
height: 100px;
overflow: hidden;
}
@media only screen and (max-width: 768px) {
.things-i-do {
padding-top: 7% !important;
}
.do-things-card {
padding-left: 15%;
padding-right: 15%;
padding-bottom: 0%;
padding-top: 0%;
}
}
/* v2 about */
.about {
height: auto;
}
.jop {
font-size: 30px;
}
.about-me {
font-family: "Alata", sans-serif;
font-size: 27px;
}
.about-content {
font-size: 20px;
}
.about-content a:hover {
text-decoration-line: none;
color: black;
}
@media only screen and (max-width: 768px) {
.about {
height: auto;
}
}
+385
View File
@@ -0,0 +1,385 @@
body {
font-family: "Roboto", sans-serif;
}
a:hover {
text-decoration: none;
}
/* v3 navbar */
.navbar-brand {
color: #007bff !important;
}
.navbar .nav-link {
color: #f9fafc !important;
}
.navbar .nav-link:hover {
color: #007bff !important;
}
.navbar-home {
border-top: 5px solid #ff69b4;
}
.navbar-text {
font-size: 16px !important;
}
/* v3 home */
.home {
background-color: #0a192f;
}
.name {
padding-left: 3%;
border-left: 5px solid #f9fafc;
}
.btn-intro {
padding-left: 3%;
padding-bottom: 10%;
}
.social {
padding-left: 5%;
}
.btn-know {
padding: 2% 5% 2% 5%;
border-radius: 50px !important;
cursor: pointer;
font-size: 18px;
}
.social-icon {
padding: 2%;
background-color: #f9fafc;
border-radius: 50%;
transition: 0.3s;
}
.social-icon:hover {
background-color: #007bff !important;
color: #f9fafc !important;
}
.intro {
padding: 8% 0 8% 0;
}
.name-container {
padding-left: 15%;
}
.profile {
filter: gray;
-webkit-filter: sepia(70%);
filter: sepia(70%);
cursor: pointer;
padding: 1%;
border: 1px solid #f9fafc;
width: 250px;
height: 250px;
}
.profile:hover {
-webkit-filter: grayscale(0);
filter: none;
}
@media only screen and (max-width: 768px) {
.name-container {
padding-left: 10%;
}
.profile {
width: 220px;
height: 220px;
}
}
@media only screen and (max-width: 768px) and (orientation: landscape) {
.name-container {
padding-left: 20%;
}
}
/* v3 about */
#about {
background-color: #0a192f;
}
.about {
padding-top: 3% !important;
padding-bottom: 3% !important;
}
.about-content {
padding-left: 10% !important;
font-size: 17px;
}
.about-skill {
padding-right: 10% !important;
}
.contact-btn {
padding: 2%;
font-size: 17px;
color: #f9fafc;
border: 1px solid #f9fafc;
}
.contact-btn:hover {
color: #8892b0;
}
@media only screen and (max-width: 768px) {
.about-content {
padding-left: 5% !important;
padding-right: 5% !important;
}
.about-skill {
padding-left: 5% !important;
padding-right: 5% !important;
}
.about {
padding-top: 5% !important;
padding-bottom: 5% !important;
}
}
/* v3 projects */
#projects {
background-color: #0a192f;
}
.bg-pro {
padding: 0 !important;
opacity: 0.6;
}
.bg-pro img {
height: 250px;
width: 100%;
border-radius: 0.5rem !important;
border-top-right-radius: 0 !important;
border-bottom-right-radius: 0 !important;
}
.content-pro {
height: 250px;
background-color: #e5e4e2 !important;
border-top-right-radius: 0.5rem !important;
border-bottom-right-radius: 0.5rem !important;
}
.content-pro-top {
height: 80%;
}
.pro:hover .pro-btn {
background-color: #3498db !important;
color: #f9fafc;
}
@media only screen and (max-width: 767px) {
.bg-pro {
opacity: 0.3;
position: relative;
}
.pro {
margin-left: 10% !important;
margin-right: 10% !important;
}
.bg-pro img {
border-radius: 0.5rem !important;
}
.content-pro {
background-color: transparent !important;
position: absolute;
top: 8px;
}
.content-pro-top {
height: 80%;
color: #f9fafc;
}
.card-text {
color: #8892b0;
}
.pro:hover .content-pro {
background-color: transparent !important;
color: #f9fafc;
}
.pro:hover .pro-btn {
color: #f9fafc;
border: none;
}
.pro:hover .bg-pro {
opacity: 0.3;
}
}
/* v3 experience */
#experience {
color: #8892b0;
background-color: #0a192f;
}
#nav-pills-out {
border-left: 1px solid #f9fafc;
}
.nav-pills .nav-link {
color: #8892b0 !important;
}
.nav-pills .active {
color: #f9fafc !important;
background-color: #0a192f !important;
}
.tab-pane {
color: #8892b0;
}
.ex {
list-style-type: none;
}
.ex .ex-item {
padding-left: 30px;
}
.ex-item::before {
padding-left: 8%;
content: "▹";
position: absolute;
left: 0px;
color: #007bff;
}
.ex-ol {
list-style-type: decimal-leading-zero;
padding-top: 7%;
}
.ex-ol .ex-ol-li {
padding-bottom: 3%;
}
.ex-ol-ul {
max-width: 100%;
list-style-type: none;
padding-left: 0;
}
.ex-ol-ul li {
max-width: 100%;
padding-left: 10%;
}
.ex-ol-item::before {
padding-left: 15%;
content: "▹";
position: absolute;
left: 0px;
color: #007bff;
}
@media only screen and (max-width: 768px) and (orientation: landscape) {
.ex-ol {
list-style-type: decimal-leading-zero;
padding-left: 15% !important;
padding-right: 15% !important;
}
.ex-ol-item::before {
padding-left: 17%;
content: "▹";
}
}
/* v3 education */
#education {
background-color: #0a192f;
color: #8892b0;
}
.v-center {
display: flex;
align-items: center;
}
.edu {
width: 100%;
padding: 0;
}
.edu-item {
padding-left: 20%;
list-style: none;
}
.edu-item::before {
padding: 0%;
padding-left: 20%;
content: "▹";
position: absolute;
left: 0px;
color: #f9fafc;
}
.edu-img {
width: 100%;
}
@media only screen and (max-width: 768px) {
.edu-item::before {
padding: 0%;
padding-left: 8%;
content: "▹";
position: absolute;
left: 0px;
color: #f9fafc;
}
.edu-item {
padding-left: 0%;
list-style: none;
}
.edu-img {
width: 100%;
height: 400px;
}
}
@media only screen and (max-width: 1024px) and (orientation: landscape) {
.edu-item::before {
padding: 0%;
padding-left: 18%;
content: "▹";
position: absolute;
left: 0px;
color: #f9fafc;
}
.edu-item {
padding-right: 18%;
padding-left: 18%;
list-style: none;
}
.edu-img {
width: 100%;
height: 400px;
}
}
/* v3 Achievements */
#achievements {
background-color: #0a192f;
}
.achiv-card {
height: 300px;
width: 100%;
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
filter: grayscale(100%);
}
.achiv-card:hover {
filter: none;
}
.achiv {
min-height: 40%;
background: rgba(255, 255, 255, 0.9);
box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
transition: 0.3s;
transition: ease-in-out 0.4s;
border-radius: 0.25rem !important;
}
.achiv-out {
max-width: 35% !important;
}
@media only screen and (max-width: 768px) {
.achiv-out {
max-width: 100% !important;
}
}
/* v3 contact */
#contact {
background-color: #0a192f;
}
.contact-img {
width: 100%;
height: 400px;
}
/* v2 and v3 footer */
footer {
background-color: #0a192f;
color: #8392a5;
border-top-width: 1px !important;
border-color: #8392a5;
}
footer a {
color: #8392a5;
}
/* v2 and v3 news */
.news a {
color: #1c2d41;
text-decoration: none;
}