Add hovers and fix some styles on Photos filters
This commit is contained in:
@@ -44,7 +44,7 @@
|
|||||||
@include bp (sm) {
|
@include bp (sm) {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 64px;
|
left: 64px;
|
||||||
top: 50%;
|
top: 52%;
|
||||||
transform: translateY(-50%);
|
transform: translateY(-50%);
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
}
|
}
|
||||||
@@ -54,8 +54,9 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
height: 72px;
|
||||||
margin: 20px 0;
|
margin: 20px 0;
|
||||||
padding: 20px 22px;
|
padding: 0 22px;
|
||||||
background: $color-primary-darker;
|
background: $color-primary-darker;
|
||||||
border-radius: 50vh;
|
border-radius: 50vh;
|
||||||
|
|
||||||
@@ -76,7 +77,7 @@
|
|||||||
color: #fff;
|
color: #fff;
|
||||||
|
|
||||||
@include bp (sm) {
|
@include bp (sm) {
|
||||||
margin: 0 16px;
|
margin: 0 2px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
img {
|
img {
|
||||||
@@ -90,7 +91,12 @@
|
|||||||
|
|
||||||
.select {
|
.select {
|
||||||
position: relative;
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 8px 16px;
|
||||||
font-weight: 900;
|
font-weight: 900;
|
||||||
|
border-radius: 100vh;
|
||||||
|
transition: background-color 0.2s;
|
||||||
|
|
||||||
select {
|
select {
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
@@ -101,6 +107,10 @@
|
|||||||
height: 100%;
|
height: 100%;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background-color: $color-primary-tertiary20;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -112,8 +122,8 @@
|
|||||||
|
|
||||||
@include bp (sm) {
|
@include bp (sm) {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
right: 64px;
|
|
||||||
top: 50%;
|
top: 50%;
|
||||||
|
right: 56px;
|
||||||
transform: translateY(-50%);
|
transform: translateY(-50%);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -129,6 +139,17 @@
|
|||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Reset link
|
||||||
|
.reset {
|
||||||
|
transition: color 0.3s;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
color: $color-tertiary;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Shuffle button
|
||||||
.shuffle {
|
.shuffle {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|||||||
Reference in New Issue
Block a user