relita

an encrypted, decentralized, peer-to-peer social network
Log | Files | Refs | README | LICENSE | git clone https://git.ne02ptzero.me/git/relita

commit 0517222bc465c41a00ac9511495557f7499d1397
parent f35d89285b089185670d4496a5c6425edbb62899
Author: Ne02ptzero <louis@ne02ptzero.me>
Date:   Mon, 10 Apr 2017 08:28:20 +0200

Add(Tooltips): Taken tooltips from bootstrap (and JUST tooltips):

Rework on the CSS files too, for clarity

Diffstat:
Acss/add_post.css | 117+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Acss/bootstrap.min.css | 12++++++++++++
Mcss/main.css | 300++-----------------------------------------------------------------------------
Acss/menu.css | 69+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Acss/posts_list.css | 95+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Acss/register.css | 19+++++++++++++++++++
Mindex.html | 23+++++++++++++----------
Ajs/bootstrap.min.js | 12++++++++++++
Mjs/renderer.js | 11+++++++++--
Mregister.html | 1+
10 files changed, 352 insertions(+), 307 deletions(-)

diff --git a/css/add_post.css b/css/add_post.css @@ -0,0 +1,117 @@ +.add_post { + display: none; + width: 100%; + border: 0; + height: 6.2%; + background: rgba(126, 130, 122, 0.21); +} + +.add_post .placeholder { + height: 100%; + font-size: 2em; + padding-left: 10px; + font-weight: lighter; + font-family: "Inconsolata"; + width: -webkit-calc(100% - 10px); + padding-top: 10px; +} + +.add_post .tabs { + display: none; +} + +.add_post .tabs ul { + list-style: none; + display: inline; +} + +.add_post .tabs ul li { + display: block; + float: left; + width: 16.66%; + text-align: center; + padding-top: 4px; + padding-bottom: 4px; + background: #141415; + transition-property: all; + transition-duration: 0.2s; +} + +.add_post .tabs ul li:hover { + background: transparent; + cursor: pointer; +} + +.add_post .tabs ul .active { + background: transparent; +} + +.add_post .tabs ul li i { + padding-right: 7px; +} + +.add_post .buttons { + display: none; + margin-left: 8px; +} + +.add_post .buttons ul { + display: inline; + list-style: none; +} + +.add_post .buttons ul li { + float: left; + text-align: center; + border: 1px solid transparent; +} + +.add_post .buttons ul .padding { + width: 68.5%; + display: block; +} + +.add_post .buttons ul .cancel { + width: 15%; + border: 1px solid white; + padding: 5px 0 5px 0; + transition-property: all; + transition-duration: 0.3s; +} + +.add_post .buttons ul .cancel:hover { + border-color: red; + cursor: pointer; +} + +.add_post .buttons ul .publish { + width: 15%; + border: 1px solid white; + padding: 5px 0 5px 0; + background: white; + color: black; + transition-property: all; + transition-duration: 0.3s; +} + +.add_post .buttons ul .publish:hover { + border-color: green; + cursor: pointer; +} + +.add_post .content_edition div { + display: none; +} + +.add_post .content_edition .post textarea { + width: -webkit-calc(100% - 2px); + height: 180px; + border: 0; + padding-left: 2px; + resize: none; + margin-bottom: 5px; + background: white; + font-family: "Inconsolata"; +} + + diff --git a/css/bootstrap.min.css b/css/bootstrap.min.css @@ -0,0 +1,12 @@ +/*! + * Bootstrap v3.3.7 (http://getbootstrap.com) + * Copyright 2011-2017 Twitter, Inc. + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) + *//*! + * Generated using the Bootstrap Customizer (http://getbootstrap.com/customize/?id=fc2575092b8cae66e3c9ec13f165d369) + * Config saved to config.json and https://gist.github.com/fc2575092b8cae66e3c9ec13f165d369 + *//*! + * Bootstrap v3.3.7 (http://getbootstrap.com) + * Copyright 2011-2016 Twitter, Inc. + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) + *//*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */.tooltip.top .tooltip-arrow,.tooltip.top-left .tooltip-arrow,.tooltip.top-right .tooltip-arrow{bottom:0;border-width:5px 5px 0;border-top-color:#000}.tooltip{position:absolute;z-index:1070;display:block;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-style:normal;font-weight:400;letter-spacing:normal;line-break:auto;line-height:1.42857143;text-align:left;text-align:start;text-decoration:none;text-shadow:none;text-transform:none;white-space:normal;word-break:normal;word-spacing:normal;word-wrap:normal;font-size:12px;opacity:0;filter:alpha(opacity=0)}.tooltip.in{opacity:.9;filter:alpha(opacity=90)}.tooltip.top{margin-top:-3px;padding:5px 0}.tooltip.right{margin-left:3px;padding:0 5px}.tooltip.bottom{margin-top:3px;padding:5px 0}.tooltip.left{margin-left:-3px;padding:0 5px}.tooltip-inner{max-width:200px;padding:3px 8px;color:#fff;text-align:center;background-color:#000;border-radius:4px}.tooltip-arrow{position:absolute;width:0;height:0;border-color:transparent;border-style:solid}.tooltip.top .tooltip-arrow{left:50%;margin-left:-5px}.tooltip.top-left .tooltip-arrow{right:5px;margin-bottom:-5px}.tooltip.top-right .tooltip-arrow{left:5px;margin-bottom:-5px}.tooltip.right .tooltip-arrow{top:50%;left:0;margin-top:-5px;border-width:5px 5px 5px 0;border-right-color:#000}.tooltip.left .tooltip-arrow{top:50%;right:0;margin-top:-5px;border-width:5px 0 5px 5px;border-left-color:#000}.tooltip.bottom .tooltip-arrow,.tooltip.bottom-left .tooltip-arrow,.tooltip.bottom-right .tooltip-arrow{top:0;border-width:0 5px 5px;border-bottom-color:#000}.tooltip.bottom .tooltip-arrow{left:50%;margin-left:-5px}.tooltip.bottom-left .tooltip-arrow{right:5px;margin-top:-5px}.tooltip.bottom-right .tooltip-arrow{left:5px;margin-top:-5px} diff --git a/css/main.css b/css/main.css @@ -34,6 +34,11 @@ input:focus { outline:none; } + +div.tooltip-inner { + max-width: none; +} + .title { height: 90%; width: 100%; @@ -60,141 +65,6 @@ input:focus { color: #F2F2F2; } -.add_post { - display: none; - width: 100%; - border: 0; - height: 6.2%; - background: rgba(126, 130, 122, 0.21); -} - -.add_post .placeholder { - height: 100%; - font-size: 2em; - padding-left: 10px; - font-weight: lighter; - font-family: "Inconsolata"; - width: -webkit-calc(100% - 10px); - padding-top: 10px; -} - -.add_post .tabs { - display: none; -} - -.add_post .tabs ul { - list-style: none; - display: inline; -} - -.add_post .tabs ul li { - display: block; - float: left; - width: 16.66%; - text-align: center; - padding-top: 4px; - padding-bottom: 4px; - background: #141415; - transition-property: all; - transition-duration: 0.2s; -} - -.add_post .tabs ul li:hover { - background: transparent; - cursor: pointer; -} - -.add_post .tabs ul .active { - background: transparent; -} - -.add_post .tabs ul li i { - padding-right: 7px; -} - -.add_post .buttons { - display: none; - margin-left: 8px; -} - -.add_post .buttons ul { - display: inline; - list-style: none; -} - -.add_post .buttons ul li { - float: left; - text-align: center; - border: 1px solid transparent; -} - -.add_post .buttons ul .padding { - width: 68.5%; - display: block; -} - -.add_post .buttons ul .cancel { - width: 15%; - border: 1px solid white; - padding: 5px 0 5px 0; - transition-property: all; - transition-duration: 0.3s; -} - -.add_post .buttons ul .cancel:hover { - border-color: red; - cursor: pointer; -} - -.add_post .buttons ul .publish { - width: 15%; - border: 1px solid white; - padding: 5px 0 5px 0; - background: white; - color: black; - transition-property: all; - transition-duration: 0.3s; -} - -.add_post .buttons ul .publish:hover { - border-color: green; - cursor: pointer; -} - -.add_post .content_edition div { - display: none; -} - -.add_post .content_edition .post textarea { - width: -webkit-calc(100% - 2px); - height: 180px; - border: 0; - padding-left: 2px; - resize: none; - margin-bottom: 5px; - background: white; - font-family: "Inconsolata"; -} - -.register { - height: 90%; - width: 100%; - display: flex; - align-items: center; - justify-content: center; -} - -.register h1 { - font-weight: lighter; - margin-bottom: 30px; -} - -.register ul { - list-style: none; - text-align: center; - margin-top: 20px; -} - .input { list-style: none; display: inline-block; @@ -252,170 +122,10 @@ input:focus { background: #8C8979; } -.menu { - position: absolute; - width: 100px; - height: 100%; - left: 0; - top: 0; - text-align: center; - background: #2F343B; - border-right: 3px solid rgba(0, 0, 0, 0.19); - display: none; -} - -.menu ul { - list-style: none; -} - -.menu ul li { - display: block; - border-bottom: 3px solid rgba(0, 0, 0, 0.12); - transition-property: all; - transition-duration: 0.3s; - padding-bottom: 5px; - padding-top: 5px; -} - -.menu ul li:hover { - background: #232527; - cursor: pointer; - color: white; -} - -.menu ul .main { - height: 10%; - background: #703030; - font-size: 3em; - font-weight: bold; - border-bottom: 3px solid rgb(80, 56, 56); -} - -.menu ul .last { - border-bottom: 0; -} - -.menu ul .my_profile { - position: absolute; - border-bottom: 0; - bottom: 5%; -} - -.menu ul .my_profile:hover { - cursor: pointer; - background: transparent; -} - -.menu ul .my_profile img { - width: 50%; -} - -.menu ul li i { - font-size: 2em; - color: #e8dfce; - margin-top: 15px; - margin-bottom: 15px; -} - .round_image { border-radius: 50%; } -.posts_list { - display: none; - margin-top: 15px; - margin-left: 10px; -} - -.posts_list ul { - display: inline; - list-style: none; - width: 100%; -} - -.posts_list ul li { - display: block; - float: left; -} - -.posts_list ul .post { - width: 50%; -} - -.posts_list ul .full { - width: 100%; -} - -.posts_list .single_post { - margin-right: 10px; - background: rgba(255, 255, 255, 0.83); - color: black; - padding: 10px 5px 10px 5px; - margin-bottom: 10px; -} - -.posts_list .single_post .header { - display: inline; - list-style: none; - color: #2c2d2b; -} - -.posts_list .single_post .header li { - display: block; - float: left; - width: 50%; -} - -.posts_list .single_post .header .time { - text-align: right; -} - -.posts_list .single_post .bottom { - display: inline; - list-style: none; - color: #2c2d2b; -} - -.posts_list .single_post .bottom li { - display: block; - float: left; - width: 10%; - text-align: center; - transition-property: all; - transition-duration: 0.3s; -} - -.posts_list .single_post .bottom .padding { - width: 60%; -} - -.posts_list .single_post .content { - padding-top: 25px; - padding-bottom: 25px; - padding-left: 10px; - font-size: 1.5em; -} - -.posts_list .single_post .bottom .heart:hover { - color: #703030; - cursor: pointer; -} - -.posts_list .single_post .bottom .repost:hover { - color: green; - cursor: pointer; -} - -.posts_list .single_post .bottom .comment:hover { - color: #2F343B; - cursor: pointer; -} - -.posts_list .single_post .bottom .report:hover { - color: red; - cursor: pointer; -} - .templates { display: none; } diff --git a/css/menu.css b/css/menu.css @@ -0,0 +1,69 @@ +.menu { + position: absolute; + width: 100px; + height: 100%; + left: 0; + top: 0; + text-align: center; + background: #2F343B; + border-right: 3px solid rgba(0, 0, 0, 0.19); + display: none; +} + +.menu ul { + list-style: none; +} + +.menu ul li { + display: block; + border-bottom: 3px solid rgba(0, 0, 0, 0.12); + transition-property: all; + transition-duration: 0.3s; + padding-bottom: 5px; + padding-top: 5px; +} + +.menu ul .active { + background: #232527; +} + +.menu ul li:hover { + background: #232527; + cursor: pointer; + color: white; +} + +.menu ul .main { + height: 10%; + background: #703030; + font-size: 3em; + font-weight: bold; + border-bottom: 3px solid rgb(80, 56, 56); +} + +.menu ul .last { + border-bottom: 0; +} + +.menu ul .my_profile { + position: absolute; + border-bottom: 0; + bottom: 5%; +} + +.menu ul .my_profile:hover { + cursor: pointer; + background: transparent; +} + +.menu ul .my_profile img { + width: 50%; +} + +.menu ul li i { + font-size: 2em; + color: #e8dfce; + margin-top: 15px; + margin-bottom: 15px; +} + diff --git a/css/posts_list.css b/css/posts_list.css @@ -0,0 +1,95 @@ +.posts_list { + display: none; + margin-top: 15px; + margin-left: 10px; +} + +.posts_list ul { + display: inline; + list-style: none; + width: 100%; +} + +.posts_list ul li { + display: block; + float: left; +} + +.posts_list ul .post { + width: 50%; +} + +.posts_list ul .full { + width: 100%; +} + +.posts_list .single_post { + margin-right: 10px; + background: rgba(255, 255, 255, 0.83); + color: black; + padding: 10px 5px 10px 5px; + margin-bottom: 10px; +} + +.posts_list .single_post .header { + display: inline; + list-style: none; + color: #2c2d2b; +} + +.posts_list .single_post .header li { + display: block; + float: left; + width: 50%; +} + +.posts_list .single_post .header .time { + text-align: right; +} + +.posts_list .single_post .bottom { + display: inline; + list-style: none; + color: #2c2d2b; +} + +.posts_list .single_post .bottom li { + display: block; + float: left; + width: 10%; + text-align: center; + transition-property: all; + transition-duration: 0.3s; +} + +.posts_list .single_post .bottom .padding { + width: 60%; +} + +.posts_list .single_post .content { + padding-top: 25px; + padding-bottom: 25px; + padding-left: 10px; + font-size: 1.5em; +} + +.posts_list .single_post .bottom .heart:hover { + color: #703030; + cursor: pointer; +} + +.posts_list .single_post .bottom .repost:hover { + color: green; + cursor: pointer; +} + +.posts_list .single_post .bottom .comment:hover { + color: #2F343B; + cursor: pointer; +} + +.posts_list .single_post .bottom .report:hover { + color: red; + cursor: pointer; +} + diff --git a/css/register.css b/css/register.css @@ -0,0 +1,19 @@ +.register { + height: 90%; + width: 100%; + display: flex; + align-items: center; + justify-content: center; +} + +.register h1 { + font-weight: lighter; + margin-bottom: 30px; +} + +.register ul { + list-style: none; + text-align: center; + margin-top: 20px; +} + diff --git a/index.html b/index.html @@ -3,6 +3,10 @@ <head> <meta charset="UTF-8"> <link rel="stylesheet" href="./css/main.css"> + <link rel="stylesheet" href="./css/menu.css"> + <link rel="stylesheet" href="./css/posts_list.css"> + <link rel="stylesheet" href="./css/add_post.css"> + <link rel="stylesheet" href="./css/bootstrap.min.css"> <link rel="stylesheet" href="./css/font-awesome/css/font-awesome.min.css"> </head> <body> @@ -10,7 +14,7 @@ <ul> <li class='main'>R</li> <li class='search'><i class="fa fa-search"></i></li> - <li class='feed'><i class="fa fa-feed"></i></li> + <li class='feed active'><i class="fa fa-feed"></i></li> <li class='chat'><i class="fa fa-comment"></i></li> <li class='music'><i class="fa fa-music"></i></li> <li class='files'><i class="fa fa-file"></i></li> @@ -64,18 +68,16 @@ <div class='templates'> <div class='single_post'> <ul class='header'> - <li class='author'>@Louis</li> - <li class="time">Sun. 09/04 02:04</li> + <li class='author' data-toggle="tooltip" data-placement="top"></li> + <li class="time" data-toggle="tooltip" data-placement="top"></li> </ul> - <div class='content'> - Sup ? - </div> + <div class='content'></div> <ul class='bottom'> - <li class="heart"><i class="fa fa-heart"></i></li> - <li class="repost"><i class="fa fa-retweet"></i></li> - <li class="comment"><i class="fa fa-comments"></i></li> + <li class="heart" data-toggle="tooltip" data-placement="top" title="Like this post"><i class="fa fa-heart"></i></li> + <li class="repost" data-toggle="tooltip" data-placement="top" title="Save this post" ><i class="fa fa-bookmark"></i></li> + <li class="comment" data-toggle="tooltip" data-placement="top" title="Comments"><i class="fa fa-comments"></i></li> <li class='padding'>&nbsp;</li> - <li class='report'><i class="fa fa-ban"></i></li> + <li class='report' data-toggle="tooltip" data-placement="top" title="Report" ><i class="fa fa-ban"></i></li> </ul> <br /> </div> @@ -84,6 +86,7 @@ <script>window.$ = window.jQuery = require('./js/jquery.min.js');</script> <script> +require('./js/bootstrap.min.js') require('./js/renderer.js') </script> </html> diff --git a/js/bootstrap.min.js b/js/bootstrap.min.js @@ -0,0 +1,11 @@ +/*! + * Bootstrap v3.3.7 (http://getbootstrap.com) + * Copyright 2011-2017 Twitter, Inc. + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) + */ + +/*! + * Generated using the Bootstrap Customizer (http://getbootstrap.com/customize/?id=fc2575092b8cae66e3c9ec13f165d369) + * Config saved to config.json and https://gist.github.com/fc2575092b8cae66e3c9ec13f165d369 + */ +if("undefined"==typeof jQuery)throw new Error("Bootstrap's JavaScript requires jQuery");+function(t){"use strict";var e=t.fn.jquery.split(" ")[0].split(".");if(e[0]<2&&e[1]<9||1==e[0]&&9==e[1]&&e[2]<1||e[0]>3)throw new Error("Bootstrap's JavaScript requires jQuery version 1.9.1 or higher, but lower than version 4")}(jQuery),+function(t){"use strict";function e(e){return this.each(function(){var o=t(this),n=o.data("bs.tooltip"),s="object"==typeof e&&e;!n&&/destroy|hide/.test(e)||(n||o.data("bs.tooltip",n=new i(this,s)),"string"==typeof e&&n[e]())})}var i=function(t,e){this.type=null,this.options=null,this.enabled=null,this.timeout=null,this.hoverState=null,this.$element=null,this.inState=null,this.init("tooltip",t,e)};i.VERSION="3.3.7",i.TRANSITION_DURATION=150,i.DEFAULTS={animation:!0,placement:"top",selector:!1,template:'<div class="tooltip" role="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>',trigger:"hover focus",title:"",delay:0,html:!1,container:!1,viewport:{selector:"body",padding:0}},i.prototype.init=function(e,i,o){if(this.enabled=!0,this.type=e,this.$element=t(i),this.options=this.getOptions(o),this.$viewport=this.options.viewport&&t(t.isFunction(this.options.viewport)?this.options.viewport.call(this,this.$element):this.options.viewport.selector||this.options.viewport),this.inState={click:!1,hover:!1,focus:!1},this.$element[0]instanceof document.constructor&&!this.options.selector)throw new Error("`selector` option must be specified when initializing "+this.type+" on the window.document object!");for(var n=this.options.trigger.split(" "),s=n.length;s--;){var r=n[s];if("click"==r)this.$element.on("click."+this.type,this.options.selector,t.proxy(this.toggle,this));else if("manual"!=r){var a="hover"==r?"mouseenter":"focusin",l="hover"==r?"mouseleave":"focusout";this.$element.on(a+"."+this.type,this.options.selector,t.proxy(this.enter,this)),this.$element.on(l+"."+this.type,this.options.selector,t.proxy(this.leave,this))}}this.options.selector?this._options=t.extend({},this.options,{trigger:"manual",selector:""}):this.fixTitle()},i.prototype.getDefaults=function(){return i.DEFAULTS},i.prototype.getOptions=function(e){return e=t.extend({},this.getDefaults(),this.$element.data(),e),e.delay&&"number"==typeof e.delay&&(e.delay={show:e.delay,hide:e.delay}),e},i.prototype.getDelegateOptions=function(){var e={},i=this.getDefaults();return this._options&&t.each(this._options,function(t,o){i[t]!=o&&(e[t]=o)}),e},i.prototype.enter=function(e){var i=e instanceof this.constructor?e:t(e.currentTarget).data("bs."+this.type);return i||(i=new this.constructor(e.currentTarget,this.getDelegateOptions()),t(e.currentTarget).data("bs."+this.type,i)),e instanceof t.Event&&(i.inState["focusin"==e.type?"focus":"hover"]=!0),i.tip().hasClass("in")||"in"==i.hoverState?void(i.hoverState="in"):(clearTimeout(i.timeout),i.hoverState="in",i.options.delay&&i.options.delay.show?void(i.timeout=setTimeout(function(){"in"==i.hoverState&&i.show()},i.options.delay.show)):i.show())},i.prototype.isInStateTrue=function(){for(var t in this.inState)if(this.inState[t])return!0;return!1},i.prototype.leave=function(e){var i=e instanceof this.constructor?e:t(e.currentTarget).data("bs."+this.type);return i||(i=new this.constructor(e.currentTarget,this.getDelegateOptions()),t(e.currentTarget).data("bs."+this.type,i)),e instanceof t.Event&&(i.inState["focusout"==e.type?"focus":"hover"]=!1),i.isInStateTrue()?void 0:(clearTimeout(i.timeout),i.hoverState="out",i.options.delay&&i.options.delay.hide?void(i.timeout=setTimeout(function(){"out"==i.hoverState&&i.hide()},i.options.delay.hide)):i.hide())},i.prototype.show=function(){var e=t.Event("show.bs."+this.type);if(this.hasContent()&&this.enabled){this.$element.trigger(e);var o=t.contains(this.$element[0].ownerDocument.documentElement,this.$element[0]);if(e.isDefaultPrevented()||!o)return;var n=this,s=this.tip(),r=this.getUID(this.type);this.setContent(),s.attr("id",r),this.$element.attr("aria-describedby",r),this.options.animation&&s.addClass("fade");var a="function"==typeof this.options.placement?this.options.placement.call(this,s[0],this.$element[0]):this.options.placement,l=/\s?auto?\s?/i,p=l.test(a);p&&(a=a.replace(l,"")||"top"),s.detach().css({top:0,left:0,display:"block"}).addClass(a).data("bs."+this.type,this),this.options.container?s.appendTo(this.options.container):s.insertAfter(this.$element),this.$element.trigger("inserted.bs."+this.type);var h=this.getPosition(),f=s[0].offsetWidth,u=s[0].offsetHeight;if(p){var c=a,d=this.getPosition(this.$viewport);a="bottom"==a&&h.bottom+u>d.bottom?"top":"top"==a&&h.top-u<d.top?"bottom":"right"==a&&h.right+f>d.width?"left":"left"==a&&h.left-f<d.left?"right":a,s.removeClass(c).addClass(a)}var v=this.getCalculatedOffset(a,h,f,u);this.applyPlacement(v,a);var g=function(){var t=n.hoverState;n.$element.trigger("shown.bs."+n.type),n.hoverState=null,"out"==t&&n.leave(n)};t.support.transition&&this.$tip.hasClass("fade")?s.one("bsTransitionEnd",g).emulateTransitionEnd(i.TRANSITION_DURATION):g()}},i.prototype.applyPlacement=function(e,i){var o=this.tip(),n=o[0].offsetWidth,s=o[0].offsetHeight,r=parseInt(o.css("margin-top"),10),a=parseInt(o.css("margin-left"),10);isNaN(r)&&(r=0),isNaN(a)&&(a=0),e.top+=r,e.left+=a,t.offset.setOffset(o[0],t.extend({using:function(t){o.css({top:Math.round(t.top),left:Math.round(t.left)})}},e),0),o.addClass("in");var l=o[0].offsetWidth,p=o[0].offsetHeight;"top"==i&&p!=s&&(e.top=e.top+s-p);var h=this.getViewportAdjustedDelta(i,e,l,p);h.left?e.left+=h.left:e.top+=h.top;var f=/top|bottom/.test(i),u=f?2*h.left-n+l:2*h.top-s+p,c=f?"offsetWidth":"offsetHeight";o.offset(e),this.replaceArrow(u,o[0][c],f)},i.prototype.replaceArrow=function(t,e,i){this.arrow().css(i?"left":"top",50*(1-t/e)+"%").css(i?"top":"left","")},i.prototype.setContent=function(){var t=this.tip(),e=this.getTitle();t.find(".tooltip-inner")[this.options.html?"html":"text"](e),t.removeClass("fade in top bottom left right")},i.prototype.hide=function(e){function o(){"in"!=n.hoverState&&s.detach(),n.$element&&n.$element.removeAttr("aria-describedby").trigger("hidden.bs."+n.type),e&&e()}var n=this,s=t(this.$tip),r=t.Event("hide.bs."+this.type);return this.$element.trigger(r),r.isDefaultPrevented()?void 0:(s.removeClass("in"),t.support.transition&&s.hasClass("fade")?s.one("bsTransitionEnd",o).emulateTransitionEnd(i.TRANSITION_DURATION):o(),this.hoverState=null,this)},i.prototype.fixTitle=function(){var t=this.$element;(t.attr("title")||"string"!=typeof t.attr("data-original-title"))&&t.attr("data-original-title",t.attr("title")||"").attr("title","")},i.prototype.hasContent=function(){return this.getTitle()},i.prototype.getPosition=function(e){e=e||this.$element;var i=e[0],o="BODY"==i.tagName,n=i.getBoundingClientRect();null==n.width&&(n=t.extend({},n,{width:n.right-n.left,height:n.bottom-n.top}));var s=window.SVGElement&&i instanceof window.SVGElement,r=o?{top:0,left:0}:s?null:e.offset(),a={scroll:o?document.documentElement.scrollTop||document.body.scrollTop:e.scrollTop()},l=o?{width:t(window).width(),height:t(window).height()}:null;return t.extend({},n,a,l,r)},i.prototype.getCalculatedOffset=function(t,e,i,o){return"bottom"==t?{top:e.top+e.height,left:e.left+e.width/2-i/2}:"top"==t?{top:e.top-o,left:e.left+e.width/2-i/2}:"left"==t?{top:e.top+e.height/2-o/2,left:e.left-i}:{top:e.top+e.height/2-o/2,left:e.left+e.width}},i.prototype.getViewportAdjustedDelta=function(t,e,i,o){var n={top:0,left:0};if(!this.$viewport)return n;var s=this.options.viewport&&this.options.viewport.padding||0,r=this.getPosition(this.$viewport);if(/right|left/.test(t)){var a=e.top-s-r.scroll,l=e.top+s-r.scroll+o;a<r.top?n.top=r.top-a:l>r.top+r.height&&(n.top=r.top+r.height-l)}else{var p=e.left-s,h=e.left+s+i;p<r.left?n.left=r.left-p:h>r.right&&(n.left=r.left+r.width-h)}return n},i.prototype.getTitle=function(){var t,e=this.$element,i=this.options;return t=e.attr("data-original-title")||("function"==typeof i.title?i.title.call(e[0]):i.title)},i.prototype.getUID=function(t){do t+=~~(1e6*Math.random());while(document.getElementById(t));return t},i.prototype.tip=function(){if(!this.$tip&&(this.$tip=t(this.options.template),1!=this.$tip.length))throw new Error(this.type+" `template` option must consist of exactly 1 top-level element!");return this.$tip},i.prototype.arrow=function(){return this.$arrow=this.$arrow||this.tip().find(".tooltip-arrow")},i.prototype.enable=function(){this.enabled=!0},i.prototype.disable=function(){this.enabled=!1},i.prototype.toggleEnabled=function(){this.enabled=!this.enabled},i.prototype.toggle=function(e){var i=this;e&&(i=t(e.currentTarget).data("bs."+this.type),i||(i=new this.constructor(e.currentTarget,this.getDelegateOptions()),t(e.currentTarget).data("bs."+this.type,i))),e?(i.inState.click=!i.inState.click,i.isInStateTrue()?i.enter(i):i.leave(i)):i.tip().hasClass("in")?i.leave(i):i.enter(i)},i.prototype.destroy=function(){var t=this;clearTimeout(this.timeout),this.hide(function(){t.$element.off("."+t.type).removeData("bs."+t.type),t.$tip&&t.$tip.detach(),t.$tip=null,t.$arrow=null,t.$viewport=null,t.$element=null})};var o=t.fn.tooltip;t.fn.tooltip=e,t.fn.tooltip.Constructor=i,t.fn.tooltip.noConflict=function(){return t.fn.tooltip=o,this}}(jQuery);+ \ No newline at end of file diff --git a/js/renderer.js b/js/renderer.js @@ -12,6 +12,7 @@ $(function() { $(".menu").fadeIn(300, function() { $(".add_post").fadeIn(200, function () { $(".posts_list").fadeIn(200); + $('[data-toggle="tooltip"]').tooltip(); }); }); }); @@ -61,12 +62,17 @@ $(function() { function add_post_to_page(arg) { html = $(".templates .single_post").clone() if (arg.value.content.sub_type === "post") { - console.log(arg) + post_class = 'post'; var date = new Date(arg.timestamp) $(html).find('.content').html(arg.value.content.value.text) $(html).find('.author').html("@"+ arg.author_about.value.content.name) + $(html).find('.author').prop('title', arg.value.author) $(html).find('.time').html(date.toDateString()) - $(".posts_list .main_list").prepend("<li class='post'><div class='single_post'>" + $(html).html() + "</div></li>") + $(html).find('.time').prop('title', arg.timestamp) + if (arg.value.content.value.text.length > 20) + post_class = 'full'; + $(".posts_list .main_list").prepend("<li class='"+ post_class +"'><div class='single_post'>" + $(html).html() + "</div></li>") + $('[data-toggle="tooltip"]').tooltip(); } } @@ -104,4 +110,5 @@ $(function() { $(".add_post .content_edition div").fadeOut(0); $(".add_post .content_edition ."+current_post_type).fadeIn(0); }) + }) diff --git a/register.html b/register.html @@ -3,6 +3,7 @@ <head> <meta charset="UTF-8"> <link rel="stylesheet" href="./css/main.css"> + <link rel="stylesheet" href="./css/register.css"> <link rel="stylesheet" href="./css/font-awesome/css/font-awesome.min.css"> </head> <body>