LBRYCommunity/lbry-desktop
1
0
Fork 0
Code Issues 596 Pull requests 6 Projects Releases 238 Packages Wiki Activity

cleanup btn styles

Browse source
This commit is contained in:
Sean Yesmunt 2019-01-08 21:21:36 -05:00
parent d2fcd8cf1a
commit fcf8375496
2 changed files with 29 additions and 83 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

76
src/renderer/scss/component/_button.scss
View file

@ -1,9 +1,21 @@
.btn { .btn {
fill: currentColor; fill: currentColor;
position: relative; position: relative;
& svg { svg {
stroke-width: 1; stroke-width: 2;
width: 1.1rem;
height: 1.1rem;
position: relative;
top: 0.1rem;
}
.btn__label {
margin: 0;
}
svg + .btn__label {
margin-left: var(--spacing-vertical-small);
} }
} }
@ -75,6 +87,15 @@
.btn__label { .btn__label {
display: none; display: none;
} }
svg {
width: 3rem;
height: 3rem;
margin-right: 0;
position: relative;
top: 0.1rem;
}
} }
.btn--inverse { .btn--inverse {
@ -95,42 +116,18 @@
&:hover { &:hover {
background-color: $lbry-gray-1; background-color: $lbry-gray-1;
color: $lbry-black;
html[data-theme='dark'] & { html[data-theme='dark'] & {
background-color: rgba($lbry-white, 0.1); background-color: rgba($lbry-white, 0.1);
} }
} }
// TODO: Refactor to remove need for `!important` .btn__content {
svg {
.btn__label { color: $lbry-gray-4;
margin: 0 !important; }
} }
svg {
width: 1rem !important;
height: 1rem !important;
margin-right: var(--spacing-vertical-small);
position: relative;
top: 0.1rem;
}
// .btn__content {
// display: flex;
// svg {
// width: 1rem;
// height: 1rem;
// color: $lbry-gray-4;
// margin-right: var(--spacing-vertical-small);
// }
// .btn__label {
// line-height: 1rem;
// }
// }
} }
.btn--load-screen { .btn--load-screen {
@ -161,21 +158,6 @@
background-color: $lbry-teal-4; background-color: $lbry-teal-4;
} }
} }
// TODO: Refactor to remove need for `!important`
.btn__label {
margin: 0 !important;
}
svg {
width: 1rem !important;
height: 1rem !important;
margin-right: var(--spacing-vertical-small);
position: relative;
top: 0.1rem;
}
} }
.btn--uppercase { .btn--uppercase {

36
src/renderer/scss/component/_media.scss
View file

@ -5,13 +5,6 @@
display: flex; display: flex;
font-size: 1.5rem; font-size: 1.5rem;
.media__actions .btn__content {
svg {
width: 1.5rem;
height: 100%;
}
}
.media__info { .media__info {
margin-left: var(--spacing-vertical-large); margin-left: var(--spacing-vertical-large);
width: calc(100% - 20rem); width: calc(100% - 20rem);
@ -97,14 +90,6 @@
margin-bottom: var(--spacing-vertical-large); margin-bottom: var(--spacing-vertical-large);
} }
.media__actions .btn__content {
display: inline-flex;
.btn__label {
margin-left: var(--spacing-vertical-small);
}
}
.media__info { .media__info {
margin-left: var(--spacing-vertical-medium); margin-left: var(--spacing-vertical-medium);
width: calc(100% - 20rem); width: calc(100% - 20rem);
@ -200,27 +185,6 @@
&:not(:last-child) { &:not(:last-child) {
margin-right: var(--spacing-vertical-large); margin-right: var(--spacing-vertical-large);
} }
.btn__content {
display: inline-flex;
}
.btn__label {
margin-left: var(--spacing-vertical-small);
}
svg {
width: 1.5rem;
height: 1.5rem;
}
}
.btn--alt {
padding-top: 2px;
.btn__label {
padding-top: 1px;
}
} }
} }