Use the new dropdown for userlist and share

This commit is contained in:
yflory
2017-01-13 15:05:00 +01:00
parent efffd4974f
commit 4adde0f0c0
7 changed files with 159 additions and 196 deletions

View File

@@ -334,10 +334,12 @@
position: relative;
display: inline-block;
}
.dropdown-bar button .fa {
margin-left: 5px;
.dropdown-bar .fa {
font-family: FontAwesome;
}
.dropdown-bar button .fa-caret-down {
margin-left: 5px;
}
.dropdown-bar .dropdown-bar-content {
display: none;
position: absolute;
@@ -373,6 +375,29 @@
height: 1px;
background: #bbb;
}
.dropdown-bar .dropdown-bar-content p {
width: 210px;
padding: 5px;
margin: 0;
white-space: normal;
}
.dropdown-bar .dropdown-bar-content p.cryptpad-dropdown-users {
text-align: baseline;
}
.dropdown-bar .dropdown-bar-content p.cryptpad-dropdown-users .yourself,
.dropdown-bar .dropdown-bar-content p.cryptpad-dropdown-users .anonymous,
.dropdown-bar .dropdown-bar-content p.cryptpad-dropdown-users .viewer {
font-style: italic;
}
.dropdown-bar .dropdown-bar-content p h2 {
font-weight: bold;
text-align: center;
background-color: #EEEEEE;
padding: 5px 0px;
margin: 5px 0px;
font-size: 16px;
white-space: normal;
}
html.cp,
.cp body {
font-size: .875em;

View File

@@ -12,10 +12,13 @@
}
}
.fa {
font-family: FontAwesome;
}
button {
.fa{
.fa-caret-down{
margin-left: 5px;
font-family: FontAwesome;
}
}
@@ -58,6 +61,28 @@
height: 1px;
background: #bbb;
}
p {
width: 210px;
padding: 5px;
margin: 0;
white-space: normal;
&.cryptpad-dropdown-users {
text-align:baseline;
.yourself, .anonymous, .viewer {
font-style: italic;
}
}
h2 {
font-weight: bold;
text-align: center;
background-color: #EEEEEE;
padding: 5px 0px;
margin: 5px 0px;
font-size: 16px;
white-space: normal;
}
}
}
}

View File

