mirror of
https://github.com/phpbb/phpbb.git
synced 2025-06-08 12:28:52 +00:00
[ticket/13713] Fix styles for mention dropdown
PHPBB3-13713
This commit is contained in:
parent
31e4fb4729
commit
50400cb785
8 changed files with 75 additions and 16 deletions
|
@ -11,7 +11,6 @@
|
||||||
<!-- IF S_ALLOW_MENTIONS -->
|
<!-- IF S_ALLOW_MENTIONS -->
|
||||||
<div id="mention_params" style="display: none;" data-mention-url="{U_MENTION_URL}" data-mention-names-limit="{S_MENTION_NAMES_LIMIT}" data-topic-id="{S_TOPIC_ID}"></div>
|
<div id="mention_params" style="display: none;" data-mention-url="{U_MENTION_URL}" data-mention-names-limit="{S_MENTION_NAMES_LIMIT}" data-topic-id="{S_TOPIC_ID}"></div>
|
||||||
<!-- ENDIF -->
|
<!-- ENDIF -->
|
||||||
<!-- INCLUDECSS {T_ASSETS_PATH}/css/jquery.atwho.min.css -->
|
|
||||||
<!-- INCLUDEJS {T_ASSETS_PATH}/javascript/jquery.caret.min.js -->
|
<!-- INCLUDEJS {T_ASSETS_PATH}/javascript/jquery.caret.min.js -->
|
||||||
<!-- INCLUDEJS {T_ASSETS_PATH}/javascript/jquery.atwho.min.js -->
|
<!-- INCLUDEJS {T_ASSETS_PATH}/javascript/jquery.atwho.min.js -->
|
||||||
<!-- INCLUDEJS {T_ASSETS_PATH}/javascript/editor.js -->
|
<!-- INCLUDEJS {T_ASSETS_PATH}/javascript/editor.js -->
|
||||||
|
|
|
@ -1676,18 +1676,45 @@ fieldset.submit-buttons legend {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
.atwho-container .atwho-view {
|
.atwho-view {
|
||||||
font-size: 12px;
|
background: #ffffff;
|
||||||
|
border: 1px solid #dddddd;
|
||||||
|
border-radius: 3px;
|
||||||
|
box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
|
||||||
|
color: #000000;
|
||||||
|
position: absolute;
|
||||||
|
z-index: 11110 !important;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
display: none;
|
||||||
min-width: 260px;
|
min-width: 260px;
|
||||||
|
margin-top: 18px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.atwho-container .atwho-view ul li {
|
.atwho-view-ul {
|
||||||
|
overflow-y: auto;
|
||||||
|
max-height: 200px;
|
||||||
|
margin: auto;
|
||||||
|
padding: 0;
|
||||||
|
list-style: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mention-name {
|
||||||
|
font-size: 12px;
|
||||||
|
border-bottom: 1px solid #dddddd;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
display: block;
|
||||||
padding: 15px 5px 15px 45px;
|
padding: 15px 5px 15px 45px;
|
||||||
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
.atwho-container .atwho-view ul li:hover,
|
.rtl .mention-name {
|
||||||
.atwho-container .atwho-view ul li.cur {
|
padding-right: 45px;
|
||||||
|
padding-left: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mention-name:hover,
|
||||||
|
.mention-name.cur {
|
||||||
background-color: #0077b3;
|
background-color: #0077b3;
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
}
|
}
|
||||||
|
@ -1710,6 +1737,11 @@ fieldset.submit-buttons legend {
|
||||||
margin-top: -16px;
|
margin-top: -16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.rtl .mention-avatar {
|
||||||
|
right: 7px;
|
||||||
|
left: auto;
|
||||||
|
}
|
||||||
|
|
||||||
.mention-rank {
|
.mention-rank {
|
||||||
font-size: 10px;
|
font-size: 10px;
|
||||||
display: block;
|
display: block;
|
||||||
|
|
1
phpBB/assets/css/jquery.atwho.min.css
vendored
1
phpBB/assets/css/jquery.atwho.min.css
vendored
|
@ -1 +0,0 @@
|
||||||
.atwho-view{position:absolute;top:0;left:0;display:none;margin-top:18px;background:#fff;color:#000;border:1px solid #DDD;border-radius:3px;box-shadow:0 0 5px rgba(0,0,0,.1);min-width:120px;z-index:11110!important}.atwho-view .atwho-header{padding:5px;margin:5px;cursor:pointer;border-bottom:solid 1px #eaeff1;color:#6f8092;font-size:11px;font-weight:700}.atwho-view .atwho-header .small{color:#6f8092;float:right;padding-top:2px;margin-right:-5px;font-size:12px;font-weight:400}.atwho-view .atwho-header:hover{cursor:default}.atwho-view .cur{background:#36F;color:#fff}.atwho-view .cur small{color:#fff}.atwho-view strong{color:#36F}.atwho-view .cur strong{color:#fff;font:700}.atwho-view ul{list-style:none;padding:0;margin:auto;max-height:200px;overflow-y:auto}.atwho-view ul li{display:block;padding:5px 10px;border-bottom:1px solid #DDD;cursor:pointer}.atwho-view small{font-size:smaller;color:#777;font-weight:400}
|
|
|
@ -396,7 +396,7 @@ function getCaretPosition(txtarea) {
|
||||||
var avatar = (data.avatar.src) ? "<img src='" + data.avatar.src + "'>" :
|
var avatar = (data.avatar.src) ? "<img src='" + data.avatar.src + "'>" :
|
||||||
"<span class='mention-avatar'><i class='fa fa-" + data.avatar.type + "'></i></span>",
|
"<span class='mention-avatar'><i class='fa fa-" + data.avatar.type + "'></i></span>",
|
||||||
rank = (data.rank) ? "<span class='mention-rank'>" + data.rank + "</span>" : '';
|
rank = (data.rank) ? "<span class='mention-rank'>" + data.rank + "</span>" : '';
|
||||||
return "<li>" + avatar + "<span>" + data.name + "</span>" + rank + "</li>";
|
return "<li class='mention-name'>" + avatar + "<span>" + data.name + "</span>" + rank + "</li>";
|
||||||
},
|
},
|
||||||
insertTpl: "[mention ${param}=${id}]${name}[/mention]",
|
insertTpl: "[mention ${param}=${id}]${name}[/mention]",
|
||||||
limit: mentionNamesLimit,
|
limit: mentionNamesLimit,
|
||||||
|
|
|
@ -29,7 +29,6 @@
|
||||||
<!-- IF S_ALLOW_MENTIONS -->
|
<!-- IF S_ALLOW_MENTIONS -->
|
||||||
<div id="mention_params" style="display: none;" data-mention-url="{U_MENTION_URL}" data-mention-names-limit="{S_MENTION_NAMES_LIMIT}" data-topic-id="{S_TOPIC_ID}"></div>
|
<div id="mention_params" style="display: none;" data-mention-url="{U_MENTION_URL}" data-mention-names-limit="{S_MENTION_NAMES_LIMIT}" data-topic-id="{S_TOPIC_ID}"></div>
|
||||||
<!-- ENDIF -->
|
<!-- ENDIF -->
|
||||||
<!-- INCLUDECSS {T_ASSETS_PATH}/css/jquery.atwho.min.css -->
|
|
||||||
<!-- INCLUDEJS {T_ASSETS_PATH}/javascript/jquery.caret.min.js -->
|
<!-- INCLUDEJS {T_ASSETS_PATH}/javascript/jquery.caret.min.js -->
|
||||||
<!-- INCLUDEJS {T_ASSETS_PATH}/javascript/jquery.atwho.min.js -->
|
<!-- INCLUDEJS {T_ASSETS_PATH}/javascript/jquery.atwho.min.js -->
|
||||||
<!-- INCLUDEJS {T_ASSETS_PATH}/javascript/editor.js -->
|
<!-- INCLUDEJS {T_ASSETS_PATH}/javascript/editor.js -->
|
||||||
|
|
|
@ -931,12 +931,12 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Mention dropdown */
|
/* Mention dropdown */
|
||||||
.atwho-container .atwho-view ul li {
|
.rtl .mention-name {
|
||||||
padding-right: 45px;
|
padding-right: 45px;
|
||||||
padding-left: 15px;
|
padding-left: 15px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mention-avatar {
|
.rtl .mention-avatar {
|
||||||
right: 7px;
|
right: 7px;
|
||||||
left: auto;
|
left: auto;
|
||||||
}
|
}
|
||||||
|
|
|
@ -983,8 +983,19 @@ fieldset.fields2 dl:hover dt label {
|
||||||
outline-color: rgba(19, 164, 236, 0.5);
|
outline-color: rgba(19, 164, 236, 0.5);
|
||||||
}
|
}
|
||||||
|
|
||||||
.atwho-container .atwho-view ul li:hover,
|
.atwho-view {
|
||||||
.atwho-container .atwho-view ul li.cur {
|
background: #ffffff;
|
||||||
|
border-color: #dddddd;
|
||||||
|
box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
|
||||||
|
color: #000000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mention-name {
|
||||||
|
border-bottom-color: #dddddd;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mention-name:hover,
|
||||||
|
.mention-name.cur {
|
||||||
background-color: #0077b3;
|
background-color: #0077b3;
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
}
|
}
|
||||||
|
|
|
@ -285,14 +285,33 @@ fieldset.submit-buttons input {
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Mention dropdown */
|
/* Mention dropdown */
|
||||||
.atwho-container .atwho-view {
|
.atwho-view {
|
||||||
font-size: 12px;
|
border: 1px solid transparent;
|
||||||
|
border-radius: 3px;
|
||||||
|
position: absolute;
|
||||||
|
z-index: 11110 !important;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
display: none;
|
||||||
min-width: 260px;
|
min-width: 260px;
|
||||||
|
margin-top: 18px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.atwho-container .atwho-view ul li {
|
.atwho-view-ul {
|
||||||
|
overflow-y: auto;
|
||||||
|
max-height: 200px;
|
||||||
|
margin: auto;
|
||||||
|
padding: 0;
|
||||||
|
list-style: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mention-name {
|
||||||
|
font-size: 12px;
|
||||||
|
border-bottom: 1px solid transparent;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
display: block;
|
||||||
padding: 15px 5px 15px 45px;
|
padding: 15px 5px 15px 45px;
|
||||||
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mention-avatar {
|
.mention-avatar {
|
||||||
|
|
Loading…
Add table
Reference in a new issue