web/cryptpad
Archived
5
0 Fork 0
Code Issues 1 Actions Releases Wiki Activity

develop a system for avoiding z-index problems

Browse Source
This commit is contained in:
ansuz committed 2017-09-13 17:43:17 +02:00
1 parent fbd4be6135
commit f039fc7ff5
10 files changed
+21 -21
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

customize.dist/src/less/cryptpad.less
+6 -6
View File
@@ -296,7 +296,7 @@ noscript {
left: 0;
bottom: 0;
right: 0;
z-index: 2;
z-index: 2; // noscriptContainer
#noscript {
width: 1000px;
display: flex;
@@ -341,7 +341,7 @@ noscript {
left: 0;
right: 0;
margin: auto;
z-index: 1;
z-index: 1; // #main, #main_other
font-size: medium;
@@ -607,7 +607,7 @@ noscript {
background: blue;
position: absolute;
left: 0;
z-index:1;
z-index:1; // .usage
&.normal {
background: @toolbar-green;
}
@@ -622,7 +622,7 @@ noscript {
position: relative;
color: black;
text-shadow: 1px 0 2px white, 0 1px 2px white, -1px 0 2px white, 0 -1px 2px white;
z-index: 2;
z-index: 2; // .usageText
font-size: @main-font-size;
font-weight: bold;
}
@@ -644,7 +644,7 @@ noscript {
bottom: 10vh;
opacity: 0.9;
box-sizing: border-box;
z-index: 10000;
z-index: 10000; // #uploadStatusContainer
display: none;
#uploadStatus {
width: 80vw;
@@ -674,7 +674,7 @@ noscript {
left: @upload_pad_v;
top: @upload_pad_h; bottom: @upload_pad_h;
background-color: rgba(0,0,255,0.3);
z-index: -1;
z-index: -1; // .progressContainer
}
.upCancel { text-align: center; }
.fa.cancel {
customize.dist/src/less/loading.less
+2 -2
View File
@@ -3,7 +3,7 @@
#loading {
position: fixed;
z-index: 9999999;
z-index: 10000000; // #loading
top: 0px;
bottom: 0px;
left: 0px;
@@ -35,7 +35,7 @@
}
#loadingTip {
position: fixed;
z-index: 99999;
z-index: 100000; // loading tip
top: 80%;
left: 0;
right: 0;
customize.dist/src/less/toolbar.less
+3 -3
View File
@@ -259,7 +259,7 @@ body .cryptpad-toolbar {
font: @toolbar-button-font;
width: 100%;
z-index: 9001;
z-index: 10000; // body, .cryptpad-toolbar
.cp-dropdown-container {
//height: 100%;
@@ -792,7 +792,7 @@ body .cryptpad-toolbar {
cursor: pointer;
}
.cryptpad-user-dropdown {
z-index: 10000;
z-index: 10000; // .cryptpad-user-dropdown
//margin-left: 20px;
height: 64px;
width: 64px;
@@ -915,7 +915,7 @@ body .cryptpad-toolbar {
background: @dropdown-bg;
display: flex;
flex-flow: column;
z-index:10000;
z-index:10000; // .drawer-content
color: black;
.fa {
font-size: 17px;
customize.dist/src/less2/include/alertify.less
+1 -1
View File
@@ -64,7 +64,7 @@
bottom: 0;
width: 100%;
height: 100%;
z-index: 99999; // alertify container
z-index: 100000; // alertify container
&.forefront {
z-index: @max-z-index; // alertify max forefront
}
customize.dist/src/less2/include/dropdown.less
+1 -1
View File
@@ -28,7 +28,7 @@
background-color: @colortheme_dropdown-bg;
min-width: 250px;
box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.2);
z-index: 1000;
z-index: 1000; //Z dropdown content
max-height: 300px;
overflow-y: auto;
font: @dropdown_font;
customize.dist/src/less2/include/fileupload.less
+2 -2
View File
@@ -10,7 +10,7 @@
bottom: 10vh;
opacity: 0.9;
box-sizing: border-box;
z-index: 1000000;
z-index: 1000000; //Z file upload table container
display: none;
#cp-fileupload-table {
width: 80vw;
@@ -40,7 +40,7 @@
left: @upload_pad_v;
top: @upload_pad_h; bottom: @upload_pad_h;
background-color: rgba(0,0,255,0.3);
z-index: -1;
z-index: -1; //Z file upload progress container
}
.cp-fileupload-table-cancel { text-align: center; }
.fa.cancel {
customize.dist/src/less2/include/infopages.less
+1 -1
View File
@@ -117,7 +117,7 @@
.infopages_topbar () {
.cp-topbar {
background: #fff;
z-index: 9001;
z-index: 10000; //Z infopage toolbar
position: fixed;
top: 0;
display: flex;
customize.dist/src/less2/include/modal.less
+1 -1
View File
@@ -20,7 +20,7 @@
.cp-modal-container {
display: none;
z-index: 100000;
z-index: 100000; //Z modal container
position: absolute;
top: 0;
bottom: 0;
customize.dist/src/less2/include/toolbar.less
+3 -3
View File
@@ -274,7 +274,7 @@
font: @toolbar_button-font;
width: 100%;
z-index: 9001;
z-index: 10000; // cp-toolbar
.cp-dropdown-container {
//height: 100%;
@@ -597,7 +597,7 @@
vertical-align: top;
}
.cp-toolbar-user-dropdown {
z-index: 10000;
z-index: 10000; //Z cp-toolbar-user-dropdown
//margin-left: 20px;
height: 64px;
width: 64px;
@@ -737,7 +737,7 @@
background: @colortheme_dropdown-bg;
display: flex;
flex-flow: column;
z-index:10000;
z-index:10000; //Z cp-toolbar-drawer-content
color: black;
.fa {
font-size: 17px;
www/common/tippy.css
+1 -1
View File
@@ -1 +1 @@
.tippy-touch{cursor:pointer!important}.tippy-notransition{transition:none!important}.tippy-popper{max-width:400px;-webkit-perspective:800px;perspective:800px;z-index:9999;outline:0;transition-timing-function:cubic-bezier(.165,.84,.44,1);pointer-events:none}.tippy-popper.html-template{max-width:96%;max-width:calc(100% - 20px)}.tippy-popper[x-placement^=top] [x-arrow]{border-top:7px solid #333;border-right:7px solid transparent;border-left:7px solid transparent;bottom:-7px;margin:0 9px}.tippy-popper[x-placement^=top] [x-arrow].arrow-small{border-top:5px solid #333;border-right:5px solid transparent;border-left:5px solid transparent;bottom:-5px}.tippy-popper[x-placement^=top] [x-arrow].arrow-big{border-top:10px solid #333;border-right:10px solid transparent;border-left:10px solid transparent;bottom:-10px}.tippy-popper[x-placement^=top] [x-circle]{-webkit-transform-origin:0 33%;transform-origin:0 33%}.tippy-popper[x-placement^=top] [x-circle].enter{-webkit-transform:scale(1) translate(-50%,-55%);transform:scale(1) translate(-50%,-55%);opacity:1}.tippy-popper[x-placement^=top] [x-circle].leave{-webkit-transform:scale(.15) translate(-50%,-50%);transform:scale(.15) translate(-50%,-50%);opacity:0}.tippy-popper[x-placement^=top] .tippy-tooltip.light-theme [x-circle]{background-color:#fff}.tippy-popper[x-placement^=top] .tippy-tooltip.light-theme [x-arrow]{border-top:7px solid #fff;border-right:7px solid transparent;border-left:7px solid transparent}.tippy-popper[x-placement^=top] .tippy-tooltip.light-theme [x-arrow].arrow-small{border-top:5px solid #fff;border-right:5px solid transparent;border-left:5px solid transparent}.tippy-popper[x-placement^=top] .tippy-tooltip.light-theme [x-arrow].arrow-big{border-top:10px solid #fff;border-right:10px solid transparent;border-left:10px solid transparent}.tippy-popper[x-placement^=top] .tippy-tooltip.transparent-theme [x-circle]{background-color:rgba(0,0,0,.7)}.tippy-popper[x-placement^=top] .tippy-tooltip.transparent-theme [x-arrow]{border-top:7px solid rgba(0,0,0,.7);border-right:7px solid transparent;border-left:7px solid transparent}.tippy-popper[x-placement^=top] .tippy-tooltip.transparent-theme [x-arrow].arrow-small{border-top:5px solid rgba(0,0,0,.7);border-right:5px solid transparent;border-left:5px solid transparent}.tippy-popper[x-placement^=top] .tippy-tooltip.transparent-theme [x-arrow].arrow-big{border-top:10px solid rgba(0,0,0,.7);border-right:10px solid transparent;border-left:10px solid transparent}.tippy-popper[x-placement^=top] [data-animation=perspective]{-webkit-transform-origin:bottom;transform-origin:bottom}.tippy-popper[x-placement^=top] [data-animation=perspective].enter{opacity:1;-webkit-transform:translateY(-10px) rotateX(0);transform:translateY(-10px) rotateX(0)}.tippy-popper[x-placement^=top] [data-animation=perspective].leave{opacity:0;-webkit-transform:translateY(0) rotateX(90deg);transform:translateY(0) rotateX(90deg)}.tippy-popper[x-placement^=top] [data-animation=fade].enter{opacity:1;-webkit-transform:translateY(-10px);transform:translateY(-10px)}.tippy-popper[x-placement^=top] [data-animation=fade].leave{opacity:0;-webkit-transform:translateY(-10px);transform:translateY(-10px)}.tippy-popper[x-placement^=top] [data-animation=shift].enter{opacity:1;-webkit-transform:translateY(-10px);transform:translateY(-10px)}.tippy-popper[x-placement^=top] [data-animation=shift].leave{opacity:0;-webkit-transform:translateY(0);transform:translateY(0)}.tippy-popper[x-placement^=top] [data-animation=scale].enter{opacity:1;-webkit-transform:translateY(-10px) scale(1);transform:translateY(-10px) scale(1)}.tippy-popper[x-placement^=top] [data-animation=scale].leave{opacity:0;-webkit-transform:translateY(0) scale(0);transform:translateY(0) scale(0)}.tippy-popper[x-placement^=bottom] [x-arrow]{border-bottom:7px solid #333;border-right:7px solid transparent;border-left:7px solid transparent;top:-7px;margin:0 9px}.tippy-popper[x-placement^=bottom] [x-arrow].arrow-small{border-bottom:5px solid #333;border-right:5px solid transparent;border-left:5px solid transparent;top:-5px}.tippy-popper[x-placement^=bottom] [x-arrow].arrow-big{border-bottom:10px solid #333;border-right:10px solid transparent;border-left:10px solid transparent;top:-10px}.tippy-popper[x-placement^=bottom] [x-circle]{-webkit-transform-origin:0 -50%;transform-origin:0 -50%}.tippy-popper[x-placement^=bottom] [x-circle].enter{-webkit-transform:scale(1) translate(-50%,-45%);transform:scale(1) translate(-50%,-45%);opacity:1}.tippy-popper[x-placement^=bottom] [x-circle].leave{-webkit-transform:scale(.15) translate(-50%,-5%);transform:scale(.15) translate(-50%,-5%);opacity:0}.tippy-popper[x-placement^=bottom] .tippy-tooltip.light-theme [x-circle]{background-color:#fff}.tippy-popper[x-placement^=bottom] .tippy-tooltip.light-theme [x-arrow]{border-bottom:7px solid #fff;border-right:7px solid transparent;border-left:7px solid transparent}.tippy-popper[x-placement^=bottom] .tippy-tooltip.light-theme [x-arrow].arLine truncated
.tippy-touch{cursor:pointer!important}.tippy-notransition{transition:none!important}.tippy-popper{max-width:400px;-webkit-perspective:800px;perspective:800px;z-index:10000000 !important;outline:0;transition-timing-function:cubic-bezier(.165,.84,.44,1);pointer-events:none}.tippy-popper.html-template{max-width:96%;max-width:calc(100% - 20px)}.tippy-popper[x-placement^=top] [x-arrow]{border-top:7px solid #333;border-right:7px solid transparent;border-left:7px solid transparent;bottom:-7px;margin:0 9px}.tippy-popper[x-placement^=top] [x-arrow].arrow-small{border-top:5px solid #333;border-right:5px solid transparent;border-left:5px solid transparent;bottom:-5px}.tippy-popper[x-placement^=top] [x-arrow].arrow-big{border-top:10px solid #333;border-right:10px solid transparent;border-left:10px solid transparent;bottom:-10px}.tippy-popper[x-placement^=top] [x-circle]{-webkit-transform-origin:0 33%;transform-origin:0 33%}.tippy-popper[x-placement^=top] [x-circle].enter{-webkit-transform:scale(1) translate(-50%,-55%);transform:scale(1) translate(-50%,-55%);opacity:1}.tippy-popper[x-placement^=top] [x-circle].leave{-webkit-transform:scale(.15) translate(-50%,-50%);transform:scale(.15) translate(-50%,-50%);opacity:0}.tippy-popper[x-placement^=top] .tippy-tooltip.light-theme [x-circle]{background-color:#fff}.tippy-popper[x-placement^=top] .tippy-tooltip.light-theme [x-arrow]{border-top:7px solid #fff;border-right:7px solid transparent;border-left:7px solid transparent}.tippy-popper[x-placement^=top] .tippy-tooltip.light-theme [x-arrow].arrow-small{border-top:5px solid #fff;border-right:5px solid transparent;border-left:5px solid transparent}.tippy-popper[x-placement^=top] .tippy-tooltip.light-theme [x-arrow].arrow-big{border-top:10px solid #fff;border-right:10px solid transparent;border-left:10px solid transparent}.tippy-popper[x-placement^=top] .tippy-tooltip.transparent-theme [x-circle]{background-color:rgba(0,0,0,.7)}.tippy-popper[x-placement^=top] .tippy-tooltip.transparent-theme [x-arrow]{border-top:7px solid rgba(0,0,0,.7);border-right:7px solid transparent;border-left:7px solid transparent}.tippy-popper[x-placement^=top] .tippy-tooltip.transparent-theme [x-arrow].arrow-small{border-top:5px solid rgba(0,0,0,.7);border-right:5px solid transparent;border-left:5px solid transparent}.tippy-popper[x-placement^=top] .tippy-tooltip.transparent-theme [x-arrow].arrow-big{border-top:10px solid rgba(0,0,0,.7);border-right:10px solid transparent;border-left:10px solid transparent}.tippy-popper[x-placement^=top] [data-animation=perspective]{-webkit-transform-origin:bottom;transform-origin:bottom}.tippy-popper[x-placement^=top] [data-animation=perspective].enter{opacity:1;-webkit-transform:translateY(-10px) rotateX(0);transform:translateY(-10px) rotateX(0)}.tippy-popper[x-placement^=top] [data-animation=perspective].leave{opacity:0;-webkit-transform:translateY(0) rotateX(90deg);transform:translateY(0) rotateX(90deg)}.tippy-popper[x-placement^=top] [data-animation=fade].enter{opacity:1;-webkit-transform:translateY(-10px);transform:translateY(-10px)}.tippy-popper[x-placement^=top] [data-animation=fade].leave{opacity:0;-webkit-transform:translateY(-10px);transform:translateY(-10px)}.tippy-popper[x-placement^=top] [data-animation=shift].enter{opacity:1;-webkit-transform:translateY(-10px);transform:translateY(-10px)}.tippy-popper[x-placement^=top] [data-animation=shift].leave{opacity:0;-webkit-transform:translateY(0);transform:translateY(0)}.tippy-popper[x-placement^=top] [data-animation=scale].enter{opacity:1;-webkit-transform:translateY(-10px) scale(1);transform:translateY(-10px) scale(1)}.tippy-popper[x-placement^=top] [data-animation=scale].leave{opacity:0;-webkit-transform:translateY(0) scale(0);transform:translateY(0) scale(0)}.tippy-popper[x-placement^=bottom] [x-arrow]{border-bottom:7px solid #333;border-right:7px solid transparent;border-left:7px solid transparent;top:-7px;margin:0 9px}.tippy-popper[x-placement^=bottom] [x-arrow].arrow-small{border-bottom:5px solid #333;border-right:5px solid transparent;border-left:5px solid transparent;top:-5px}.tippy-popper[x-placement^=bottom] [x-arrow].arrow-big{border-bottom:10px solid #333;border-right:10px solid transparent;border-left:10px solid transparent;top:-10px}.tippy-popper[x-placement^=bottom] [x-circle]{-webkit-transform-origin:0 -50%;transform-origin:0 -50%}.tippy-popper[x-placement^=bottom] [x-circle].enter{-webkit-transform:scale(1) translate(-50%,-45%);transform:scale(1) translate(-50%,-45%);opacity:1}.tippy-popper[x-placement^=bottom] [x-circle].leave{-webkit-transform:scale(.15) translate(-50%,-5%);transform:scale(.15) translate(-50%,-5%);opacity:0}.tippy-popper[x-placement^=bottom] .tippy-tooltip.light-theme [x-circle]{background-color:#fff}.tippy-popper[x-placement^=bottom] .tippy-tooltip.light-theme [x-arrow]{border-bottom:7px solid #fff;border-right:7px solid transparent;border-left:7px solid transparent}.tippy-popper[x-placement^=bottom] .tippy-tooltip.light-theLine truncated