From 768ec3632f8a3b1fcb4b61acb8fb2a9cc1f3515c Mon Sep 17 00:00:00 2001 From: Zed Date: Thu, 15 Aug 2019 04:00:40 +0200 Subject: [PATCH] Use custom icon font for a cleaner design --- public/css/fontello.css | 53 ++++++++++++++++++++++++++++++++++++ public/{ => css}/style.css | 50 ++++++++++++++-------------------- public/fonts/LICENSE.txt | 39 ++++++++++++++++++++++++++ public/fonts/fontello.eot | Bin 0 -> 8916 bytes public/fonts/fontello.svg | 46 +++++++++++++++++++++++++++++++ public/fonts/fontello.ttf | Bin 0 -> 8748 bytes public/fonts/fontello.woff | Bin 0 -> 5552 bytes public/fonts/fontello.woff2 | Bin 0 -> 4620 bytes src/views/general.nim | 10 ++++--- src/views/profile.nim | 10 +++---- src/views/renderutils.nim | 17 ++++++++++-- src/views/tweet.nim | 16 +++++------ 12 files changed, 192 insertions(+), 49 deletions(-) create mode 100644 public/css/fontello.css rename public/{ => css}/style.css (97%) create mode 100644 public/fonts/LICENSE.txt create mode 100644 public/fonts/fontello.eot create mode 100644 public/fonts/fontello.svg create mode 100644 public/fonts/fontello.ttf create mode 100644 public/fonts/fontello.woff create mode 100644 public/fonts/fontello.woff2 diff --git a/public/css/fontello.css b/public/css/fontello.css new file mode 100644 index 0000000..2d9f3b8 --- /dev/null +++ b/public/css/fontello.css @@ -0,0 +1,53 @@ +@font-face { + font-family: 'fontello'; + src: url('/fonts/fontello.eot?39973630'); + src: url('/fonts/fontello.eot?39973630#iefix') format('embedded-opentype'), + url('/fonts/fontello.woff2?39973630') format('woff2'), + url('/fonts/fontello.woff?39973630') format('woff'), + url('/fonts/fontello.ttf?39973630') format('truetype'), + url('/fonts/fontello.svg?39973630#fontello') format('svg'); + font-weight: normal; + font-style: normal; +} + + [class^="icon-"]:before, [class*=" icon-"]:before { + font-family: "fontello"; + font-style: normal; + font-weight: normal; + speak: none; + + display: inline-block; + text-decoration: inherit; + width: 1em; + text-align: center; + + /* For safety - reset parent styles, that can break glyph codes*/ + font-variant: normal; + text-transform: none; + + /* fix buttons height, for twitter bootstrap */ + line-height: 1em; + + /* Font smoothing. That was taken from TWBS */ + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.icon-help-circled:before { content: '\e800'; } /* '' */ +.icon-attention:before { content: '\e801'; } /* '' */ +.icon-comment:before { content: '\e802'; } /* '' */ +.icon-ok:before { content: '\e803'; } /* '' */ +.icon-link:before { content: '\e805'; } /* '' */ +.icon-calendar:before { content: '\e806'; } /* '' */ +.icon-location:before { content: '\e807'; } /* '' */ +.icon-down-open-1:before { content: '\e808'; } /* '' */ +.icon-picture-1:before { content: '\e809'; } /* '' */ +.icon-lock-circled:before { content: '\e80a'; } /* '' */ +.icon-down-open:before { content: '\e80b'; } /* '' */ +.icon-info-circled:before { content: '\e80c'; } /* '' */ +.icon-retweet-1:before { content: '\e80d'; } /* '' */ +.icon-search:before { content: '\e80e'; } /* '' */ +.icon-pin:before { content: '\e80f'; } /* '' */ +.icon-ok-circled:before { content: '\e810'; } /* '' */ +.icon-cog-2:before { content: '\e812'; } /* '' */ +.icon-thumbs-up-alt:before { content: '\f164'; } /* '' */ diff --git a/public/style.css b/public/css/style.css similarity index 97% rename from public/style.css rename to public/css/style.css index db44f47..a633117 100644 --- a/public/style.css +++ b/public/css/style.css @@ -107,29 +107,19 @@ a:hover { text-overflow: ellipsis; } -.icon { +.verified-icon { color: #fff; + background-color: #1da1f2; border-radius: 50%; + flex-shrink: 0; + margin: 2px 0 3px 3px; + padding-top: 2px; + height: 12px; + width: 14px; + font-size: 8px; display: inline-block; text-align: center; vertical-align: middle; - flex-shrink: 0; - margin: 2px 0 3px 3px; -} - -.verified-icon { - background-color: #1da1f2; - height: 14px; - width: 14px; - font-size: 10px; -} - -.protected-icon { - background-color: #353535; - height: 18px; - width: 18px; - font-size: 12px; - font-weight: bold; } .tweet-date { @@ -215,14 +205,14 @@ nav { height: 35px; } -.site-about { - font-size: 17px; - padding-right: 2px; - margin-top: -0.75px; +.item.right a { + font-size: 16px; + padding-left: 4px; } -.site-settings { - font-size: 18px; +.item.right a:hover { + color: #ffaca0; + text-decoration: unset; } .attachments { @@ -902,12 +892,8 @@ video, .video-container img { } .quote-sensitive-icon { - font-size: 25px; - width: 37px; - height: 32px; - background-color: #4e4e4e; - padding-bottom: 5px; - margin: 0; + font-size: 40px; + color: #909090; } .card { @@ -1119,3 +1105,7 @@ legend { margin-left: 6px; margin-top: 4px; } + +.icon-container { + display: inline; +} diff --git a/public/fonts/LICENSE.txt b/public/fonts/LICENSE.txt new file mode 100644 index 0000000..1d98124 --- /dev/null +++ b/public/fonts/LICENSE.txt @@ -0,0 +1,39 @@ +Font license info + + +## Entypo + + Copyright (C) 2012 by Daniel Bruce + + Author: Daniel Bruce + License: SIL (http://scripts.sil.org/OFL) + Homepage: http://www.entypo.com + + +## MFG Labs + + Copyright (C) 2012 by Daniel Bruce + + Author: MFG Labs + License: SIL (http://scripts.sil.org/OFL) + Homepage: http://www.mfglabs.com/ + + +## Font Awesome + + Copyright (C) 2016 by Dave Gandy + + Author: Dave Gandy + License: SIL () + Homepage: http://fortawesome.github.com/Font-Awesome/ + + +## Elusive + + Copyright (C) 2013 by Aristeides Stathopoulos + + Author: Aristeides Stathopoulos + License: SIL (http://scripts.sil.org/OFL) + Homepage: http://aristeides.com/ + + diff --git a/public/fonts/fontello.eot b/public/fonts/fontello.eot new file mode 100644 index 0000000000000000000000000000000000000000..43d722ffd608bfa1fe7ffac8ff77b9e2231db2ba GIT binary patch literal 8916 zcmd^Edu&_Rc|Ygg%QwY`__Rn#m%I`sk(ZQANt7ZhGDE!_TXkhwc1bt2NlVnj)`OGf zGzromYrMeIwl?*GtVq(rD^joRir~ubimvm#U@L}gSht~Av-O`ME3i%rhHTBUA_#10 zzweS#Y{y-J{<|xld%p9X@0|0U?|JUgKSmi-Q8*JAJpwa`IsnWIoS=!xYWu^tjz;r` zT5|qF>@MVDb8MBZuys~uOZZzwhl5R_HP0@hU1Dp%_}NKd*4PEMs8h>qKTEML^gL)h z(6p$NJTwVeuP0}gOO?gowL!GMh8;aV^Z2@K z{HGmk(CTDkJCk0fp~7I_Wr=k>i? zA)Fy5jEqf8GsjYCeT6kJ3BB}?Z0?5n(&BuHnQJ{9ebmc=;mo*;6+g>gU@c>)whX&4DCps!bFmoy2o^Ahgq4iUgwYoC z*_fTx!O)zba+BaW?ezcqL-tJKtUizmfqD~~*s2vslWo-sX>O}lNPAn*CKb}^79>iA zY-r0=Es#Ikf~8R*i`%kP3v|M^pk*qg?JZliKu>H7Tv36>*j8P&KzD4*Q7zCS+j3S5 z^vSm1nN-L_w`dP2&@n8qT68xPcW&>zAigZB;KI)ivV8VLe?|}u9xjN&I5SEH$!J(c zbdwC?c_s>yD4aJz0FseOMKc#T7p74OJkQXWuv$24i$&$eklSJLTm1%!nYr0w@FsW$ z>q(HAC!Oid#1cGeG?FOrkD_G62f?gzt(VWD%(CHt+-rA?Jk$u?zdWfHlssYl8pXvN{kEJ?^lOe z`P01qPE#!06l*~d_@StJbfO`?AW043pw}C$_uI`*li6)Cdk4&t-Q{)FN13>@v-6wc z*Trr~ubFkQWHugZ5a5;LjHqDo}VtgR+LIHv&8LIE|?|JX>j<>;jky3 zzB2vjrDA{aHJz`UBDsr^8E+Uwo=mv=0zAOmzH*Jv z5B3LDz}DJgKzRM>KJNDdf*@i&Lcxhh!wvjD`uo3pcw#8+2*(}iLthSugV}J})$WK!)0r#l4o9@5y}$Bu|BEB_JuaH0 zYwAkFM7lwk>wmfb%ZJjA_9jQyp;yC)gALY(G?Aw>dLTwD*?CpGB+4wnLa;uC6|D!{t3 zNh9YY5~2vNh{#U@n?}WiJd`d>xSX7MJ9Z3sPY*Q@n!yIisM?|rX5=Hl1hs;_^`m3GBqH*dyb zt~BBxV#B7?DcTS}ozPDwJCU7g^a@-A@7z&mw@3mD``|9pIQE19C@n)tT;xVrD{Ymt zB9jaTX_`rrAx~C4;dZ4GF=b!C)$DHech9nV_*gXbd<%FAtp>!cQ2y{m%7MypcEEe$Hg&cBA+ilbu_S^|ao8t|h~JTE)+_ z_6Y9ekdQl>lLodw_~87F0&o0%tNG3;A~Xxv%+~rlr&@b>rbW0$73Dg_mA7$%F++zD z)}8HQMzhHvih@x*jcqVG@7WL4q9L#2j|PLmNHEgs^||Xk^%g@2QBh9@5(`A!N-z9O zKu9kzm@oe&r2CK)*?5B_IW#e9q?0+)l7cF5zj|!7$5Z4@S9Uu?&f zb(S~K5qlz+^+#HR5x=k9V>L7;TD`_L*l{N^Pq$l%ra0+@)L}F!z6e3B6s2`XMQrMg zR3WnYX5Peo?(Vc-_#2q-zZ;B#h`4gz>E-4dHramN;&+_qk5~)^iI>gS?XvBL8JO)` zgn^+4C4Inohu;Rv7eu5m{&9cE`lj9frZw#4ZyJ{jKdH06Sy%U_HRONObly;h6ek)4 zv$%bo5-#PbKNq9I+c+mQFg4rZMz@io+Bob`L`*0WjWA7d4lW|F2~WV&CK-Z>R!T~p zlzd{Yj7&$MR%9eSzKK#(Fx4X8Iz094t#5JmMru2FS$hV*qtS3mmT$#xarW(7&*l$* zBY*js>(4(^<>Q?29Ac6UABXTx2p$Fx`!gE_qytv87z9`si3heP)`^cMRZq9u8}0V_ zbR}>c%A&?bPCOW(5Jhxw6B45c{@Qvn-EQbb4>RahSaJcTHxbSEtuGy26{{197hQt9<(>D>Yf} z#uyiC%r>~3jyfAGh7Mg6TR4RkPraa@uxhcS4{@8f;qUI)aeZ-No{!9L-#m9;z<6nK zVS$eaAWT^ths)w)3I`8J z7B+SlPo1emyt%1CLPBx(_Q4hV0ys-`2mFD)fC)D0gJT3tZ8+a5ZLu~}TVJfLuc~VY zf5{OnE??~EbiL|ICN3@)gN~P~s6-N|&JG>*{pqKs@#8h3GXWwBoLRnjH&Ja|N9XCm z>FFm<3RB>a;`XNa89i48*$H+ud*m=To0>!PS%{Fh-;Lud(v-<;T4iR@ylTXO0!LdI z?i0@^hcOFTB6Cxj zPij9r;~e}SW)ru7VLy6m>65!PvcaO%g)B*5c<_7u!5IDfpGlqQ|8J>FpQ+ZVS00*4 z{Nm1S@#{M~I!tXDB5AHpJ2-2>rqn z!d0% zX1z5S5uQCkbl3ie{Kcix+HP~V zK3QJ7u(-M+?@x8@qQ=WB<+aj!d6s6s@c4XseSJ=zTU%Y0$7=J+m9^D#<(c)=!uon; zptEy#B&~<^y2>i-N!^e9hF4uIfWHyHS?i*4W@}RzRm}dsmDP1b-zz*Ob-uaPz?CuX%wd;?#V|n0%`wyJa zC2qjU$;8dv!mZqf13?`^oRhn_o7Zy>_cHrJd8v||SzMc0D$iO<>+9u}b*SA0g)IXV zR?kaIi!0~NGo_{S%4})POt+jwVVhn3^h$EIQeH{!w^SBq)-SG=ll$%HKEF5J9*KQ% zWo~s3y;ffTbh*5q+;6;4F0IWhh?T_^>+0Sx!_4Y@GF`X6aB=zUh2+Ibvb40W?-9up zw}j4*>^I2tKk+zD^(Y!sWsRN4j}~P4$ak3I*b&Wm{8V1+32E(x;+(v3BCiRpr9U>q zeP?Erv!O^tV+D;3Dp&)NoiAu9tJ5aTjtaVX;7g4@3nU}%DMoHGJlldYrGWA&r z$`F((hKhwkA*As{p`d7NGG8tflA5T>qp~KomcWoT%a$vup@nTYwR0Vv= zvzvyqIhlH@i_;tZqcfTqj{rX`Z^#>%d$Y^XiftXs7biodsX|^Upf`IwkFF4HsFGJS_?*D@ZQ$$9%Lt*QF7O9R&g{R2`Q06Jd)Jv)J;Jc)n-d0NzI{R1G22yhY!=f z04TYFR!6NVwCd1GYEDe!(nTUe0yAJ+a|{>djiRhMAhe|BQjbjMH>KH;LW@>cR-Q;| zZuQ8q{E_2TWGDi>N5|Kzo6I?UBERW$LVu;4=1h>0!gO<+c6!y}rExzrA+}EDH_37# ztlS3FOUuS13Wn{%p=v)3f$dXo0XrE7|Kmj{@g7zE0tMn98y*EB9@f~RJgV7XlvXTU%*jP8|3@wt$4yBtw^7`zHzu^TL?{X|d9gQ7BB}Y*O-{8R za;7?IQYwNOefvG*KN^H_cQxs+$(7n^dONC4L1)n!!jDCXm4h z)e$g4brg(Ht$-1#Tfhj_tzd-e7#N|t4UACT4o0Z%P~}10&f_Zf?<&f}Bnwhn3ANTi zMwL*tctVTAT~t`=I85q+{-Tun6^d2=Ck5;!sU`Px!2OyU*SN1smvZWEsodMusmi@N zpIxBgqaSrwM1cpgMR?|?|93GqGNklxc5)wfvLE{fqYoTXgw>Y%lUiC$1qPE^_b(%b zh0TDx2dZHHRyie)lV?JNk8W&?E8~a+dBkkQJh*E&?vuP&zZW6I59`NIC($g!iSkBD zk>$Y+%$51DTTWHy&?L+WDp@O%GiQ(GZwRs|hi(Wlv7wNo0B1(1#Clj!8G~y<|0!Anj zO7L#T-T*^F+`f+!%vi$UR-FmFkwz$leYh5^q>p4EV|7EUCIe*K)x|{yxGP;UE(KnZf|FEvd<4M)0ea6;clZ0tO>z7| zhViRdAIXj4%AnF8irl5|NTJ4Kj)bu*)M46xgd|Ta*7mWtSzS9MOLa`>SqrR|3= zj{XAt7-B8=dbBiX##OBc)ghAFDC8=SA!qH%=~0!;Q9A^&9#*e2_6UF@05|~?>UFMT zJ_bO?93`3@x;{=c1WXbQ0mq1jfGMIG0&tvY2$&`s0!|PO0Vjzj3*Zw(LqMKr2q+K@ z0jG#&7{DiqhJeS2hJa5I4FRW#<{*GGL_5>i+>9P(H>58fi?2)cgLnp21 z5Rv|x4iV{^dISFl*gYBL5}LWJi7k^)P^w8X9J2pv3I`DWIRxeEvAVL!3_0wc#R<4! z6}Y(yIhYO^bKe!-K(_^0Q|`MgTZKh7vf08fAH%8fa(+{s9odXg>$~P>@iCpfJcFYX aNN_kV+^`GW9{&#C`3+6_9V80eDf}-j%qRE& literal 0 HcmV?d00001 diff --git a/public/fonts/fontello.svg b/public/fonts/fontello.svg new file mode 100644 index 0000000..90cf3ca --- /dev/null +++ b/public/fonts/fontello.svg @@ -0,0 +1,46 @@ + + + +Copyright (C) 2019 by original authors @ fontello.com + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/public/fonts/fontello.ttf b/public/fonts/fontello.ttf new file mode 100644 index 0000000000000000000000000000000000000000..6d82a62b3e922b43ceb408f5866200372f015feb GIT binary patch literal 8748 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 P`x~0{J17+RP2qn5)lC)d literal 0 HcmV?d00001 diff --git a/public/fonts/fontello.woff b/public/fonts/fontello.woff new file mode 100644 index 0000000000000000000000000000000000000000..100da96cc2cc9d6da71729c8518da7621c36dfbe GIT binary patch literal 5552 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 CF)*zF literal 0 HcmV?d00001 diff --git a/public/fonts/fontello.woff2 b/public/fonts/fontello.woff2 new file mode 100644 index 0000000000000000000000000000000000000000..56cd672662c0b825959ede0ec4b1064beda39df5 GIT binary patch literal 4620 zcmV+n67%hMPew8T0RR9101^xU4*&oF03s{^01>hP0RR9100000000000000000000 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 0: @@ -53,7 +55,7 @@ proc renderSearch*(): VNode = tdiv(class="search-panel"): form(`method`="post", action="search"): input(`type`="text", name="query", autofocus="", placeholder="Enter usernames...") - button(`type`="submit"): text "🔎" + button(`type`="submit"): icon "search" proc renderError*(error: string): VNode = buildHtml(tdiv(class="panel")): diff --git a/src/views/profile.nim b/src/views/profile.nim index c3c9358..513b0d9 100644 --- a/src/views/profile.nim +++ b/src/views/profile.nim @@ -1,8 +1,8 @@ import strutils, strformat import karax/[karaxdsl, vdom, vstyles] -import ../types, ../utils, ../formatters import tweet, timeline, renderutils +import ../types, ../utils, ../formatters proc renderStat(num, class: string; text=""): VNode = let t = if text.len > 0: text else: class @@ -27,17 +27,17 @@ proc renderProfileCard*(profile: Profile): VNode = if profile.location.len > 0: tdiv(class="profile-location"): - span: text "📍 " & profile.location + span: icon "location", profile.location if profile.website.len > 0: tdiv(class="profile-website"): span: - text "🔗 " + icon "link" linkText(profile.website) tdiv(class="profile-joindate"): span(title=getJoinDateFull(profile)): - text "📅 " & getJoinDate(profile) + icon "calendar", getJoinDate(profile) tdiv(class="profile-card-extra-links"): ul(class="profile-statlist"): @@ -50,7 +50,7 @@ proc renderPhotoRail(profile: Profile; photoRail: seq[GalleryPhoto]): VNode = buildHtml(tdiv(class="photo-rail-card")): tdiv(class="photo-rail-header"): a(href=(&"/{profile.username}/media")): - text &"🖼 {profile.media} Photos and videos" + icon "picture-1", $profile.media & " Photos and videos" tdiv(class="photo-rail-grid"): for i, photo in photoRail: diff --git a/src/views/renderutils.nim b/src/views/renderutils.nim index eab66cf..c42c76e 100644 --- a/src/views/renderutils.nim +++ b/src/views/renderutils.nim @@ -2,6 +2,18 @@ import karax/[karaxdsl, vdom, vstyles] import ../types, ../utils +proc icon*(icon: string; text=""; title=""; class=""; href=""): VNode = + var c = "icon-" & icon + if class.len > 0: c = c & " " & class + buildHtml(tdiv(class="icon-container")): + if href.len > 0: + a(class=c, title=title, href=href) + else: + span(class=c, title=title) + + if text.len > 0: + text " " & text + proc linkUser*(profile: Profile, class=""): VNode = let isName = "username" notin class @@ -12,9 +24,10 @@ proc linkUser*(profile: Profile, class=""): VNode = buildHtml(a(href=href, class=class, title=nameText)): text nameText if isName and profile.verified: - span(class="icon verified-icon", title="Verified account"): text "✔" + icon "ok", class="verified-icon", title="Verified account" if isName and profile.protected: - span(class="icon protected-icon", title="Protected account"): text "🔒" + text " " + icon "lock-circled", title="Protected account" proc genImg*(url: string; class=""): VNode = buildHtml(): diff --git a/src/views/tweet.nim b/src/views/tweet.nim index 1ae2be4..407dd4e 100644 --- a/src/views/tweet.nim +++ b/src/views/tweet.nim @@ -1,17 +1,18 @@ import strutils, sequtils import karax/[karaxdsl, vdom, vstyles] -import ../types, ../utils, ../formatters import renderutils +import ../types, ../utils, ../formatters proc renderHeader(tweet: Tweet): VNode = buildHtml(tdiv): if tweet.retweet.isSome: tdiv(class="retweet"): - span: text "🔄 " & get(tweet.retweet).by & " retweeted" + span: icon "retweet-1", get(tweet.retweet).by & " retweeted" + if tweet.pinned: tdiv(class="pinned"): - span: text "📌 Pinned Tweet" + span: icon "pin", "Pinned Tweet" tdiv(class="tweet-header"): a(class="tweet-avatar", href=("/" & tweet.profile.username)): @@ -70,7 +71,6 @@ proc renderGif(gif: Gif; prefs: Prefs): VNode = let thumb = gif.thumb.getSigUrl("pic") let url = gif.url.getSigUrl("video") if prefs.autoplayGifs: - video(class="gif", poster=thumb, autoplay="", muted="", loop=""): source(src=url, `type`="video/mp4") else: @@ -117,9 +117,9 @@ proc renderCard(card: Card; prefs: Prefs): VNode = proc renderStats(stats: TweetStats): VNode = buildHtml(tdiv(class="tweet-stats")): - span(class="tweet-stat"): text "💬 " & $stats.replies - span(class="tweet-stat"): text "🔄 " & $stats.retweets - span(class="tweet-stat"): text "👍 " & $stats.likes + span(class="tweet-stat"): icon "comment", $stats.replies + span(class="tweet-stat"): icon "retweet-1", $stats.retweets + span(class="tweet-stat"): icon "thumbs-up-alt", $stats.likes proc renderReply(tweet: Tweet): VNode = buildHtml(tdiv(class="replying-to")): @@ -145,7 +145,7 @@ proc renderQuoteMedia(quote: Quote): VNode = tdiv(class="quote-badge-text"): text quote.badge elif quote.sensitive: tdiv(class="quote-sensitive"): - span(class="icon quote-sensitive-icon"): text "❗" + icon "attention", class="quote-sensitive-icon" proc renderQuote(quote: Quote): VNode = if not quote.available: