better multiline tooltip code

This commit is contained in:
Torsten Ruger 2015-08-09 12:57:32 +03:00
parent 0926f1f85f
commit 8ed2a03ea9
5 changed files with 33 additions and 23 deletions

View File

@ -13,8 +13,6 @@ gem "salama-arm" , git: "https://github.com/salama/salama-arm.git"
gem "salama-object-file" , git: "https://github.com/salama/salama-object-file.git"
gem "susy" , "2.2.5"
gem "simptip" , "1.0" , git: "https://github.com/arashmanteghi/simptip.git" , :require => false
# Asset compilation gems, they will be required when needed.
gem 'csso-rails', '~> 0.3.4', require: false
gem 'uglifier', '>= 2.4.0', require: false

View File

@ -1,9 +1,3 @@
GIT
remote: https://github.com/arashmanteghi/simptip.git
revision: afd3f735a027ac03458371ebd719434bac94cd0d
specs:
simptip (1.0)
GIT
remote: https://github.com/salama/parslet.git
revision: beeb9b441a9ade1504f7f0e848d805e36a02c544
@ -182,7 +176,6 @@ DEPENDENCIES
salama-object-file!
salama-reader!
selenium-webdriver (~> 2.43.0)
simptip (= 1.0)!
susy (= 2.2.5)
thin (~> 1.6.0)
uglifier (>= 2.4.0)

View File

@ -1,6 +1,25 @@
// Place your apps css here
@import "susy";
@import "simptip";
.tooltip {outline:none; }
.tooltip strong {line-height:30px;}
.tooltip:hover {text-decoration:none;}
.tooltip span {
z-index:10;display:none; padding:14px 20px;
margin-top:-30px; margin-left:28px;
width:300px; line-height:16px;
}
.tooltip:hover span{
display:inline; position:absolute; color:#111;
border:1px solid #DCA; background:#fffAF0;}
.callout {z-index:20;position:absolute;top:30px;border:0;left:-12px;}
/*CSS3 extras*/
.tooltip span
{
border-radius:4px;
box-shadow: 5px 5px 8px #CCC;
}
$susy: (
columns: 24 ,

View File

@ -17,14 +17,19 @@
</div>
{{ reg.fields.each_with_index do |attribute, index| }}
<div>
<div class="field">
<span class="simptip-position-left" data-tooltip="{{attribute.class}}">
{{index}}{{marker(attribute)}}
<div class="field tooltip">
{{index}}{{marker(attribute)}}
<span>
{{attribute.class}}
</span>
</div>
<div class="value">
<span class="simptip-position-right simptip-multiline" data-tooltip="long text with initlong text with initlong text with initlong text with initlong text with initlong text with initlong text with init">
{{attribute.object_id}}
<div class="value tooltip">
{{attribute.object_id}}
<span>
long text with initlong text with initlong <br/>
text with initlong text with initlong
<h3>text with initlong </h3>
text with initlong text with init
</span>
</div>
</div>

View File

@ -2,13 +2,8 @@
# then any config options in config.public are passed to the client as well.
hint_path = Bundler.definition.specs["simptip"].first.full_gem_path
if ENV.has_key?("SASS_PATH")
ENV["SASS_PATH"] = ENV["SASS_PATH"] + File::PATH_SEPARATOR + hint_path
else
ENV["SASS_PATH"] = hint_path
end
#hint_path = Bundler.definition.specs["simptip"].first.full_gem_path
#ENV["SASS_PATH"] = ENV["SASS_PATH"] + File::PATH_SEPARATOR + hint_path
Volt.configure do |config|
# Setup your global app config here.