mirror of https://github.com/FreeTubeApp/FreeTube
Make certain controls non-selectable / non-draggable (#3947)
* Make settings heading text unselectable I often encounter the issue of accidentally selecting/highlighting the settings heading text, which ends up highlighting all of the text inside of that settings tab. This is an unpleasant appearance that I have to click to remove. This change removes this issue altogether. * Switch all instances of user-select to be only user-select and -webkit-user-select * Make side-nav labels unselectable * Make side-nav and channels un-draggable * Remove selection from ft-flex-box, ft-input placeholders, and profile icons
This commit is contained in:
parent
08f8b2768a
commit
665da2c1c3
|
@ -26,6 +26,8 @@
|
||||||
|
|
||||||
.flexBox {
|
.flexBox {
|
||||||
display: block;
|
display: block;
|
||||||
|
user-select: all;
|
||||||
|
-webkit-user-select: all;
|
||||||
}
|
}
|
||||||
|
|
||||||
#changeLogText {
|
#changeLogText {
|
||||||
|
|
|
@ -2,4 +2,6 @@
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-flow: row wrap;
|
flex-flow: row wrap;
|
||||||
justify-content: space-evenly;
|
justify-content: space-evenly;
|
||||||
|
user-select: none;
|
||||||
|
-webkit-user-select: none;
|
||||||
}
|
}
|
||||||
|
|
|
@ -3,6 +3,8 @@
|
||||||
flex-flow: row wrap;
|
flex-flow: row wrap;
|
||||||
justify-content: space-evenly;
|
justify-content: space-evenly;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
|
-webkit-user-select: none;
|
||||||
user-select: none;
|
user-select: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -84,6 +86,7 @@
|
||||||
list-style-type: none;
|
list-style-type: none;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
-webkit-user-select: none;
|
||||||
user-select: none;
|
user-select: none;
|
||||||
z-index: 3;
|
z-index: 3;
|
||||||
|
|
||||||
|
|
|
@ -97,6 +97,8 @@
|
||||||
|
|
||||||
.ft-input-component ::-webkit-input-placeholder {
|
.ft-input-component ::-webkit-input-placeholder {
|
||||||
color: var(--tertiary-text-color);
|
color: var(--tertiary-text-color);
|
||||||
|
user-select: none;
|
||||||
|
-webkit-user-select: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.forceTextColor .ft-input {
|
.forceTextColor .ft-input {
|
||||||
|
|
|
@ -29,6 +29,8 @@
|
||||||
line-height: 1em;
|
line-height: 1em;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
padding: 17.5px 0;
|
padding: 17.5px 0;
|
||||||
|
user-select: none;
|
||||||
|
-webkit-user-select: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.profileName {
|
.profileName {
|
||||||
|
|
|
@ -36,6 +36,8 @@
|
||||||
line-height: 1em;
|
line-height: 1em;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
padding: 25px 0;
|
padding: 25px 0;
|
||||||
|
user-select: none;
|
||||||
|
-webkit-user-select: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media only screen and (max-width: 680px) {
|
@media only screen and (max-width: 680px) {
|
||||||
|
|
|
@ -17,6 +17,8 @@
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
line-height: 1em;
|
line-height: 1em;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
user-select: none;
|
||||||
|
-webkit-user-select: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.profileList {
|
.profileList {
|
||||||
|
|
|
@ -19,6 +19,7 @@ pure-checkbox input[type="checkbox"], .pure-radiobutton input[type="checkbox"],
|
||||||
position: relative;
|
position: relative;
|
||||||
padding-left: 2em;
|
padding-left: 2em;
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
|
-webkit-user-select: none;
|
||||||
user-select: none;
|
user-select: none;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
display: block;
|
display: block;
|
||||||
|
|
|
@ -39,6 +39,8 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.sectionTitle {
|
.sectionTitle {
|
||||||
|
-webkit-user-select: none;
|
||||||
|
user-select: none;
|
||||||
margin-left: 2%;
|
margin-left: 2%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -12,6 +12,8 @@
|
||||||
transition-property: width;
|
transition-property: width;
|
||||||
transition-duration: 150ms;
|
transition-duration: 150ms;
|
||||||
transition-timing-function: ease-in-out;
|
transition-timing-function: ease-in-out;
|
||||||
|
user-select: none;
|
||||||
|
-webkit-user-select: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.inner {
|
.inner {
|
||||||
|
@ -41,6 +43,7 @@
|
||||||
position: relative;
|
position: relative;
|
||||||
padding: 5px;
|
padding: 5px;
|
||||||
min-height: 35px;
|
min-height: 35px;
|
||||||
|
-webkit-user-drag: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.moreOption {
|
.moreOption {
|
||||||
|
|
|
@ -61,6 +61,7 @@
|
||||||
color: gray;
|
color: gray;
|
||||||
opacity: 0.5;
|
opacity: 0.5;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
|
-webkit-user-select: none;
|
||||||
user-select: none;
|
user-select: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1090,17 +1090,10 @@ body.vjs-full-window {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
margin: 0 0.45em 0 0.45em;
|
margin: 0 0.45em 0 0.45em;
|
||||||
/* iOS Safari */
|
|
||||||
-webkit-touch-callout: none;
|
|
||||||
/* Safari */
|
|
||||||
-webkit-user-select: none;
|
-webkit-user-select: none;
|
||||||
/* Konqueror HTML */
|
|
||||||
/* Firefox */
|
|
||||||
-moz-user-select: none;
|
|
||||||
/* Internet Explorer/Edge */
|
|
||||||
-ms-user-select: none;
|
|
||||||
/* Non-prefixed version, currently supported by Chrome and Opera */
|
|
||||||
user-select: none;
|
user-select: none;
|
||||||
|
|
||||||
background-color: #73859f;
|
background-color: #73859f;
|
||||||
background-color: rgba(115, 133, 159, 0.5);
|
background-color: rgba(115, 133, 159, 0.5);
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue