JakeHillion/storj
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

web/satellite: text selection on specific elements disabled (#3424)

Browse Source
This commit is contained in:
Vitalii Shpital 2019-11-01 18:00:28 +02:00 committed by GitHub
parent 43c2b72911
commit a59d07d4dc
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
22 changed files with 65 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
web/satellite/src/components/account/AccountArea.vue
View File

@ -37,6 +37,7 @@ export default class AccountArea extends Vue {}
color: #354049;
margin-block-start: 0.5em;
margin-block-end: 0.5em;
user-select: none;
}
}

1
web/satellite/src/components/apiKeys/ApiKeysArea.vue
View File

@ -353,6 +353,7 @@ export default class ApiKeysArea extends Vue {
font-size: 32px;
line-height: 39px;
margin: 0;
user-select: none;
}
.api-keys-header {

13
web/satellite/src/components/apiKeys/ApiKeysCopyPopup.vue
View File

@ -77,6 +77,7 @@ export default class ApiKeysCopyPopup extends Vue {
font-size: 24px;
line-height: 29px;
margin-bottom: 26px;
user-select: none;
}
&__copy-area {
@ -130,19 +131,22 @@ export default class ApiKeysCopyPopup extends Vue {
.copied-button {
padding: 13px 28.5px;
background-color: #196cda;
cursor: default;
border: 1px solid #196cda;
}
.copy-button {
cursor: pointer;
background-color: #2683ff;
border: 1px solid #2683ff;
}
.copy-button,
.copied-button {
display: flex;
background-color: #2683ff;
padding: 13px 36px;
cursor: pointer;
align-items: center;
justify-content: space-between;
color: #fff;
border: 1px solid #2683ff;
box-sizing: border-box;
border-radius: 8px;
font-size: 14px;
@ -151,6 +155,7 @@ export default class ApiKeysCopyPopup extends Vue {
&__label {
margin: 0;
user-select: none;
}
&:hover {

1
web/satellite/src/components/apiKeys/ApiKeysCreationPopup.vue
View File

@ -122,6 +122,7 @@ export default class ApiKeysCreationPopup extends Vue {
font-size: 24px;
line-height: 29px;
margin-bottom: 26px;
user-select: none;
}
.next-button {

1
web/satellite/src/components/apiKeys/SortingHeader.vue
View File

@ -86,6 +86,7 @@ export default class SortApiKeysHeader extends Vue {
height: 40px;
background-color: rgba(255, 255, 255, 0.3);
margin-top: 31px;
user-select: none;
&__date-item {
width: 60%;

1
web/satellite/src/components/buckets/BucketArea.vue
View File

@ -184,6 +184,7 @@ export default class BucketArea extends Vue {
margin-right: 50px;
margin-block-start: 0;
margin-block-end: 0;
user-select: none;
}
}

1
web/satellite/src/components/buckets/SortingHeader.vue
View File

@ -32,6 +32,7 @@ export default class SortBucketsHeader extends Vue {}
opacity: 0.5;
max-height: 40px;
align-items: center;
user-select: none;
&__item {
width: 25%;

1
web/satellite/src/components/common/EmptyStateArea.vue
View File

@ -84,6 +84,7 @@ export default class EmptyStateProjectArea extends Vue {
margin-bottom: 15px;
min-width: 900px;
color: #354049;
user-select: none;
}
}
}

1
web/satellite/src/components/common/HeaderedInput.vue
View File

@ -90,6 +90,7 @@ export default class HeaderedInput extends HeaderlessInput {
font-size: 16px;
line-height: 21px;
color: #354049;
user-select: none;
}
&__error {

1
web/satellite/src/components/common/PagesBlock.vue
View File

@ -29,6 +29,7 @@ export default class PagesBlock extends Vue {
<style scoped lang="scss">
.pages-container {
display: flex;
user-select: none;
&__pages {
font-family: 'font_medium', sans-serif;

1
web/satellite/src/components/common/RegistrationSuccessPopup.vue
View File

@ -126,6 +126,7 @@ export default class RegistrationSuccessPopup extends Vue {
line-height: 39px;
color: #384b65;
margin: 0;
user-select: none;
}
&__text {

57
web/satellite/src/components/common/VButton.vue
View File

@ -7,7 +7,7 @@
:class="containerClassName"
:style="style"
@click="onPress">
<h1 class="label" :class="{'white': isWhite}">{{label}}</h1>
<h1 class="label">{{label}}</h1>
</div>
</template>
@ -49,6 +49,25 @@ export default class VButton extends Vue {
</script>
<style scoped lang="scss">
.white,
.red {
background-color: transparent !important;
border: 1px solid #afb7c1 !important;
.label {
color: #354049 !important;
}
}
.disabled {
background-color: #dadde5 !important;
border-color: #dadde5 !important;
.label {
color: #acb0bc !important;
}
}
.container {
display: flex;
align-items: center;
@ -56,6 +75,7 @@ export default class VButton extends Vue {
background-color: #2683ff;
border-radius: 6px;
cursor: pointer;
user-select: none;
.label {
font-family: 'font_medium', sans-serif;
@ -64,49 +84,30 @@ export default class VButton extends Vue {
color: #fff;
}
.white,
.red {
background-color: transparent;
border: 1px solid #afb7c1;
.label {
color: #354049;
}
}
.disabled {
background-color: #dadde5;
border-color: #dadde5;
.label {
color: #acb0bc;
}
}
&:hover {
box-shadow: 0 4px 20px rgba(35, 121, 236, 0.4);
&.white {
box-shadow: none;
background-color: #2683ff;
border: 1px solid #2683ff;
box-shadow: none !important;
background-color: #2683ff !important;
border: 1px solid #2683ff !important;
.label {
color: white;
color: white !important;
}
}
&.red {
box-shadow: none;
background-color: transparent;
box-shadow: none !important;
background-color: transparent !important;
.label {
color: #eb5757;
color: #eb5757 !important;
}
}
&.disabled {
box-shadow: none;
box-shadow: none !important;
background-color: #dadde5 !important;
.label {

1
web/satellite/src/components/common/VDatePicker.vue
View File

@ -268,6 +268,7 @@ export default class VDatePicker extends Vue {
top: 0;
left: 0;
overflow: hidden;
user-select: none;
-webkit-animation: fadein 0.5s;
/* Safari, Chrome and Opera > 12.1 */

1
web/satellite/src/components/header/headerArea.scss
View File

@ -11,6 +11,7 @@
justify-content: space-between;
padding: 0 55px;
position: relative;
user-select: none;
&__left-area,
&__right-area {

1
web/satellite/src/components/navigation/TabNavigation.vue
View File

@ -30,6 +30,7 @@ export default class TabNavigation extends Vue {
width: auto;
display: flex;
border-bottom: 1px solid #afb7c1;
user-select: none;
&__item {
width: 150px;

1
web/satellite/src/components/navigation/navigationArea.scss
View File

@ -18,6 +18,7 @@ a {
flex-direction: column;
justify-content: space-between;
font-family: 'font_regular', sans-serif;
user-select: none;
&__logo {
display: flex;

3
web/satellite/src/components/project/ProjectDetails.vue
View File

@ -161,6 +161,7 @@ export default class ProjectDetailsArea extends Vue {
font-size: 24px;
line-height: 29px;
color: #354049;
user-select: none;
}
&__button-area {
@ -192,6 +193,7 @@ export default class ProjectDetailsArea extends Vue {
font-size: 16px;
line-height: 21px;
color: rgba(56, 75, 101, 0.4);
user-select: none;
}
&__project-name {
@ -224,6 +226,7 @@ export default class ProjectDetailsArea extends Vue {
font-size: 16px;
line-height: 21px;
color: rgba(56, 75, 101, 0.4);
user-select: none;
}
&__project-description {

6
web/satellite/src/components/project/UsageReport.vue
View File

@ -22,7 +22,7 @@
/>
<DatePickerIcon
class="usage-report-container__options-area__option__image"
@click.prevent.self="onCustomDateClick"
@click.prevent="onCustomDateClick"
/>
</div>
</div>
@ -259,6 +259,7 @@ export default class UsageReport extends Vue {
color: #354049;
margin-block-start: 0.5em;
margin-block-end: 0.5em;
user-select: none;
}
}
@ -288,6 +289,7 @@ export default class UsageReport extends Vue {
font-size: 16px;
line-height: 23px;
color: #354049;
user-select: none;
}
&__image {
@ -347,6 +349,7 @@ export default class UsageReport extends Vue {
color: #354049;
margin-block-start: 0;
margin-block-end: 0;
user-select: none;
}
&__amount {
@ -397,6 +400,7 @@ export default class UsageReport extends Vue {
line-height: 21px;
color: #354049;
margin-right: 30px;
user-select: none;
}
&__image {

2
web/satellite/src/components/team/AddUserPopup.vue
View File

@ -372,6 +372,7 @@ export default class AddUserPopup extends Vue {
color: #384b65;
margin-top: 0;
width: 107%;
user-select: none;
}
}
@ -449,6 +450,7 @@ export default class AddUserPopup extends Vue {
font-size: 16px;
line-height: 25px;
padding-left: 50px;
user-select: none;
}
&__button-container {

1
web/satellite/src/components/team/HeaderArea.vue
View File

@ -175,6 +175,7 @@ export default class HeaderArea extends Vue {
font-size: 32px;
line-height: 39px;
margin: 0;
user-select: none;
}
}

1
web/satellite/src/components/team/SortingListHeader.vue
View File

@ -97,6 +97,7 @@ export default class SortingListHeader extends Vue {
height: 40px;
background-color: rgba(255, 255, 255, 0.3);
margin-top: 31px;
user-select: none;
&__name-container,
&__added-container,

2
web/satellite/tests/unit/common/__snapshots__/VButton.spec.ts.snap
View File

@ -14,6 +14,6 @@ exports[`Button.vue renders correctly with isDisabled prop 1`] = `
exports[`Button.vue renders correctly with isWhite prop 1`] = `
<div class="container white" style="width: inherit; height: inherit;">
<h1 class="label white">Default</h1>
<h1 class="label">Default</h1>
</div>
`;