ariauagrande

ariauagrande theme #7

Oct 2nd, 2013
78
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.94 KB | None | 0 0
  1. <!--
  2.  
  3. ariauagrande theme (originally by purefectionist)
  4. DONT REMOVE CREDIT PLEASE........ THANK
  5.  
  6.  
  7. -->
  8.  
  9. {block:ifdisablerightclick}
  10. <!--click-->
  11. <script language=JavaScript>
  12. <!--
  13. //Disable right click script III- By Renigade ([email protected])
  14. //For full source code, visit http://www.dynamicdrive.com
  15. var message="";
  16. ///////////////////////////////////
  17. function clickIE() {if (document.all) {(message);return false;}}
  18. function clickNS(e) {if
  19. (document.layers||(document.getElementById&&!document.all)) {
  20. if (e.which==2||e.which==3) {(message);return false;}}}
  21. if (document.layers)
  22. {document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS;}
  23. else{document.onmouseup=clickNS;document.oncontextmenu=clickIE;}
  24. document.oncontextmenu=new Function("return false")
  25. // -->
  26. </script>
  27. {/block:ifdisablerightclick}
  28.  
  29. <html lang="en">
  30. <!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  31. <html xmlns="http://www.w3.org/199
  32. 9/xhtml">
  33. <head>
  34. <script src="http://static.tumblr.com/me5sfsd/1YFl414t0/jquery142.js">
  35. <style type="text/css">
  36.  
  37.  
  38. ::-webkit-scrollbar {
  39.  
  40. height: 12px;
  41.  
  42. width: 7px;
  43.  
  44. background: #ffffff;
  45.  
  46. }
  47.  
  48. ::-webkit-scrollbar-thumb {
  49.  
  50. background-color:#a4a4a4;
  51.  
  52. border:0px solid #a4a4a4;
  53.  
  54. -webkit-border-radius: 5ex;
  55.  
  56. -webkit-box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.75);
  57.  
  58. }
  59.  
  60. ::-webkit-scrollbar-corner {
  61.  
  62. background:#a4a4a4;
  63.  
  64. }
  65. ul#drawers {width: auto; list-style: none; margin: 0 auto; padding: 0px; border-top: 0px; color: {color:links};}
  66.  
  67. ul#drawers a {text-decoration: none; font-size: 8px;color:{color:links};}
  68.  
  69. ul#drawers li h4 {margin: 0; padding: 0px; text-transform:uppercase; font-size: 8px; text-align: center; background-color: transparent; background: transparent; -webkit-transition: background-color 0.2s ease-out; -moz-transition: background-color 0.2s ease-out;
  70. transition: background-color 0.2s ease-out;}
  71.  
  72. h4.small {display: table-cell; width: 100px; margin: 0px; height: 100%;}
  73.  
  74. li.drawer h4.open {background-color: ; border-top: 0px;}
  75.  
  76. li.drawer div {padding: 0px; margin: 0px; line-height: 15px; background-color: transparent; background: transparent}
  77.  
  78. li.drawer div li {list-style-type:none;}
  79.  
  80. li.drawer div ul {-webkit-padding-start:5px;}
  81. </style>
  82.  
  83. <script type="text/javascript"
  84. src="http://static.tumblr.com/dbek3sy/ZQDlsyx5t/icons.png"></script>
  85. <link href='http://fonts.googleapis.com/css?family=Delius+Unicase' rel='stylesheet' type='text/css'>
  86.  
  87.  
  88. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  89. <meta name="color:background" content="#fff"/>
  90. <meta name="color:link" content="#000000"/>
  91. <meta name="color:link bg" content="#fff"/>
  92. <meta name="color:link bg hover" content="#000000"/>
  93. <meta name="color:text" content="#000000"/>
  94. <meta name="color:title" content="#000000"/>
  95. <meta name="color:header" content="#ffffff"/>
  96. <meta name="color:header border" content="#000000"/>
  97. <meta name="color:hover" content="#ffffff"/>
  98. <meta name="if:show title" content""/>
  99. <meta name="if:black and white images" content="0"/>
  100. <meta name="if:disable right click" content="1">
  101. <meta name="if:faded images" content="0"/>
  102. <meta name="if:post shadows" content="1"/>
  103. <meta name="image:header" content=""/>
  104. <meta name="image:banner" content=""/>
  105. <meta name="image:background" content=""/>
  106. <meta name="font:body" content="Arial"/>
  107. <meta name="text:link 1" content="" />
  108. <meta name="text:link 1 title" content="" />
  109. <meta name="text:link 2" content="" />
  110. <meta name="text:link 2 title" content="" />
  111. <meta name="text:link 3" content="" />
  112. <meta name="text:link 3 title" content="" />
  113. <meta name="text:link 4" content="" />
  114. <meta name="text:link 4 title" content="" />
  115. <meta name="text:link 5" content="" />
  116. <meta name="text:link 5 title" content="" />
  117. <meta name="text:link 6" content="" />
  118. <meta name="text:link 6 title" content="" />
  119. <meta name="text:link 7" content="" />
  120. <meta name="text:link 7 title" content="" />
  121. <meta name="text:link 8" content="" />
  122. <meta name="text:link 8 title" content="" />
  123. <meta name="text:link 9" content="" />
  124. <meta name="text:link 9 title" content="" />
  125.  
  126. <meta name="if:banner" content="0"/>
  127.  
  128. <style type="text/css">
  129. #tumblr_controls{
  130. position:fixed !important;
  131. -webkit-filter: invert(100%);
  132. }
  133. p {
  134. margin:0px;
  135. margin-top:0px;
  136. }
  137. body {
  138. padding: 0px;
  139. margin: 0px;
  140. color:{color:text};
  141. font-family:{font:body};
  142. line-height:11px;
  143. font-size:9px;
  144. background-color: {color:background};
  145. background-image:url('{image:background}');
  146. background-attachment: fixed;
  147. background-repeat: repeat;
  148. }
  149. a:link, a:active, a:visited{
  150. text-decoration: none;
  151. -webkit-transition: all 0.6s ease-out;-moz-transition: all 0.6s ease-out;-o-transition: all 0.6s ease-out;transition: all 0.6s ease-out;
  152. color:{color:link};
  153. }
  154.  
  155. a:hover {
  156. text-decoration: none;
  157. font-style:;
  158. color: {color:Hover};
  159. -webkit-transition: all 0.6s ease-out;-moz-transition: all 0.6s ease-out;-o-transition: all 0.6s ease-out;transition: all 0.6s ease-out;
  160. }
  161.  
  162. div#center{
  163. margin:auto;
  164. position:relative;
  165. width:auto;
  166. background-color:;
  167. overflow:auto;
  168. overflow-y:hidden;
  169. }
  170. .media img {
  171. width: 200px;
  172. }
  173. .entry {
  174. margin:25px;
  175. float:left;
  176. text-align:left;
  177. {block:ifpostshadows}
  178. box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.07);
  179. -moz-box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.07);
  180. -webkit-box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.07);
  181. {/block:ifpostshadows}
  182. background-color: {color:post background};
  183. {block:ifblackandwhiteimages}
  184. -webkit-filter: grayscale(1);
  185. {/block:ifblackandwhiteimages}
  186. {block:IndexPage}
  187. width:200px;
  188. {/block:IndexPage}
  189. {block:PermalinkPage}
  190. width:500px;
  191. text-align:left;
  192. line-height:12px;
  193. margin-left:1px;
  194. {/block:PermalinkPage}
  195. }
  196.  
  197. {block:iffadedimages}
  198. {block:indexpage}
  199. .entry img{
  200. -webkit-transition: opacity 0.5s linear;
  201. opacity: 0.8;
  202. }
  203. .entry img:hover{
  204. -webkit-transition: opacity 0.7s linear;
  205. opacity: 1;
  206. }{/block:indexpage}
  207. {/block:iffadedimages}
  208.  
  209.  
  210. #posts {
  211. width:550px;
  212. margin-top:125px;
  213. z-index:99;
  214. margin-left:30.7%;
  215. right:auto;
  216. background:transparent;
  217. margin-right:auto;
  218. position:relative;
  219. overflow-y: hidden;
  220. }
  221. #titleok{
  222. font-size:55px;
  223. margin-top:30px;
  224. margin-bottom:4px;
  225. font-family:A Dripping Marker;
  226. font-weight:normal;
  227. letter-spacing:1px;
  228. word-spacing:-3px;
  229. }
  230. #titleok a{
  231. color:{color:title};
  232. -webkit-transition: all 0.5s linear;
  233. -webkit-transition: all 0.5s linear;
  234. -moz-transition: all 0.5s linear;
  235. transition: all 0.5s linear;}
  236. #header{
  237. width:500px;
  238. padding:10px;
  239. height: auto;
  240. line height:15px;
  241. position:fixed;
  242. margin-top:0px;
  243. margin-left:30%;
  244. margin-right:auto;
  245. opacity:0.8;
  246. border-bottom:3px solid {color:header border};
  247. background:{color:header} url('{image:header}') repeat;
  248. text-align:center;
  249. -webkit-animation: fadeInUp 2s;
  250. -moz-animation: fadeInUp 2s;
  251. -ms-animation: fadeInUp 2s;
  252.  
  253. -webkit-transition: all 0.2s linear;
  254. -webkit-transition: all 0.2s linear;
  255. -moz-transition: all 0.2s linear;
  256. transition: all 0.2s linear;
  257. z-index:9999;
  258. }
  259. #header:hover{
  260. opacity:0.97;
  261.  
  262. -webkit-transition: all 0.2s linear;
  263. -webkit-transition: all 0.2s linear;
  264. -moz-transition: all 0.2s linear;
  265. transition: all 0.2s linear;
  266. }
  267.  
  268.  
  269.  
  270.  
  271. .title{
  272. line-height: 12px;
  273. font-family:A Dripping Marker;
  274. font-size:20px;
  275. color:{color:Title};
  276. font-weight: normal;
  277. }
  278.  
  279. .perma{
  280. top:0px;
  281. left:-39px;
  282. opacity:0;
  283. position:absolute;
  284. -webkit-transition: all 0.3s linear;
  285. -moz-transition: all 0.3s linear;
  286. transition: all 0.3s linear;
  287. }
  288.  
  289. .entry:hover .perma{
  290. opacity:1;
  291. -webkit-transition: all 0.3s linear;
  292. -moz-transition: all 0.3s linear;
  293. transition: all 0.3s linear;}
  294.  
  295. .permaa{
  296. top:0px;
  297. right:8px;
  298. opacity:0;
  299. position:absolute;
  300. -webkit-transition: all 0.3s linear;
  301. -moz-transition: all 0.3s linear;
  302. transition: all 0.3s linear;
  303. }
  304.  
  305. .entry:hover .permaa{
  306. opacity:1;
  307. -webkit-transition: all 0.3s linear;
  308. -moz-transition: all 0.3s linear;
  309. transition: all 0.3s linear;}
  310.  
  311. .like_buttons {
  312. border-radius: 3px;
  313. list-style: none;}
  314.  
  315. .reblog_buttons{
  316. border-radius: 3px;
  317. list-style: none;}
  318.  
  319. .like_buttons li {
  320. float: left;
  321. margin-left: 7px;
  322. padding: 3px;
  323. height: 20px;
  324. background:rgba(0,0,0,.12);}
  325.  
  326. .reblog_buttons li {
  327. float: right;
  328. right: 7px;
  329. padding: 3px;
  330. height: 20px;
  331. background:rgba(0,0,0,.12);}
  332.  
  333. .descriprion_icons{
  334. position: absolute;
  335. display: block;
  336. width: 25px;
  337. height: 25px;
  338. left: 50%;
  339. top: 70%;
  340. margin-top: -12px;
  341. background: url(http://static.tumblr.com/dbek3sy/ZQDlsyx5t/icons.png) no-repeat;
  342. opacity:0;
  343. filter:alpha(opacity=0);
  344. z-index: 9999;
  345. }
  346. .reblog_icon{
  347. background-position: 0px 0px;margin-left: -30px;
  348. -webkit-transition: all 0.25s ease;
  349. -moz-transition: all 0.25s ease;
  350. transition: all 0.25s ease;
  351. -o-transition: all 0.25s ease;
  352. }
  353. .permalink_icon{
  354. background-position: -25px 0px;margin-left: 5px;
  355. -webkit-transition: all 0.45s ease;
  356. -moz-transition: all 0.45s ease;
  357. transition: all 0.45s ease;
  358. -o-transition: all 0.45s ease;
  359. }
  360. .entry:hover .descriprion_icons{top: 50%;opacity:1;filter:alpha(opacity=100);}
  361.  
  362. #infscr-loading{
  363. bottom: -70px;
  364. position: absolute;
  365. left: 50%;
  366. margin-left:-8px;
  367. width:16px;
  368. height:11px;
  369. overflow:hidden;
  370. margin-bottom: 50px;
  371. }
  372.  
  373. #postnotes{
  374. text-align: justify;}
  375.  
  376. #postnotes blockquote{
  377. border: 0px;}
  378.  
  379. blockquote{
  380. padding:0px 0px 2px 5px;
  381. margin:0px 0px 2px 10px;
  382. border-left: 1px solid #555555;
  383. }
  384.  
  385. blockquote p, ul{
  386. margin:0px;
  387. padding:0px;
  388. }
  389.  
  390. a img{border: 0px;}
  391.  
  392.  
  393. ul, ol, li{list-style:none; margin:0px; padding:0px;}
  394.  
  395. .user_1 .label, .user_2 .label, .user_3 .label, .user_4 .label, .user_5 .label, .user_6 .label,
  396. .user_7 .label, .user_8 .label, .user_9 .label {color:{color:text};}
  397.  
  398. .notes img{width:10px; position:relative; top:3px;}
  399. <--ses-->
  400. small{font-size: 90%;}
  401. #links{
  402. font-size:9px;
  403. font-weight:normal;
  404. font-family:arial;
  405. line-height:10px;
  406. text-align:center;
  407. word-spacing:5px;
  408. text-transform:lowercase;
  409. margin-bottom:-5px;
  410. }
  411. #links a{
  412. background:{color:link bg};
  413.  
  414. -webkit-transition: all .7s ease;
  415. -moz-transition: all .7s ease;
  416. -o-transition: all .7s ease;
  417. transition: all .7s ease;}
  418. #links a:hover{
  419. background:{color:link bg hover};
  420.  
  421. -webkit-transition: all .4s ease;
  422. -moz-transition: all .4s ease;
  423. -o-transition: all .4s ease;
  424. transition: all .4s ease;
  425. }
  426. {CustomCSS}
  427. #albumart { float:left; margin:0px 7px;}
  428. #player {
  429. width:220px;
  430. height:30px;
  431. overflow:hidden;
  432. position:absolute;
  433. margin-top:0px;
  434. opacity: 0.7;
  435. filter:alpha(opacity=70);
  436. -moz-opacity: 0.7;
  437. -khtml-opacity: 0.7;}
  438.  
  439. </style>
  440.  
  441. {block:IndexPage}
  442. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script><div style="visibility: hidden"><script type="text/javascript" src="http://static.tumblr.com/nihqh7v/CI0mp1pdw/jqueryinfintescroll.js"></script></div>
  443.  
  444.  
  445. <script type="text/javascript">
  446. $(window).load(function(){
  447. var $wall = $('#posts');
  448. $wall.imagesLoaded(function(){
  449. $wall.masonry({
  450. itemSelector: '.entry, .entry_photo',
  451. isAnimated : false
  452. });
  453. });
  454.  
  455. $wall.infinitescroll({
  456. navSelector : '#pagination',
  457. nextSelector : '#pagination a',
  458. itemSelector : '.entry, .entry_photo',
  459. bufferPx : 2000,
  460. debug : false,
  461. errorCallback: function() {
  462. $('#infscr-loading').fadeOut('normal');
  463. }},
  464. function( newElements ) {
  465. var $newElems = $( newElements );
  466. $newElems.hide();
  467. $newElems.imagesLoaded(function(){
  468. $wall.masonry( 'appended', $newElems,{isAnimated: false}, function(){$newElems.fadeIn('slow');} );
  469. });
  470. }); $('#posts').show(500);
  471. });
  472. </script>
  473.  
  474.  
  475. {/block:IndexPage}
  476.  
  477.  
  478. <title>{title}</title>
  479.  
  480. <link rel="shortcut icon" href="{Favicon}" />
  481. <meta name="viewport" content="width=820" />
  482.  
  483. </head>
  484.  
  485. <body>
  486. <div class="wrapper">
  487. </div>
  488. <div id="cage">
  489. <div id="center">
  490. <div id="header">
  491. <div id="links">
  492. <li class="drawer">
  493. <h4>
  494. {block:Ifbanner}
  495. <img style="width:auto; height:50px;" src="{image:banner}">
  496. {/block:Ifbanner}
  497. {block:Ifnotbanner}
  498. <center><div id="titleok">{block:ifshowtitle}{title}{/block:ifshowtitle}</div>{/block:Ifnotbanner}
  499. <center><br>
  500.  
  501. </h4>
  502. <div align="center">
  503.  
  504. <div style="margin-top:8px; word-spacing:0px;">
  505. {description}</div>
  506. <center><br>
  507. <a href="{text:link 1}">{text:link 1 title}</a>&nbsp;
  508. <a href="{text:link 2}">{text:link 2 title}</a>&nbsp;
  509. <a href="{text:link 3}">{text:link 3 title}</a>&nbsp;
  510. <a href="{text:link 4}">{text:link 4 title}</a>&nbsp;
  511. <a href="{text:link 5}">{text:link 5 title}</a>&nbsp;
  512. <a href="{text:link 6}">{text:link 6 title}</a>&nbsp;
  513. <a href="{text:link 7}">{text:link 7 title}</a>&nbsp;
  514. <a href="{text:link 8}">{text:link 8 title}</a>&nbsp;
  515. <a href="{text:link 9}">{text:link 9 title}</a>&nbsp;
  516. </div>
  517. </li>
  518. </div>
  519. </div>
  520. </center>
  521.  
  522.  
  523. <div class="left">
  524. <div id="posts">
  525. {block:Posts}
  526. <div class="entry">
  527. {block:Text}{block:Title}<span class="title">{Title}</span>{/block:Title}<span class="body">{Body}</span><p align=right><span class="permalink"><a
  528. href="{Permalink}"><a href="{Permalink}"><a href="{Permalink}"><big><b>♦</b></big></a></a><br>{/block:HasTags}</span></align>
  529. {/block:Text}
  530.  
  531. {block:Link}<a href="{URL}" class="title">{Name}</a>{block:Description}<div class="body">{Description}</div>{/block:Description} <p align=right><span
  532.  
  533. class="permalink"><a href="{Permalink}"><big><b>♦</b></big></a> <a href="{Permalink}"></span></align>{block:Link}
  534.  
  535. {block:Photo}
  536. {block:IndexPage}{LinkOpenTag}
  537. <div class="photo">
  538. <a href="{permalink}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%"/></a></div>{LinkCloseTag}
  539.  
  540. <a href="{permalink}" title="permalink" class="descriprion_icons permalink_icon"></a>
  541. <a href="{reblogurl}" title="reblog" class="descriprion_icons reblog_icon"></a>
  542.  
  543.  
  544. {/block:IndexPage}
  545. {block:PermalinkPage}{LinkOpenTag}<a href="{permalink}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="500"/></a>{LinkCloseTag}{/block:PermalinkPage}
  546. {/block:Photo}
  547.  
  548. {block:Photoset}
  549. {block:Photos}
  550. <div class="media">
  551. <div class="perma">
  552. <ul class="like_and_reblog_buttons">
  553. <li>{ReblogButton color="white"}</li>
  554. <li>{LikeButton color="white"}</li>
  555. </ul></div>
  556. {LinkOpenTag}
  557. <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"/>
  558. {LinkCloseTag}
  559. </div>
  560. {/block:Photos}
  561. {/block:Photoset}
  562.  
  563. {block:Quote}<span class="title">"{Quote}"</span> — {block:Source}<b>{Source}</b>{/block:Source}<br><p align=right><span class="permalink"><a
  564.  
  565. href="{Permalink}"><big><b>♦</b></big></a> <a href="{Permalink}"> </span>{/block:Quote}
  566.  
  567. {block:Chat}{block:Title}<span class="title">{Title}</span>{/block:Title}
  568. <ul class="chat">
  569. {block:Lines}
  570. <li class="user_{UserNumber}">
  571. {block:Label}
  572. <span class="label">{Label}</span>
  573. {/block:Label}
  574.  
  575. {Line}
  576. </li>
  577. {/block:Lines}
  578. <p align=right><span class="permalink"><a href="{Permalink}"><big><b>♦</b></big></a> <a href="{Permalink}">
  579. {/block:Chat}
  580.  
  581. {block:Audio}
  582. <div id="player">{AudioPlayerWhite} </div>
  583. <div id="albumart">{block:AlbumArt}<img src="{AlbumArtURL}" width="200">{/block:AlbumArt}</div>
  584. {PlayCountWithLabel}<br><a href="{ReblogURL}" target="_blank"></a>
  585. {/block:Audio}
  586.  
  587. {block:Video}
  588. <center>
  589. {Video-250}</center>
  590. {PlayCountWithLabel}<br><a href="{ReblogURL}"target="_blank"></a>
  591. {block:Video}
  592.  
  593. {block:Answer}
  594.  
  595. <font size="3">{Asker}</font> asked: <br> <br><b>{Question}</b><br>
  596. <br>
  597. <b>Answer:</b>{Answer}
  598. <br><big><b>♦</b></big>
  599. {/block:Answer}
  600. {block:PostNotes}<div align="middle">{caption}</div>
  601. <center>
  602.  
  603. {block:NoteCount}<big><b>♦</b></big><br>{/block:NoteCount}
  604.  
  605. {block:HasTags}
  606. tags: {block:Tags}<a href="{TagURL}">{Tag}. </a>{/block:Tags}<br> {/block:HasTags}
  607. {block:RebloggedFrom}
  608. reblogged from <a href="{ReblogParentURL}">{ReblogParentName}</a><br>
  609. posted by <a href="{ReblogRootURL}">{ReblogRootName}</a>
  610.  
  611. {/block:RebloggedFrom}
  612. </center></span>
  613. <br>
  614. <div id="postnotes">{PostNotes}</div><br>
  615.  
  616. <center>{block:ContentSource}
  617. <br><a href="{SourceURL}">
  618. {lang:Source}:
  619. {block:SourceLogo}
  620. <img src="{BlackLogoURL}" width="{LogoWidth}"
  621. height="{LogoHeight}" alt="{SourceTitle}" />
  622. {/block:SourceLogo}
  623. {block:NoSourceLogo}
  624. {SourceLink}
  625. {/block:NoSourceLogo}
  626. </a>
  627. {/block:ContentSource}</center>
  628.  
  629. {/block:PostNotes}
  630. </div>
  631. {/block:Posts}
  632. </div></div>
  633.  
  634. {block:IndexPage}
  635. {block:Pagination}
  636. <div id="pagination">
  637. {block:NextPage}
  638. <a id="nextPage" href="{NextPage}"></a>
  639. {/block:NextPage}
  640. {block:PreviousPage}
  641. <a href="{PreviousPage}"></a>
  642. {/block:PreviousPage}
  643. </div>
  644. {/block:Pagination}
  645. {/block:IndexPage}
  646. </body>
  647. </html>
  648. <div style="float: left; position: fixed; top: 28px; right: 6px;"><a href="http://ariauagrande.tumblr.com" target="_blank">
  649. <img class="normal" src="http://static.tumblr.com/dbek3sy/zESllc4x6/install_theme.png" alt="install theme" />
  650. </a><div style="position:fixed; bottom:10px; left:10px;">
  651. <a href="http://ariauagrande.tumblr.com" target="_blank"><img class="normal" src="http://static.tumblr.com/npfupbw/DT1mry89z/credit.png"</a>
  652. </a>
Advertisement
Add Comment
Please, Sign In to add comment