bitwarden/browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser synced 2025-12-16 08:13:42 +00:00
Code Issues Releases Wiki Activity

feedback updates

Browse Source
This commit is contained in:
DanHillesheim
2022-10-20 16:33:29 -06:00
parent 1259cd0e31
commit 4d4b10f92f
7 changed files with 57 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
apps/browser/src/popup/components/set-pin.component.html
View File

@@ -7,7 +7,7 @@
</div>
<div class="box">
<div class="box-content">
<div class="box-content-row box-content-row-flex" appBoxRow>
<div class="box-content-row box-content-row-flex no-hover no-bg" appBoxRow>
<div class="row-main">
<label for="pin">{{ "pin" | i18n }}</label>
<input

68
apps/browser/src/popup/scss/box.scss
View File

@@ -3,7 +3,7 @@
.box {
position: relative;
width: 100%;
margin: 10px 0 20px;
margin: 10px 0 20px 0;
&.first {
margin-top: 0;
@@ -20,13 +20,14 @@
}
.box-header-expandable {
padding: 0 10px;
margin-bottom: 5px;
padding: 10px;
margin: 10px;
text-transform: uppercase;
display: flex;
width: 100%;
width: calc(100% - 20px);
box-sizing: border-box;
align-items: center;
border-radius: $border-radius;
@include themify($themes) {
color: themed("headingColor");
@@ -36,7 +37,7 @@
&:focus-visible,
&.active {
@include themify($themes) {
background-color: themed("backgroundColor");
background-color: themed("boxBackgroundHoverColor");
}
}
@@ -74,7 +75,9 @@
.box-content-row.no-hover {
&:hover,
&:focus {
background-color: initial !important;
@include themify($themes) {
background-color: themed("boxBackgroundColor") !important;
}
}
}
}
@@ -93,9 +96,9 @@
.box-content-row {
padding: 10px;
text-decoration: none;
border-radius: 6px;
border-radius: $border-radius;
margin: 10px;
background-color: $background-color;
// background-color: $background-color;
@include themify($themes) {
color: themed("textColor");
@@ -107,6 +110,14 @@
padding-bottom: 10px;
}
&.no-hover {
&:hover {
@include themify($themes) {
background-color: themed("boxBackgroundColor") !important;
}
}
}
&:hover,
&:focus,
&.active {
@@ -155,7 +166,7 @@
padding-top: 10px;
padding-bottom: 10px;
margin: 10px;
border-radius: 6px;
border-radius: $border-radius;
}
}
}
@@ -197,27 +208,16 @@
padding: 10px 15px;
position: relative;
z-index: 1;
background-color: $background-color;
border-radius: 6px;
border-radius: $border-radius;
margin: 10px;
@include themify($themes) {
background-color: themed("boxBackgroundColor");
}
// &:before {
// content: "";
// position: absolute;
// right: 0;
// bottom: 0;
// height: 1px;
// width: calc(100% - 10px);
// border-bottom: 1px solid #000000;
// @include themify($themes) {
// border-bottom-color: themed("boxBorderColor");
// }
// }
&.no-bg {
background-color: rgba(0, 0, 0, 0) !important;
}
&:last-child {
&:before {
@@ -339,7 +339,7 @@
}
&.box-content-row-multi {
width: 100%;
width: calc(100% - 20px);
input:not([type="checkbox"]) {
width: 100%;
@@ -462,7 +462,7 @@
select {
width: 100%;
border: 1px solid #000000;
border-radius: 6px;
border-radius: $border-radius;
padding: 7px 4px;
@include themify($themes) {
@@ -720,3 +720,19 @@
overflow: hidden;
text-overflow: ellipsis;
}
form {
.box {
.box-content {
.box-content-row {
&.no-hover {
&:hover {
@include themify($themes) {
background-color: rgba(0, 0, 0, 0) !important;
}
}
}
}
}
}
}

1
apps/browser/src/popup/scss/buttons.scss
View File

@@ -89,7 +89,6 @@
button.box-content-row {
display: block;
// width: 100%;
width: calc(100% - 20px);
text-align: left;

2
apps/browser/src/popup/scss/misc.scss
View File

@@ -132,7 +132,7 @@ p.lead {
}
.img-rounded {
border-radius: 6px;
border-radius: $border-radius;
}
.sr-only {

19
apps/browser/src/popup/scss/pages.scss
View File

@@ -9,13 +9,13 @@ app-sync {
}
app-generator .generated-block {
font-size: $font-size-xlarge;
font-size: $font-size-large;
font-family: $font-family-monospace;
margin: 10px;
padding: 10px;
display: flex;
background-color: $box-background-color;
border-radius: 6px;
// background-color: $box-background-color;
border-radius: $border-radius;
@include themify($themes) {
background-color: themed("boxBackgroundColor");
@@ -27,8 +27,8 @@ app-generator .generated-block {
min-width: 0;
white-space: pre-wrap;
word-break: break-all;
padding: 15px 30px;
border-radius: 6px;
padding: 15px;
border-radius: $border-radius;
background-color: #e6e9ed;
border: 1px solid;
border-color: #d2d9e6;
@@ -47,14 +47,13 @@ app-generator .generated-block {
margin-left: 10px;
button {
padding: 5px;
margin: 0;
padding: 6px;
margin: 2px;
border-radius: $border-radius;
&:hover {
color: $brand-primary;
@include themify($themes) {
color: $icon-hover-color;
background-color: darken($icon-hover-color, 50%);
}
}
}

6
apps/browser/src/popup/scss/variables.scss
View File

@@ -15,7 +15,7 @@ $border-color-dark: #ddd;
$list-item-hover: #fbfbfb;
$list-icon-color: #767679;
$disabled-box-opacity: 1;
$border-radius: 3px;
$border-radius: 6px;
$line-height-base: 1.42857143;
$icon-hover-color: lighten($text-color, 50%);
@@ -220,8 +220,8 @@ $themes: (
backgroundColorAlt: $solarizedDarkBase02,
scrollbarColor: $solarizedDarkBase0,
scrollbarHoverColor: $solarizedDarkBase2,
boxBackgroundColor: $solarizedDarkBase03,
boxBackgroundHoverColor: $solarizedDarkBase02,
boxBackgroundColor: $solarizedDarkBase02,
boxBackgroundHoverColor: lighten($solarizedDarkBase02, 5%),
boxBorderColor: $solarizedDarkBase02,
tabBackgroundColor: $solarizedDarkBase02,
tabBackgroundHoverColor: $solarizedDarkBase01,

2
apps/browser/src/popup/vault/current-tab.component.html
View File

@@ -41,7 +41,7 @@
{{ "typeLogins" | i18n }}
<span class="flex-right">{{ loginCiphers.length }}</span>
</h2>
<div class="box-content">
<div class="box-content no-hover">
<app-cipher-row
*ngFor="let loginCipher of loginCiphers"
[cipher]="loginCipher"