@@ -65,6 +65,11 @@
margin: 3px 2px;
}
.dropdown-bar-content {
margin-top: -3px;
margin-right: 2px;
}
button {
background-color: inherit;
background-image: linear-gradient(to bottom,#fff,#e4e4e4);
@@ -74,21 +79,22 @@
&:hover {
background-image:linear-gradient(to bottom,#f2f2f2,#ccc);
}
&.userlist {
@media screen and (max-width: 800px) {
display: none;
}
@media screen and (min-width: 801px) {
display: inline-block;
}
&.small {
@media screen and (max-width: 800px) {
display: inline-block;
}
@media screen and (min-width: 801px) {
display: none;
}
}
}
.large {
@media screen and (max-width: 800px) {
display: none;
}
@media screen and (min-width: 801px) {
display: inline-block;
}
}
.small {
@media screen and (max-width: 800px) {
display: inline-block;
}
@media screen and (min-width: 801px) {
display: none;
}
}
@@ -262,54 +268,9 @@
.cryptpad-user-list {
float: right;
}
.cryptpad-dropdown-container {
position: relative;
display: inline-block;
padding: 0px;
.cryptpad-dropdown {
z-index:1000;
display:none;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
overflow: auto;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
height: auto;
padding: 5px;
white-space: normal;
p {
width: 210px;
padding: 0;
margin: 0;
white-space: normal;
&.cryptpad-dropdown-users {
text-align:baseline;
.yourself, .anonymous, .viewer {
font-style: italic;
}
}
h2 {
font-weight: bold;
text-align: center;
background-color: #EEEEEE;
padding: 5px 0px;
margin: 5px 0px;
font-size: 16px;
white-space: normal;
}
}
button {
white-space: normal;
margin: 2px 0px;
}
}
}
button {
margin: 2px 4px 2px 0px;
}
.cryptpad-userbuttons-container {
/*display: none;*/
}
}
.cryptpad-toolbar-rightside {
text-align: right;

View File

@@ -3,10 +3,12 @@
position: relative;
display: inline-block;
}
.dropdown-bar button .fa {
margin-left: 5px;
.dropdown-bar .fa {
font-family: FontAwesome;
}
.dropdown-bar button .fa-caret-down {
margin-left: 5px;
}
.dropdown-bar .dropdown-bar-content {
display: none;
position: absolute;
@@ -42,6 +44,29 @@
height: 1px;
background: #bbb;
}
.dropdown-bar .dropdown-bar-content p {
width: 210px;
padding: 5px;
margin: 0;
white-space: normal;
}
.dropdown-bar .dropdown-bar-content p.cryptpad-dropdown-users {
text-align: baseline;
}
.dropdown-bar .dropdown-bar-content p.cryptpad-dropdown-users .yourself,
.dropdown-bar .dropdown-bar-content p.cryptpad-dropdown-users .anonymous,
.dropdown-bar .dropdown-bar-content p.cryptpad-dropdown-users .viewer {
font-style: italic;
}
.dropdown-bar .dropdown-bar-content p h2 {
font-weight: bold;
text-align: center;
background-color: #EEEEEE;
padding: 5px 0px;
margin: 5px 0px;
font-size: 16px;
white-space: normal;
}
.unselectable {
-webkit-touch-callout: none;
-webkit-user-select: none;
@@ -109,6 +134,10 @@
padding-left: 5px;
margin: 3px 2px;
}
.cryptpad-toolbar .dropdown-bar-content {
margin-top: -3px;
margin-right: 2px;
}
.cryptpad-toolbar button {
background-color: inherit;
background-image: linear-gradient(to bottom, #fff, #e4e4e4);
@@ -120,22 +149,22 @@
background-image: linear-gradient(to bottom, #f2f2f2, #ccc);
}
@media screen and (max-width: 800px) {
.cryptpad-toolbar button.userlist {
.cryptpad-toolbar .large {
display: none;
}
}
@media screen and (min-width: 801px) {
.cryptpad-toolbar button.userlist {
.cryptpad-toolbar .large {
display: inline-block;
}
}
@media screen and (max-width: 800px) {
.cryptpad-toolbar button.userlist.small {
.cryptpad-toolbar .small {
display: inline-block;
}
}
@media screen and (min-width: 801px) {
.cryptpad-toolbar button.userlist.small {
.cryptpad-toolbar .small {
display: none;
}
}
@@ -310,56 +339,9 @@
.cryptpad-toolbar-leftside .cryptpad-user-list {
float: right;
}
.cryptpad-toolbar-leftside .cryptpad-dropdown-container {
position: relative;
display: inline-block;
padding: 0px;
}
.cryptpad-toolbar-leftside .cryptpad-dropdown-container .cryptpad-dropdown {
z-index: 1000;
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
overflow: auto;
box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
height: auto;
padding: 5px;
white-space: normal;
}
.cryptpad-toolbar-leftside .cryptpad-dropdown-container .cryptpad-dropdown p {
width: 210px;
padding: 0;
margin: 0;
white-space: normal;
}
.cryptpad-toolbar-leftside .cryptpad-dropdown-container .cryptpad-dropdown p.cryptpad-dropdown-users {
text-align: baseline;
}
.cryptpad-toolbar-leftside .cryptpad-dropdown-container .cryptpad-dropdown p.cryptpad-dropdown-users .yourself,
.cryptpad-toolbar-leftside .cryptpad-dropdown-container .cryptpad-dropdown p.cryptpad-dropdown-users .anonymous,
.cryptpad-toolbar-leftside .cryptpad-dropdown-container .cryptpad-dropdown p.cryptpad-dropdown-users .viewer {
font-style: italic;
}
.cryptpad-toolbar-leftside .cryptpad-dropdown-container .cryptpad-dropdown p h2 {
font-weight: bold;
text-align: center;
background-color: #EEEEEE;
padding: 5px 0px;
margin: 5px 0px;
font-size: 16px;
white-space: normal;
}
.cryptpad-toolbar-leftside .cryptpad-dropdown-container .cryptpad-dropdown button {
white-space: normal;
margin: 2px 0px;
}
.cryptpad-toolbar-leftside button {
margin: 2px 4px 2px 0px;
}
.cryptpad-toolbar-leftside .cryptpad-userbuttons-container {
/*display: none;*/
}
.cryptpad-toolbar-rightside {
text-align: right;
}