Dropdown style

main
Bob Mottram 2020-06-25 21:01:18 +01:00
parent fc3b153d38
commit c829bb3638
2 changed files with 18 additions and 109 deletions

View File

@ -690,19 +690,8 @@ a, button, input:focus, input[type='button'], input[type='reset'], input[type='s
font-size:2rem;
letter-spacing:1px;
outline:none;
box-shadow: 20px 38px 34px -26px hsla(0,0%,0%,.2);
border-radius: 255px 15px 225px 15px/15px 225px 15px 255px;
border-top-left-radius: 255px 15px;
border-top-right-radius: 15px 225px;
border-bottom-right-radius: 225px 15px;
border-bottom-left-radius:15px 255px;
}
.button-msgScope button:hover {
box-shadow:2px 8px 4px -6px hsla(0,0%,0%,.3);
}
.btn {
background: #fff;
border: 1px solid #BEE7ED;
margin: -3px 0 0 0;
}
@ -710,16 +699,6 @@ aside .toggle-msgScope input[type='checkbox'] {
float: right;
}
aside .toggle-inside li {
padding-left: 20px;
border-bottom: 1px solid #EEEDEE;
border-left: 5px solid rgba(101, 110, 127, 0.34);
width: 100%;
margin-left: -15px;
overflow: hidden;
box-shadow: 0 1px 1px #F0F1F3;
}
.dropdown-menutoggle {
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
@ -729,24 +708,20 @@ aside .toggle-inside li {
position: absolute;
top: 100%;
left: 21px;
width: 300%;
min-width: 100%;
z-index: 1000;
display: block;
float: left;
min-width: 169px;
padding: 0 17px !important;
margin: 2px 0 0 !important;
font-size: 14px;
font-size: var(--font-size2);
text-align: left;
list-style: none;
color: var(--dropdown-fg-color);
background-color: var(--dropdown-bg-color);
-webkit-background-clip: padding-box;
background-clip: padding-box;
border: 1px solid #ccc;
border: 1px solid rgba(0, 0, 0, .15);
border-radius: 4px;
-webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175) !important;
box-shadow: 0 6px 12px rgba(0, 0, 0, .175) !important;
}
.dropdown-menutoggle a {
@ -761,6 +736,11 @@ aside .toggle-inside li {
line-height: 2rem;
font-size: 2.5rem;
}
.toggle-msgScope img {
width: 32px;
height: 32px;
padding: 0px 0px;
}
.toggle-msgScope div[class*='toggle-inside'] {
/* margin: -22px 0 13px 0;*/
overflow: hidden;
@ -772,40 +752,26 @@ aside .toggle-msgScope input[type='checkbox'] {
}
aside .toggle-inside li {
padding-left: 20px;
border-bottom: 1px solid #EEEDEE;
border-left: 5px solid rgba(101, 110, 127, 0.34);
width: 100%;
margin-left: -15px;
overflow: hidden;
box-shadow: 0 1px 1px #F0F1F3;
}
.nav li {
border-top: 0 solid #fff !important;
.nav li:hover {
color: var(--dropdown-fg-color-hover);
background-color: var(--dropdown-bg-color-hover);
}
.nav .toggle-msgScope {
overflow: visible;
}
footer .msgscope {
height: 6rem;
}
#msgscope label div {
color: #fff !important;
-webkit-transition: all 0.1s ease-in-out;
-moz-transition: all 0.1s ease-in-out;
-ms-transition: all 0.1s ease-in-out;
-o-transition: all 0.1s ease-in-out;
transition: all 0.1s ease-in-out;
/*width: 170px;*/
padding: 15px;
margin: 0 auto;
border: 1px solid #ccc;
/*border-radius: 33px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
border-radius: 4px;*/
font-size: 1.5rem;
padding: 10px 10px 10px 10px;
text-decoration: none;
display: inline-block;
font-weight: bold;
@ -818,8 +784,7 @@ footer .msgscope {
cursor: pointer;
background-image: none;
white-space: nowrap;
padding: 6px 12px;
font-size: 14px;
font-size: 0px;
line-height: 1.42857143;
-webkit-user-select: none;
-moz-user-select: none;
@ -827,29 +792,6 @@ footer .msgscope {
user-select: none;
margin-top: 10px;
}
#msgscope ul .divider {
height: 1px;
margin: 9px 0;
overflow: hidden;
background-color: #e5e5e5;
}
#msgscope label div:active {
background-color: #CE1119;
outline: 0;
background-image: none;
-webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
border-color: #adadad;
background-image: none;
}
#msgscope label div:active:focus {
outline: thin dotted;
outline: 5px auto -webkit-focus-ring-color;
outline-offset: -2px;
}
#msgscope label div:focus {
background-color: #e6e6e6;
}
[id*='toggle'] .container, [class*='toggle'] .container {
transition: margin 300ms cubic-bezier(0.17, 0.04, 0.03, 0.94);
}
@ -881,23 +823,14 @@ footer .msgscope {
float: left;
}
#msgscope label div {
color: #fff !important;
-webkit-transition: all 0.1s ease-in-out;
-moz-transition: all 0.1s ease-in-out;
-ms-transition: all 0.1s ease-in-out;
-o-transition: all 0.1s ease-in-out;
transition: all 0.1s ease-in-out;
/*width: 170px;*/
padding: 15px;
margin: 0 auto;
border: 1px solid #ccc;
/*border-radius: 33px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
border-radius: 4px;*/
font-size: 1.5rem;
padding: 10px 10px 10px 10px;
text-decoration: none;
display: inline-block;
font-weight: bold;
@ -906,13 +839,12 @@ footer .msgscope {
background-color: #e85c41;
display: inline-block;
margin-bottom: 0;
text-align: center;
text-align: left;
vertical-align: middle;
cursor: pointer;
background-image: none;
white-space: nowrap;
padding: 6px 12px;
font-size: 14px;
font-size: 0px;
line-height: 1.42857143;
-webkit-user-select: none;
-moz-user-select: none;
@ -920,29 +852,6 @@ footer .msgscope {
user-select: none;
margin-top: 10px;
}
#msgscope ul .divider {
height: 1px;
margin: 9px 0;
overflow: hidden;
background-color: #e5e5e5;
}
#msgscope label div:active {
background-color: #CE1119;
outline: 0;
background-image: none;
-webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
border-color: #adadad;
background-image: none;
}
#msgscope label div:active:focus {
outline: thin dotted;
outline: 5px auto -webkit-focus-ring-color;
outline-offset: -2px;
}
#msgscope label div:focus {
background-color: #e6e6e6;
}
[id*='toggle'] .container, [class*='toggle'] .container {
transition: margin 300ms cubic-bezier(0.17, 0.04, 0.03, 0.94);
}

View File

@ -1968,10 +1968,10 @@ def htmlNewPost(mediaInstance: bool, translate: {},
dropdownDMSuffix += '?mention=' + mentionedActor
dropdownReportSuffix += '?mention=' + mentionedActor
dropDownContent = \
'<img loading="lazy" alt="" title="" src="/' + iconsDir + \
'/' + scopeIcon + '"/><b class="scope-desc">' + \
scopeDescription + '</b>'
# dropDownContent = \
# '<img loading="lazy" alt="" title="" src="/' + iconsDir + \
# '/' + scopeIcon + '"/><b class="scope-desc">' + \
# scopeDescription + '</b>'
if not reportUrl:
dropDownContent += "<div class='msgscope-collapse collapse "
dropDownContent += "right desktoponly' id='msgscope'>\n"