Mirror
/
zulip
mirror of https://github.com/zulip/zulip.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Don't let the tutorial popovers get clipped on long names or small windows. 

(imported from commit 069016ab38eb2d0d09b751ca22a53aba9d6980ba)
This commit is contained in:
Jessica McKellar 2013-08-27 14:31:12 -04:00
parent 9f054eb15f
commit eacd27dc8f
10 changed files with 17 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
static/js/tutorial.js
View File

@ -192,7 +192,7 @@ function messages_in_viewport() {
} }
function small_window() { function small_window() {
return $("#left-sidebar").width() < 175; return !$("#left-sidebar").is(":visible");
} }
function maybe_tweak_placement(placement) { function maybe_tweak_placement(placement) {
@ -215,13 +215,15 @@ function maybe_tweak_placement(placement) {
function create_and_show_popover(target_div, placement, title, content_template) { function create_and_show_popover(target_div, placement, title, content_template) {
target_div.popover({ target_div.popover({
placement: placement, placement: placement,
title: templates.render("tutorial_title", {title: title}), title: templates.render("tutorial_title", {title: title,
content: templates.render(content_template), placement: placement}),
content: templates.render(content_template, {placement: placement}),
trigger: "manual" trigger: "manual"
}); });
target_div.popover("show"); target_div.popover("show");
$(".popover").css("z-index", 20001); $(".popover").css("z-index", 20001);
$(".popover-title").addClass("popover-" + placement);
} }
exports.defer = function (callback) { exports.defer = function (callback) {

8
static/styles/zulip.css
View File

@ -1714,6 +1714,10 @@ table.floating_recipient {
margin-bottom: 5px; margin-bottom: 5px;
} }
.popover-left, .popover-right {
max-width: 175px;
}
.hotkeys_table { .hotkeys_table {
float: left; float: left;
width: 245px; width: 245px;
@ -2446,10 +2450,6 @@ div.edit_bot {
z-index: 20000; z-index: 20000;
} }
.tutorial-popover {
width: 200px;
}
#tutorial-stream { #tutorial-stream {
width: 250px; width: 250px;
} }

2
static/templates/tutorial_home.handlebars
View File

@ -1,6 +1,6 @@
{{! Contents of the "tutorial home" onboarding popup }} {{! Contents of the "tutorial home" onboarding popup }}
<div class="tutorial-popover" id="tutorial-home"> <div class="tutorial-popover popover-{{placement}}" id="tutorial-home">
<p> <p>
We show stream and private messages together, and time flows down. You We show stream and private messages together, and time flows down. You

2
static/templates/tutorial_message.handlebars
View File

@ -1,6 +1,6 @@
{{! Contents of the "tutorial message" onboarding popup }} {{! Contents of the "tutorial message" onboarding popup }}
<div class="tutorial-popover" id="tutorial-message"> <div class="tutorial-popover popover-{{placement}}" id="tutorial-message">
<p> <p>
Messages in Zulip go to a <b>stream</b> and have a <b>topic</b>. Messages in Zulip go to a <b>stream</b> and have a <b>topic</b>.
</p> </p>

2
static/templates/tutorial_private.handlebars
View File

@ -1,6 +1,6 @@
{{! Contents of the "tutorial private" onboarding popup }} {{! Contents of the "tutorial private" onboarding popup }}
<div id="tutorial-private"> <div class="tutorial-popover popover-{{placement}}" id="tutorial-private">
<p> <p>
You can also send private messages to one or more people. You can also send private messages to one or more people.

2
static/templates/tutorial_reply.handlebars
View File

@ -1,6 +1,6 @@
{{! Contents of the "tutorial reply" onboarding popup }} {{! Contents of the "tutorial reply" onboarding popup }}
<div class="tutorial-popover" id="tutorial-reply"> <div class="tutorial-popover popover-{{placement}}" id="tutorial-reply">
<p> <p>
You can reply to any message by clicking on it. The stream and topic You can reply to any message by clicking on it. The stream and topic

2
static/templates/tutorial_stream.handlebars
View File

@ -1,6 +1,6 @@
{{! Contents of the "tutorial stream" onboarding popup }} {{! Contents of the "tutorial stream" onboarding popup }}
<div class="tutorial-popover" id="tutorial-stream"> <div class="tutorial-popover popover-{{placement}}" id="tutorial-stream">
<p> <p>
Streams are like chat rooms or mailing lists. You can easily join, leave, and make them. Streams are like chat rooms or mailing lists. You can easily join, leave, and make them.
</p> </p>

2
static/templates/tutorial_subject.handlebars
View File

@ -1,6 +1,6 @@
{{! Contents of the "tutorial subject" onboarding popup }} {{! Contents of the "tutorial subject" onboarding popup }}
<div class="tutorial-popover" id="tutorial-subject"> <div class="tutorial-popover popover-{{placement}}" id="tutorial-subject">
<p> <p>
The <b>topic</b> of a conversation is one or two words that describe The <b>topic</b> of a conversation is one or two words that describe

2
static/templates/tutorial_title.handlebars
View File

@ -1,3 +1,3 @@
{{! Contents of the tutorial popup title}} {{! Contents of the tutorial popup title}}
<h4>{{title}}</h4> <h4 class="popover-{{placement}}">{{title}}</h4>

2
static/templates/tutorial_welcome.handlebars
View File

@ -1,6 +1,6 @@
{{! Contents of the "tutorial welcome" onboarding popup }} {{! Contents of the "tutorial welcome" onboarding popup }}
<div class="tutorial-popover" id="tutorial-welcome"> <div class="tutorial-popover popover-{{placement}}" id="tutorial-welcome">
<p> <p>
Zulip isn't like other chat tools. Here are some things you need to know. Zulip isn't like other chat tools. Here are some things you need to know.
</p> </p>