more gradients color added
This commit is contained in:
parent
4ad335133b
commit
5a167d8c47
3 changed files with 253 additions and 157 deletions
|
@ -103,6 +103,111 @@ let gradientCards = [{
|
||||||
gradientName: 'smoothy',
|
gradientName: 'smoothy',
|
||||||
gradientMaker: 'ShyamTala'
|
gradientMaker: 'ShyamTala'
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
id: 16,
|
||||||
|
colors: ['#3a6186', '#89253e'],
|
||||||
|
gradientColor: 'linear-gradient(90deg, #3a6186, #89253e)',
|
||||||
|
gradientName: 'love couple',
|
||||||
|
gradientMaker: 'ShyamTala'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 17,
|
||||||
|
colors: ['#FD297A', '#9424F0'],
|
||||||
|
gradientColor: 'linear-gradient(90deg, #FD297A, #9424F0)',
|
||||||
|
gradientName: 'cripy',
|
||||||
|
gradientMaker: 'ShyamTala'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 18,
|
||||||
|
colors: ['#FED54A', '#FF9347'],
|
||||||
|
gradientColor: 'linear-gradient(90deg, #FED54A, #FF9347)',
|
||||||
|
gradientName: 'sunset',
|
||||||
|
gradientMaker: 'ShyamTala'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 19,
|
||||||
|
colors: ['#70e1f5', '#ffd194'],
|
||||||
|
gradientColor: 'linear-gradient(90deg, #70e1f5, #ffd194)',
|
||||||
|
gradientName: 'shore',
|
||||||
|
gradientMaker: 'ShyamTala'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 20,
|
||||||
|
colors: ['#00c6ff', '#0072ff'],
|
||||||
|
gradientColor: 'linear-gradient(90deg, #00c6ff, #0072ff)',
|
||||||
|
gradientName: 'Facebook Messenger',
|
||||||
|
gradientMaker: 'ShyamTala'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 21,
|
||||||
|
colors: ['#d38312', '#a83279'],
|
||||||
|
gradientColor: 'linear-gradient(90deg, #d38312, #a83279)',
|
||||||
|
gradientName: 'Crazy Orange!',
|
||||||
|
gradientMaker: 'ShyamTala'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 22,
|
||||||
|
colors: ['#43cea2', '#185a9d'],
|
||||||
|
gradientColor: 'linear-gradient(90deg, #43cea2, #185a9d)',
|
||||||
|
gradientName: 'Endless river!',
|
||||||
|
gradientMaker: 'ShyamTala'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 23,
|
||||||
|
colors: ['#ffb347', '#ffcc33'],
|
||||||
|
gradientColor: 'linear-gradient(90deg, #ffb347, #ffcc33)',
|
||||||
|
gradientName: 'Crazy Orange!',
|
||||||
|
gradientMaker: 'ShyamTala'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 24,
|
||||||
|
colors: ['#FEAC5E', '#C779D0','#4BC0C8'],
|
||||||
|
gradientColor: 'linear-gradient(90deg,#FEAC5E, #C779D0, #4BC0C8)',
|
||||||
|
gradientName: 'Atlas!',
|
||||||
|
gradientMaker: 'ShyamTala'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 25,
|
||||||
|
colors: ['#7b4397', '#dc2430'],
|
||||||
|
gradientColor: 'linear-gradient(90deg,#7b4397, #dc2430)',
|
||||||
|
gradientName: 'virgin america',
|
||||||
|
gradientMaker: 'ShyamTala'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 26,
|
||||||
|
colors: ['#fc00ff', '#00dbde'],
|
||||||
|
gradientColor: 'linear-gradient(90deg,#fc00ff, #00dbde)',
|
||||||
|
gradientName: 'timber',
|
||||||
|
gradientMaker: 'ShyamTala'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 27,
|
||||||
|
colors: ['#f46b45', '#eea849'],
|
||||||
|
gradientColor: 'linear-gradient(90deg,#f46b45, #eea849)',
|
||||||
|
gradientName: 'master card',
|
||||||
|
gradientMaker: 'ShyamTala'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 28,
|
||||||
|
colors: ['#00C9FF', '#92FE9D'],
|
||||||
|
gradientColor: 'linear-gradient(90deg,#00C9FF, #92FE9D)',
|
||||||
|
gradientName: 'back to earth',
|
||||||
|
gradientMaker: 'ShyamTala'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 29,
|
||||||
|
colors: ['#fd746c', '#ff9068'],
|
||||||
|
gradientColor: 'linear-gradient(90deg,#fd746c, #ff9068)',
|
||||||
|
gradientName: 'haikus',
|
||||||
|
gradientMaker: 'ShyamTala'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 30,
|
||||||
|
colors: ['#3434e6', '#ec6ead'],
|
||||||
|
gradientColor: 'linear-gradient(90deg,#3434e6, #ec6ead)',
|
||||||
|
gradientName: 'vice city',
|
||||||
|
gradientMaker: 'ShyamTala'
|
||||||
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
|
|
||||||
|
|
4
dist/jquery.lcnCircleRangeSelect.css
vendored
4
dist/jquery.lcnCircleRangeSelect.css
vendored
|
@ -10,7 +10,7 @@ input.circle-range-select {
|
||||||
margin:auto 0.65em 45% 0.65em;
|
margin:auto 0.65em 45% 0.65em;
|
||||||
padding: 0.65em !important;
|
padding: 0.65em !important;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
border: 0.4em solid rgba(204, 204, 204, 0.326);
|
border: 0.4em solid rgba(204, 204, 204, 0.518);
|
||||||
cursor: default;
|
cursor: default;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -43,7 +43,7 @@ input.circle-range-select {
|
||||||
}
|
}
|
||||||
|
|
||||||
.circle-range-select-wrapper .values {
|
.circle-range-select-wrapper .values {
|
||||||
color: rgba(255, 255, 255, 0.733);
|
color: rgba(255, 255, 255, 0.877);
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
|
|
47
style.css
47
style.css
|
@ -7,15 +7,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
::-webkit-scrollbar {
|
::-webkit-scrollbar {
|
||||||
width: 10px;
|
display: none;
|
||||||
}
|
|
||||||
|
|
||||||
::-webkit-scrollbar-track {
|
|
||||||
background: #f1f1f1;
|
|
||||||
}
|
|
||||||
|
|
||||||
::-webkit-scrollbar-thumb {
|
|
||||||
background: linear-gradient(to top, #6c28d9, #db2778);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* code for toast msg */
|
/* code for toast msg */
|
||||||
|
@ -123,27 +115,12 @@ span#notify_toast {
|
||||||
|
|
||||||
.container {
|
.container {
|
||||||
font-family: system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
|
font-family: system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
|
||||||
background: linear-gradient(90deg, #6d28d9,#db2777,#feac5e, #c779d0, #4bc0c8);
|
background: linear-gradient(to right, #6d28d9, #db2777);
|
||||||
/* background:linear-gradient(to right, #6d28d9, #db2777); */
|
|
||||||
background-size: 600% 600%;
|
|
||||||
padding-inline: 8%;
|
padding-inline: 8%;
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
animation: gradient 16s ease infinite;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@keyframes gradient {
|
|
||||||
0% {
|
|
||||||
background-position: 0% 50%;
|
|
||||||
}
|
|
||||||
|
|
||||||
50% {
|
|
||||||
background-position: 100% 50%;
|
|
||||||
}
|
|
||||||
|
|
||||||
100% {
|
|
||||||
background-position: 0% 50%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
h1.logo_text {
|
h1.logo_text {
|
||||||
|
@ -165,9 +142,6 @@ main.hero_section {
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
}
|
}
|
||||||
|
|
||||||
.hero_section h2:nth-child(2) {
|
|
||||||
color: #ffffff;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form {
|
.form {
|
||||||
margin-top: 1.5rem;
|
margin-top: 1.5rem;
|
||||||
|
@ -235,6 +209,9 @@ main.hero_section {
|
||||||
@media screen and (max-width:640px) {
|
@media screen and (max-width:640px) {
|
||||||
.container {
|
.container {
|
||||||
padding-inline: 15px;
|
padding-inline: 15px;
|
||||||
|
background: linear-gradient(90deg, #6d28d9, #db2777, #feac5e, #c779d0, #4bc0c8);
|
||||||
|
background-size: 600% 600%;
|
||||||
|
animation: gradient 16s ease infinite;
|
||||||
}
|
}
|
||||||
|
|
||||||
.hero_section h2 {
|
.hero_section h2 {
|
||||||
|
@ -253,8 +230,22 @@ main.hero_section {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@keyframes gradient {
|
||||||
|
0% {
|
||||||
|
background-position: 0% 50%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
50% {
|
||||||
|
background-position: 100% 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
background-position: 0% 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
/* gradient container section */
|
/* gradient container section */
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue