From 052abe89875192ccb06bf7b9c5b57af0a4fbf51d Mon Sep 17 00:00:00 2001 From: =?utf8?q?Je=CC=81re=CC=81my=20Fabre?= Date: Thu, 20 Oct 2016 16:48:23 +0200 Subject: [PATCH] Playlist list --- .../src/assets/img/placeholder-media.png | Bin 0 -> 7113 bytes app/static/src/sass/modules/_all.scss | 1 + .../src/sass/modules/boxes/_media-box.scss | 73 ++++++++++++++++++ .../article/includes/article_card.html | 2 +- .../media/inc/playlist_audio_card.html | 21 ++++- .../media/inc/playlist_video_card.html | 22 +++++- .../media/inc/playlist_video_detail.html | 4 - app/templates/media/playlist_list.html | 30 +++++-- app/templates/pages/page.html | 4 +- 9 files changed, 136 insertions(+), 21 deletions(-) create mode 100644 app/static/src/assets/img/placeholder-media.png create mode 100644 app/static/src/sass/modules/boxes/_media-box.scss diff --git a/app/static/src/assets/img/placeholder-media.png b/app/static/src/assets/img/placeholder-media.png new file mode 100644 index 0000000000000000000000000000000000000000..24a01f45c169cdc928c872de483402ed33cae36b GIT binary patch literal 7113 zcmbVR2UL^UwvOWrj*5T{LKRU_6i7lRKo|v)j?x8$3B4wP1OlPxj1(0SouNq`2a(Z1KB60)- z0v$8Z*EI)$zWNaaIuQ2lSHMi)q)8R40l2M$s_k={w50xFl6NgZ^6o20V5iku5fQ9)8wT^^>auArtQE2#j5sX(Ag z5SY3gOc4%zm7tQpf24rb0$knU=DK>nuLX>>q&#sr3>*T%n| z3JP+7gd8>mg+m6*p|I!v(4gyvbqVmo;JnZ%$$gDTXLKM=OA4^`A1?S|{;3v){XI-T zz#zd$3?0jv)I=p7At@ihnpRyNSRY8gDTFdA!d@^<5)m6InN zuTJOZO8 zUktDi!2I>WUw7npfB&{4|8V}VJMz1~f7g-Uo&US(`Tu(L7c%nS68Cq#`rGOG2RHu) z&wzmKiWxS3b+3-)#9d;Tiyh(a);d6#mKVMiF%Q~HI6^IK{2B!2 z#oze%-GFi7wf(C4J|CY3>C_RVZv}R$+h0viH~_0(B)syUqSb;pY|5nR)z~o7*9VwaFPO=-rJN4K=VM5nwHP5_Z-rLmpV-!;&mFN_+MZtIfH4msNvZvhvf@;QzLe^W5yGM za(Z6%hf^})%QxAYbr8)=igtt@xqJsa(q&SK2KvyV|wjgu0c zPItkvNKima%l2-LVjR3B-LdQF=U43po0~EpS36pv0Vs9Rqf7WR=HD=kWT`gR7W!13 z{^b+$R!9h$Un6uYCY&fHm=*bawl8vJJ^YJ$%gPgyNV#srn!@Q%gKvpQ5WKJlY?rnD zc6<;`>llAkO`HGN=Q!HYh1&Gls^>*LGT36#Iedv%m`A4FF&4a=m2oTUqu;OuAm^D^ z93U{>@6uBA=ygJa$@!R~_0acVbU6y4(NTJ1tk^+dD_o*r@Jo60(#3+Ensi%%NshVm*)-9ZGl(EW=_2cp2`S* zqSKLFs7Fk&0^9x9ti~~C@V&w|9hhcFy56NgmWeD9tGG#WvKxKDa;Ka@2lNoorE<}D z4#CvKG*T$GI8oRmw-@?y>HL$2Ob=e|ly8k__ChDnvPm|dH;VAjOVYBAEo(=1E~bx` zz@n864}M5&%2}B=r(LbB$ys3-)1SU{hQ)!GlEQx#`?+%GChQAQSge)O)io_Xmp9gN zI|W_$)K-wyHS)}GWwuI=t@jes>r_cr0m18ogP71U#x1R>sSNw}sgUK)RlSnTY2yWD z<>90zmRP}vllI~@W{uXR+-L3LwM2F1la}R)*BRZwPPGy0y+pFr)aKR_6?ukwqtcyK z>nO{m+whzh^{?m%s_e(EMs>>tJgxc`@4=O+7Q(9CsTgykH8}-Ka7)bg{ezP8N9JL_ zi13W377R_^GyBEdtEkV?3F+mTR~jPU3I*Y>A_e@2FnPPu!mJ-@%tHZ!aJ7{@~75KE#Mp#T!lxO_)wl55!c?3Nch!PVup@q+PZD-2O zFD!Kx0=8DW225Y4HX&J`AB66_=usA0^>qJXqPO0AQw?p^BzngiQ>J8i5TkyMqAp4< z$z21dPR>Jo)a&BhN7Au2$C(;$507@r^+Q2@2_5R9W~R+&(9M*0r+Ui2WsY>+T}>-a zi3!#HP?uP?s>wUp{AEElY&XHs53n)rk&64Ge-1YE{b(GvW567ynex`MKYOcATq25F z&o?!N%zOIP=1W2{**LBTvhnR=Oi8y1^NDnjf2v!Nm|HjDaCpLR$4=|Jy4ZGTw2&>cQJ$@_z zmy8xug&xI>XzS}Fnijr*CLjtmlbjA@VIv#v<7U_i(MEnh8&TzQ@33ya6%ApqqHN51 zLxPfKTKjy8vPwUh5AIXz;>Y3Nilcw452{0r#|}V)`@K_NOirIa7AY>iSTlYAh|K({ zY&>8f14UO;NO!-L88$v&v$HP?O*9PNQ|Z)9oFBfHlCgEwBOokYI?0>y_2X${=_qe- zHTla%Jcd9x+QsQNPd!_6ciEcYj#-_s@XnAp!#(cN_LX}+1&C59kDe+e(R`M#@oWY7l0cY^{PhUwm%1@v^S%2@7%O>Or%(&}p zd_F`;-ck(=&0Qnl&KE0KI^~T|<(5@-4>i^$Bk=ks%fUS0Up&ls!oH$XC-!2j2ilIT zna9z#sPBuuQBoXjABnnw49_l~9=q*FTIR~OK;QI>OB{PG@OBcDARXezYga$}MAejspyR%p>j%T2?@W;{fj>g#*f z1xQOIrxLYkQg(QqCGSO@EwVQ=xdp5LgBHUsfh0Gj=w#DC=e#qRilkEM@N3kaheX2Y zo=N>wKDnXMKB#zX;RKnj_rm-zzw`(~6{T4+`dtfAM4X)r5VPdtSiAF_wu5}`U|nc_ z3@45$SZ_DCRT$T~GV9ac_X@mgc1E?Uc=qm>(zR_g`IYq&5UZPKH6!|}vmP)T(QD62 zLT!8^&WIi(lMNwNRg|6hI47+z0Y?OXntlGVZNsfSGPjUjSe&u4Wn_Q!>f?!v@o^D? zlsAi{RZWIx+G=v;sggiqZ~hJ2n3PL7<}NfdClOJWJN(c(1GksF*wBx|fSIx}tXQP? zYgS#VO>+AfQ3?4LBg0aFoEod!Mffhyg#FN2dcj_p`uJ|`)5c3JP)uxK0%7oyVC5Mb zQJK>nEgojgtCsO!!%fT{%=g}D)e_2bywKK2?LwLI47P?QB=RFCNo@_+Vtjd2!|#yW zw^$N$J0AX%!J3vFfjq-~YVw5nxc@5MJe zhh}pr*)_Y8^@8HUVpo=f37x~*&KV+j+u#H)^O>DcneW(wtWJnj-so%!TF?G>wOme}~pV<-+DLCY!w^W^noMz1@*C*I(Ag%&M3-?F6* zGPEGLDAH>F2qNB=_))VBsTh4Fad)Fj37@H6x>jvwR-3tIJ#y$fRa%)ag&iBWp{ly^ z@d5H)+S1G>+l2CN9@&(E3?XolN`cdcNt)QIlcEXp;gZ?83LUjmgc(QKr!`uvl zeTU5o9XUNo_sFg5T9joGqaS7LoN5J(Lgg1;nB3NzJMTbyK*f3`m_kI;@^`GlXf+74$s2vslS|-8&*= z>;6npFmZQL;qF3_v=EbDj=ZBX@%Fj4J&c!edX!_eCKEl`!HV;IJW>0(y!adC!FPCL zi7kq?%R&lfiuH_+Jq8G(6fL&amS#w=1M{A4e;rtn+}7iVlHWr!I8(W8)v4EtMZ1qx z7V+(%$S6$()jAvk$oo z-40*Q4@q2#MUD&3gCAjW>F(+!8{V0ha)&cxThm9c6)T5+bji+8f3+6tA@eZw*g{S8 zU2~&B3lDM#-8<&)n!+6ypc>jX;AW*}?bHxbfWyRRg?x8?^9I+xbjDj*PQNU4N$Ggv z&ntv2cN)k1imcngx~U%mH$I%(`?(eR#_W9O+-^~MN>dZk4lPNiZw2k{qzT^+O~0Lz zM;KYpTDwMe5uV!COz8AM4@|NV<2!ePqNWyXr{@eV4ZvG6(j&FG-iw@#F^0hdYrL0^71%kxWb;UZ-#W~ z-VH1c7P5Fz`hF|0yS3iiH$$WcsAh5bVn-{z zl04A;KN4X0w4ZIVEPIDOfo;lD->c}GY59ILq+3(jJe~`Yxu+BAQF7?ynE%0N&vgk{ zjp7+g34SBUHUY>S^du$CzVi81#S3fGk=jTgaqcxfaxHh4`1$M);{tw4$~aS0(}BDB zh^2`bsErg5$>_4P0Z&uc7Qb7p!785U$Z{`yRtx##O!wIl&I zExI{RiUP=7Zo8I=_E^rfZS!#74%mxyl7F>T_Jl(~QF$E+%z-Yk!ilJ@0m9+iI#DaT z!+2#w>V4`dGR7<4!6n=4o7}|ybf?qa_d6rrzjt;9kH2E{!=Mz(#D-0NNJx00)e)+3 zT;=T4R(e0rnaBJ~v-Q8bwPGITTZzm^yi3m$NLiz@?@g zP4X6`fOx-KtEh@}zEI47DnFMdSIl+OzROm6(?F~|X^q$x0cs*ubag_6VQW=fxipi$ zG0K~%=XFnGX~RjhSHtEq@CqK7JDO%s8t6`iBA zbCb$R^fOPnZ0W_@8}sIc7c}ek&}7GY=?XBuhw+Ga zJXQ^#92~tm#*1tbD8G$eEBtip=T+$PGb|(1$D=f{X*f(pLu z{*z@UIRtf3tPUtDm!5(3sbfDDSo-jf4mU`05O*7*X>qf`VPOyVHu&X7CKN{NRY`Ui z0!!^5UG2Vf3={8aH1ydv`$u09`KV-?1$xfbCt|zD@PlnxQthNO?);({>Fyn$*z#u+ z72(0v*ihc);As?1uxDx_Sfpdwo@JfyfH~W5?4_ZSDq$%UJNpFbcg};gp!_60=b@(2 zqQ>%Kj^2+yykE)};i;ZNgqtpw09Q+HJ*uNMKYx`xEER}S$+7gmq;;Ze28BASq5AVr zYD@JidHvZ15l>TM*A|EK>k2~rnomw4gQNrTsbK;Vrd3r=LslAflwIE=n_!BW1S!K{ zepm4YLfb}TaiptrNb9J&-xR>+lBR9 zzL3>hgsRWkH|{xjpQpup9ct`@dIDD_Rba-CkCX+vadB%CF6sK5%tn zJt2BaEFS5Qd4vSXtEA5s)Dh{y{y0XJ-nH4bTF%mv@@wdf1E+WA;lu);y?vYzU1N(F zoMo;8ok_W z*J?GHDu>pXO`Q>3k(>idm9}$QcRp>=ZKV+rxcga%R3TF9h#|iaQ){}h+_HYv%J^}v z+vQaETVVqis6+fCKWaDbjh7{+!p;#dC)!;s?Zp+qx~D`#GYmK)Q>s8U;`ox5`sw+`+PSRE z9Jtz&Ao-U_80r`|0ed|`lF1qT*w=ck2ml7Qx$RK{-0|G*G+Xxu6_UG{{a5_>!<(# literal 0 HcmV?d00001 diff --git a/app/static/src/sass/modules/_all.scss b/app/static/src/sass/modules/_all.scss index 19d493c3..e1387fa6 100755 --- a/app/static/src/sass/modules/_all.scss +++ b/app/static/src/sass/modules/_all.scss @@ -18,6 +18,7 @@ @import 'boxes/job-line-box'; @import 'boxes/product-box'; @import 'boxes/search-box'; +@import 'boxes/media-box'; // Sliders @import 'sliders/slider-page'; diff --git a/app/static/src/sass/modules/boxes/_media-box.scss b/app/static/src/sass/modules/boxes/_media-box.scss new file mode 100644 index 00000000..b9879d46 --- /dev/null +++ b/app/static/src/sass/modules/boxes/_media-box.scss @@ -0,0 +1,73 @@ +$module: ".media-box"; + +#{$module} { + + position: relative; + display: block; + @include margin-bottom(2); + + &__image { + + @include fluid-aspect(320 190); + + &:after { + font-family: FontAwesome; + display: block; + content: "\f04b"; + background: white; + width: 50px; + height: 50px; + border-radius: 50px; + + font-size: 25px; + + position: absolute; + top: 50%; + left: 50%; + margin-top: -25px; + margin-left: -25px; + + line-height: 50px; + text-align: center; + text-indent: 3px; + + } + + &--audio { + &:after { + content: "\f028"; + text-indent: 0px; + } + } + + } + + &__type { + + @include font-size(m); + @include line-height(1.25); + @include typeface(sans-serif); + @include margin(.25 0 0 0); + + } + + &__title { + + @include font-size(xl); + @include line-height(1.25); + @include typeface(sans-serif); + @include margin(0 0 .25 0); + + } + + &__desc { + + @include font-size(s); + @include line-height(.75); + @include typeface(serif); + @include margin(1 0 .25 0); + font-weight: weight(light); + + } + +} diff --git a/app/templates/magazine/article/includes/article_card.html b/app/templates/magazine/article/includes/article_card.html index f3e0aa97..256ebdaa 100644 --- a/app/templates/magazine/article/includes/article_card.html +++ b/app/templates/magazine/article/includes/article_card.html @@ -21,7 +21,7 @@ {% else %}
- +
{% endif %} {% endwith %} diff --git a/app/templates/media/inc/playlist_audio_card.html b/app/templates/media/inc/playlist_audio_card.html index caf524bd..4accaa95 100644 --- a/app/templates/media/inc/playlist_audio_card.html +++ b/app/templates/media/inc/playlist_audio_card.html @@ -1,5 +1,20 @@ -{% load mezzanine_tags keyword_tags i18n organization_tags %} +{% load mezzanine_tags keyword_tags i18n organization_tags staticfiles %} -
- {{ playlist.title }} +
+ +
+ {% if playlist.medias.all.0.media.poster_url %} + + {% else %} + + {% endif %} +
+
+ {{playlist.type}} +
+

{{ playlist.title }}

+
+ {{ playlist.description|richtext_filters|safe|truncatechars_html:200 }} +
+
diff --git a/app/templates/media/inc/playlist_video_card.html b/app/templates/media/inc/playlist_video_card.html index cc58d397..e033e8ac 100644 --- a/app/templates/media/inc/playlist_video_card.html +++ b/app/templates/media/inc/playlist_video_card.html @@ -1,6 +1,20 @@ -{% load mezzanine_tags keyword_tags i18n organization_tags %} +{% load mezzanine_tags keyword_tags i18n organization_tags staticfiles %} -
-
- {{ playlist.title }} +
+ +
+ {% if playlist.medias.all.0.media.poster_url %} + + {% else %} + + {% endif %} +
+
+ {{playlist.type}} +
+

{{ playlist.title }}

+
+ {{ playlist.description|richtext_filters|safe|truncatechars_html:200 }} +
+
diff --git a/app/templates/media/inc/playlist_video_detail.html b/app/templates/media/inc/playlist_video_detail.html index 0d8b4fc7..4806d6f7 100644 --- a/app/templates/media/inc/playlist_video_detail.html +++ b/app/templates/media/inc/playlist_video_detail.html @@ -2,10 +2,6 @@
{% for media in playlist.medias.all %} diff --git a/app/templates/media/playlist_list.html b/app/templates/media/playlist_list.html index 15ced91c..289f26cf 100644 --- a/app/templates/media/playlist_list.html +++ b/app/templates/media/playlist_list.html @@ -12,13 +12,29 @@ {% endeditable %} {% endblock %} +{% block meta_title %}{% trans "Media" %}{% endblock %} + +{% block page_sidebar %} + Filters +{% endblock %} + {% block page_content %} - {% for playlist in playlists %} - {% with playlist.type as type %} - {% with "media/inc/playlist_"|add:type|add:"_card.html" as template %} - {% include template %} + +
+ {% for playlist in playlists %} + {% with playlist.type as type %} + {% with "media/inc/playlist_"|add:type|add:"_card.html" as template %} + {% include template %} + {% endwith %} + {% endwith %} + {% endfor %} + {% for playlist in playlists %} + {% with playlist.type as type %} + {% with "media/inc/playlist_"|add:type|add:"_card.html" as template %} + {% include template %} + {% endwith %} {% endwith %} - {% endwith %} -
- {% endfor %} + {% endfor %} +
+ {% endblock %} diff --git a/app/templates/pages/page.html b/app/templates/pages/page.html index 6ce548b4..b5b04dee 100644 --- a/app/templates/pages/page.html +++ b/app/templates/pages/page.html @@ -31,7 +31,7 @@
-
+
{% block page_title %} {{ page.title }} {% endblock %} @@ -55,7 +55,7 @@ {% endblock %}
-
+
{% block page_content %} {{ page.content }} {% endblock %} -- 2.39.5