This commit is contained in:
David Ralph
2020-11-05 16:01:31 +00:00
parent f6d8ccf6e7
commit e1510e8277
35 changed files with 127 additions and 239 deletions

View File

@@ -10,6 +10,7 @@
$animations: #{$animations + ', '};
}
}
-webkit-animation: $animations;
-moz-animation: $animations;
animation: $animations;
@@ -19,9 +20,11 @@
@-webkit-keyframes #{$animationName} {
@content;
}
@-moz-keyframes #{$animationName} {
@content;
}
@keyframes #{$animationName} {
@content;
}

View File

@@ -10,15 +10,16 @@
font-size: 20px;
border-radius: 24px;
background: none;
box-shadow: 0 5px 15px rgba(46, 213, 115, .4);
box-shadow: 0 5px 15px rgba(128, 161, 144, 0.4);
&:hover {
&:hover, &:active {
outline: none;
background: none;
}
}
&:active {
outline: none;
}
.dark %settingsButton {
box-shadow: none;
}
.apply {
@@ -30,7 +31,6 @@
&:hover {
border: 2px solid map-get($button-colours, 'confirm');
color: map-get($button-colours, 'confirm');
background: none;
}
}
@@ -43,7 +43,6 @@
&:hover {
border: 2px solid map-get($button-colours, 'reset');
color: map-get($button-colours, 'reset');
background: none;
}
}
@@ -56,7 +55,6 @@
&:hover {
color: map-get($button-colours, 'other');
border: 2px solid map-get($button-colours, 'other');
background: none;
}
}
@@ -68,27 +66,6 @@
&:hover {
color: map-get($button-colours, 'other');
border: 2px solid map-get($button-colours, 'other');
background: none;
}
}
.remove {
@extend %settingsButton;
border-radius: 50%;
background: none;
border: 2px solid rgba(0,0,0,0);
color: map-get($button-colours, 'reset');
text-align: center;
vertical-align: sub;
height: 60px;
width: 60px;
padding: 0px;
font-size: 30px;
&:hover {
color: map-get($button-colours, 'background');
border: 2px solid map-get($button-colours, 'reset');
background: none;
}
}
@@ -102,8 +79,6 @@
&:hover {
color: map-get($button-colours, 'other');
border: 2px solid map-get($button-colours, 'other');
background: none;
}
}
@@ -113,7 +88,7 @@
margin-left: 20px;
}
.storebutton {
%storebutton {
cursor: pointer;
font-size: 18px;
float: right;
@@ -130,32 +105,28 @@
&:hover {
background: #2d3436;
color: map-get($theme-colours, 'main');;
border: 2px solid #2d3436;
}
}
.dark .storebutton {
.dark %storebutton {
border: 2px solid map-get($theme-colours, 'main');
color: map-get($theme-colours, 'main');
&:hover {
background: map-get($theme-colours, 'main');
color: #2d3436;
border: 2px solid map-get($theme-colours, 'main');
}
}
#item >.removeFromMue {
.removeFromMue {
@extend %storebutton;
border: 2px solid #ff4757;
color: #ff4757;
&:hover {
background: #ff4757;
color: map-get($theme-colours, 'main');;
border: 2px solid #ff4757;
}
@extend .storebutton;
}
#item .addToMue,
@@ -164,30 +135,18 @@
}
.addToMue {
@extend .storebutton;
@extend %storebutton;
}
.goToMarket {
float: none;
@extend .storebutton;
@extend %storebutton;
}
.sideload, .seemore {
margin-top: 12px;
}
.seemore {
@extend %settingsButton;
background-color: #2d3436;
border: 2px solid #2d3436;
&:hover {
color: #2d3436;
border: 2px solid #2d3436;
background: none;
}
}
.stop {
outline: none;
border-image-slice: 1;
@@ -212,8 +171,6 @@ input[type=number]::-webkit-outer-spin-button {
&:hover {
color: map-get($button-colours, 'confirm');
border: 2px solid map-get($button-colours, 'confirm');
background: none;
}
svg {
@@ -234,15 +191,10 @@ input[type=number]::-webkit-outer-spin-button {
border: 2px solid map-get($button-colours, 'other');
color: map-get($theme-colours, 'main');
transition: 0s;
display: inline;
margin: 5px;
&:hover {
color: map-get($button-colours, 'other');
border: 2px solid map-get($button-colours, 'other');
background: none;
}
}
.saveNote {
display: inline;
margin: 5px;
}

View File

@@ -1,3 +1,3 @@
.MuiCheckbox-colorPrimary.Mui-checked {
color: map-get($button-colours, "reset") !important;
color: map-get($button-colours, 'reset') !important;
}

View File

@@ -83,19 +83,18 @@
}
.view {
position: absolute;
bottom: 10px;
right: 25px;
}
.favourite {
position: absolute;
bottom: 10px;
right: 50px;
padding-right: 5px;
}
.view, .favourite {
position: absolute;
transition: all 0.5s ease 0s;
&:hover {
transform: scale(1.1);

View File

@@ -3,7 +3,7 @@
background: linear-gradient(180deg, #ffb032 0%, #dd3b67 100%);
height: 34px;
width: 120px;
color: map-get($modal, "text");
color: map-get($modal, 'text');
border-image-source: linear-gradient(180deg, #ffb032 0%, #dd3b67 100%);
border-image-slice: 1;

View File

@@ -5,7 +5,7 @@ button.tablinks {
background: none;
border: none;
outline: none;
color: map-get($modal, "text");
color: map-get($modal, 'text');
}
button.tablinks {
@@ -19,17 +19,17 @@ button.tablinks {
}
&:after {
content: "";
content: '';
display: block;
margin: 0 auto;
width: 50%;
padding-top: 10px;
border-bottom: 3px solid map-get($modal, "tab-underline");
border-bottom: 3px solid map-get($modal, 'tab-underline');
}
}
#item a {
color: map-get($button-colours, "other");
color: map-get($button-colours, 'other');
cursor: pointer;
&:hover {
@@ -39,12 +39,12 @@ button.tablinks {
#active:after {
content: "";
content: '';
display: block;
margin: 0 auto;
width: 50%;
padding-top: 10px;
border-bottom: 3px solid map-get($modal, "tab-underline-active");
border-bottom: 3px solid map-get($modal, 'tab-underline-active');
}
.dark {
@@ -55,7 +55,7 @@ button.tablinks {
#active:after {
border-image-slice: 1;
border-image-source: map-get($theme-colours, "gradient");
border-image-source: map-get($theme-colours, 'gradient');
border-bottom: 3px solid;
}
}
@@ -76,7 +76,7 @@ button.tablinks {
border-radius: 12px;
height: 80px;
width: 270px;
background: map-get($marketplace, "item-background");
background: map-get($marketplace, 'item-background');
transition: 0.5s;
cursor: pointer;
margin-right: 20px;
@@ -184,20 +184,20 @@ p.description {
.productInformation {
margin-bottom: 20px;
padding: 20px;
background: map-get($marketplace, "product-information-backgroud");
background: map-get($marketplace, 'product-information-backgroud');
width: 200px;
border-radius: 12px;
li {
margin-left: -4px;
list-style: none;
}
li.header {
text-transform: uppercase;
color: #787878;
list-style: none;
margin-left: -5px;
&.header {
text-transform: uppercase;
color: #787878;
list-style: none;
margin-left: -5px;
}
}
}
@@ -233,7 +233,7 @@ p.description {
border-radius: 24px;
padding: 10px;
margin: 0;
color: map-get($theme-colours, "main");
color: map-get($theme-colours, 'main');
display: none !important;
}
@@ -242,17 +242,16 @@ p.description {
margin-top: 20px;
border-radius: 24px;
padding: 50px;
color: map-get($theme-colours, "main");
color: map-get($theme-colours, 'main');
button {
float: left;
margin-top: -20px;
border: 2px solid map-get($theme-colours, "main");
color: map-get($theme-colours, "main");
border: 2px solid map-get($theme-colours, 'main');
color: map-get($theme-colours, 'main');
&:hover {
border: 2px solid map-get($theme-colours, "main");
background: map-get($theme-colours, "main");
background: map-get($theme-colours, 'main');
color: #2d3436;
}
}

View File

@@ -1,6 +1,6 @@
.Modal {
color: map-get($modal, "text");
background-color: map-get($modal, "background");
color: map-get($modal, 'text');
background-color: map-get($modal, 'background');
box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
border: none;
opacity: 1;
@@ -9,7 +9,7 @@
cursor: hand;
transition: 0.6s;
transition-timing-function: ease-in;
border-radius: map-get($modal, "border-radius");
border-radius: map-get($modal, 'border-radius');
-moz-user-select: none;
-webkit-user-select: none;
user-select: none;
@@ -167,14 +167,14 @@
::-webkit-scrollbar {
width: 13px;
background: #bdc3c7;
border-top-right-radius: map-get($modal, "border-radius");
border-bottom-right-radius: map-get($modal, "border-radius");
border-top-right-radius: map-get($modal, 'border-radius');
border-bottom-right-radius: map-get($modal, 'border-radius');
}
::-webkit-scrollbar-thumb {
background: #34495e;
border-top-right-radius: map-get($modal, "border-radius");
border-bottom-right-radius: map-get($modal, "border-radius");
border-top-right-radius: map-get($modal, 'border-radius');
border-bottom-right-radius: map-get($modal, 'border-radius');
}
.tablinks svg {

View File

@@ -57,41 +57,6 @@
transition: .2s ease;
&:hover {
color: map-get($theme-colours, 'main-text-color');
transform: translateZ(0);
transform: scale(1.3);
}
}
}
.navbar-container-bottom {
position: absolute;
bottom: 1rem;
right: 1rem;
div {
display: inline;
}
img {
height: 1em;
width: auto;
margin: 0.5rem;
}
svg.topicons {
color: map-get($theme-colours, 'main-text-color');
-webkit-font-smoothing: subpixel-antialiased;
font-size: 1em;
display: inline;
margin: 0.5rem;
filter: drop-shadow(0 0 6px rgba(0, 0, 0, 0.3));
cursor: pointer;
transition: .2s ease;
&:hover {
color: map-get($theme-colours, 'main-text-color');
transform: translateZ(0);
transform: scale(1.3);
}

View File

@@ -45,7 +45,7 @@ h1.quoteauthor {
button.copyButton {
background: transparent;
border: none;
color: map-get($theme-colours, "main");;
color: map-get($theme-colours, 'main');
padding: 20px 20px;
text-align: center;
text-decoration: none;

View File

@@ -5,7 +5,7 @@
display: flex;
flex-direction: row;
display: block;
color: map-get($theme-colours, "main-text-color");
color: map-get($theme-colours, 'main-text-color');
input[type=text] {
width: 140px;
@@ -14,7 +14,6 @@
font-size: calc(5px + 1.2vmin);
background: transparent;
border: none;
color: map-get($theme-colours, "main-text-color");
position: absolute;
background-color: rgba(0, 0, 0, 0.1);
-webkit-transition: width 0.5s ease-in-out;

View File

@@ -27,7 +27,7 @@
&:before {
position: absolute;
content: "";
content: '';
height: 26px;
width: 26px;
left: 4px;
@@ -49,13 +49,13 @@ input {
padding: 0.5rem 1rem;
box-sizing: border-box;
border-image-slice: 1;
border-image-source: map-get($theme-colours, "gradient");
border-image-source: map-get($theme-colours, 'gradient');
outline: none;
background: transparent;
}
&:checked+.slider {
background: map-get($theme-colours, "gradient");
background: map-get($theme-colours, 'gradient');
&:before {
-webkit-transform: translateX(26px);
@@ -152,7 +152,7 @@ li {
width: 25px;
height: 25px;
border-radius: 12px;
background: map-get($theme-colours, "gradient");
background: map-get($theme-colours, 'gradient');
cursor: pointer;
}
@@ -161,7 +161,7 @@ li {
height: 25px;
border-radius: 12px;
border: 0;
background: map-get($theme-colours, "gradient");
background: map-get($theme-colours, 'gradient');
cursor: pointer;
}
}
@@ -170,7 +170,7 @@ input[type=color] {
border-radius: 100%;
height: 30px;
width: 30px;
box-shadow: map-get($main-parts, "shadow");
box-shadow: map-get($main-parts, 'shadow');
border: none;
outline: none;
-webkit-appearance: none;
@@ -191,7 +191,7 @@ input[type=color]::-moz-color-swatch {
border-radius: 100%;
height: 30px;
width: 30px;
box-shadow: map-get($main-parts, "shadow");
box-shadow: map-get($main-parts, 'shadow');
border: none;
outline: none;
-webkit-appearance: none;

View File

@@ -1,5 +1,5 @@
.Toastify__toast-body {
color: #000 !important;
color: #000000 !important;
font-size: 16px !important;
padding: 15px 20px !important;
}
@@ -20,7 +20,7 @@
.Toastify__progress-bar--default {
height: 3px !important;
background: #000 !important;
background: #000000 !important;
}
.Toastify__toast-container {