From 56b9e1b68c47aef3022a95d1d4cc949cd0b6121f Mon Sep 17 00:00:00 2001 From: Federico Zivolo Date: Wed, 20 Aug 2014 14:57:38 +0200 Subject: [PATCH] Added support for Toastr. --- README.md | 9 ++++++ popups.less | 49 +++++++++++++++++++++++++++++++++ screenshots/toastr-preview.jpg | Bin 0 -> 11427 bytes 3 files changed, 58 insertions(+) create mode 100644 popups.less create mode 100644 screenshots/toastr-preview.jpg diff --git a/README.md b/README.md index bf8be498..1a3d410a 100644 --- a/README.md +++ b/README.md @@ -61,7 +61,16 @@ Remember to use the proper HTML markup to get radio and checkboxes styled correc Option one is this + +# Plugins +Material Design for Bootstrap comes with styling support for various Bootstrap plugins, at the moment only one plugin is supported but others will come: + +### Toastr + +Create snackbars and toasts with Toastr plugin, the default toast style is the squared one (snackbar style), if you like to use the rounded style (toast style) please add the `rounded` class to the `positionClass` option of Toastr. + +![toastr](screenshots/toastr-preview.jpg) # Compatibility diff --git a/popups.less b/popups.less new file mode 100644 index 00000000..943d3afe --- /dev/null +++ b/popups.less @@ -0,0 +1,49 @@ +// main: material.less + +.popover, .tooltip-inner { + background: #323232; + color: #FFF; + border-radius: 2px; + +} + +.tooltip, .tooltip.in { + opacity: 1; +} + +.popover, .tooltip { + &.left .arrow:after, &.left .tooltip-arrow { + border-left-color: #323232; + } + &.right .arrow:after, &.right .tooltip-arrow { + border-right-color: #323232; + } + &.top .arrow:after, &.top .tooltip-arrow { + border-top-color: #323232; + } + &.bottom .arrow:after, &.bottom .tooltip-arrow { + border-bottom-color: #323232; + } +} + +// Support for toastr plugin (in material they are snackbars) +// http://codeseven.github.io/toastr/ + +#toast-container > div { + background-color: #323232; + .shadow-z-1; + border-radius: 2px; + opacity: 1; + color: @darkbg-text; +} +.toast-close-button:hover, .toast-close-button:focus { + color: @darkbg-text; + opacity: 1; +} +#toast-container.toast-top-full-width > div, #toast-container.toast-bottom-full-width > div { + width: 100%; + border-radius: 0; +} +#toast-container.rounded > div { + border-radius: 200px; +} diff --git a/screenshots/toastr-preview.jpg b/screenshots/toastr-preview.jpg new file mode 100644 index 0000000000000000000000000000000000000000..366b8173f290b0d68567b52405fb9db8809cd165 GIT binary patch literal 11427 zcmeI1cT`i$x5p=h5PI>_r58aELO@VDh=7WK6_9EO0U{-ILNkgAR)ly33yKX?6u3$k z5S5OiAkup*-d%64w{9kDl704>%%1OO_Bz=s19d{ZKyaJY zRx5x&Ai#e31)x5`MN2Z#8vt8dpauZo1ndYyzy@1_@Wr-7B4CGY1Z+E}Us?GCa`3I! zBT@hj`*`7N6SxDZ5%`UB#bPxU0Tuxk0Tuxk0TzLOA^~S&1j(NyXGQQLgb?v008q)u zuN8$bTshoHX8&QAQ&Ya$NG*K;sMMeK&+39ReT5*ay7(vN5lb_R0E+;N0E+;Nz)u3& zTG;glS{n_twd7z!SITy$w4^0A0bT6li))PG*+1`t5lIAdKs%Y>e_1A z23Zh%iCdyW2)m>0_TZ!a@cLdVrY3ycMq~qWKu`c73@1kp@DB_%AR8-uo!tPoSKJr{ z6Qd9>Z-ZT%t-gE8Cn-G4SRp)|=w;xI^VaqB^3v7t#OZixV6k2}4V;$_R>Mn2 z$7_QwcB8g8)>GkocrW~q=t1Ej{$FEz;V}e%LI5E!EEJ}J#VBCDE&A_@2_yOu^xxu# zHNs;IEJ6slFv4cIo2+cJhSo+6ZLK|jZoQ_KzK#**FXN0bD=_|Lp?~kn|07x^MqYRW z{L0!%A>YF9CItWQcH5t5@|V*3n^4&Q&444o>Bq&zWrX?H;QyV*R}Y+h@b`Y?D*R2k z|AWQ~@=K6exLCM;iNG%nW@Q%(*Dn$HrNON1`hSM&XT3`Zgp1rrxSEB!fdxRLP#h?B zGzW@<6OHEN7UF?x3~mttL0%zo5lIPg5pl8AGAi<`rIn?{#1%9ZlvUTNuTz(l!{}ht zv{ls9)mA1!pgB3YxwwUSc!brY#HG}Jxj|2W5GOE2m?9AhfK3R26hc7NKo&lmM8T(- zD+ik28-fkVj^aRba&hy(0}2HJ8v==BV@IM;?C?=0A`ZR}*o9E5*{UTsBd7g+0x2-%hqkX_w03W zblT^P_ab=v_!19Kgk>bc*~r>0%Fc zR9sT}=vh^DO>JF$L*wh#H*M`5on5rP{(->{ABR2-k4(?Z&dq;bpnq9h(S-oWZ?b+U z`-?6iSQi^RJCYr}q6@(m33sFrJ4znQvC4cW8W;SVg7#rf;Y}&mA3Wt!)Y&y9;u+Gy zEvmG>PkDMp+E-=&nXvf(k+L7ce(ItDUL*qEJfsjX1&f>0c`x;Sq&M^$M!lEN{eW35 z5|Em&RX-=sX}Z(x$}2|nb7miN?^GLz^MC-)y(hABG7xCchXDPgXgj}I{hz$ks%Y`=*YS$(e2{$ISX&(VQoy9G(4A*V4+3=^$0=`%nIVo9 zJJ=mPriU?0iC-M6_AY32Frsa~=d=ioVNCbAOaJ_Ft9*+8T&L8!4!hDJ3EI8415*-< zJ}2|?nBq>|!w}#tP%79V>azJtJyRvP^aR7slpD;Bp6yzy>fi|`-l8WBEm?IrHf@b9 zWfPTfYrH1%s^fMJ`PE4y%w4*L>p7ctPcH34jrAc^`A>~8Ndg}{9ELaC?-4XI-~YMj z#D}MT8))*!?^6@rgXF;pni!aFFTv2XYr7cgnH~?%7Fx#)-osN*pRPXWTY#9Y5OyT? zdGHOt*J;k!{)f{T!_rUncN?Yqt47`?%gUv*U3~XMLZ*V)$**~Ge4^aAZ+Tms!;)QT z+y=82s(M736RqE+>q4@Wd=N*!_&fj`KVEBNAeYl_jyR`B-+0^YVofy8U#EPqRit+O ze#pU1dg)0ANCe8L+vDlZfls+Jvwdx;7ZzJbqQ_EPhziXGDNd8b?V}~&@%~x?=_sis z2Z2O}At`&9cJ=n15kA~);yu}mNk=GQr#aiHk|J<2cJx7d*ukrT6_>%RL`Bh4l= zKR^P@b@4I$EI`W~ebYlxXUa}JDSYT=Cwg)|XLpr5f8kX4a6xgpTh$Hc_dHp}o@1{c zF{&jRPtVC=8oBfX&o`27ELy@%x#*V`TvKiE`%|0vUIbs1)P5~!X4@!U1O|J3)-M(= zN1(DR=UbS!`!T9c7Zp}uY;BEsdUx02R)y~hSN?XdZ}osmKM{|+g}nL z$|z4Ep!n)eo(1J-TE1=88Izc{q?z$?k0l%1n5~Lx#}4K zD&V<|-=MYuo*t=Zj+UFAK!si9pOQJHS$wUk-_87L+^(*Pf!0(GTFZFA97i>497QiJU-#YlLcPYd=~+qG?6;-!7-`taiUib||Xc=$4rQa`Ag+p%d%^I~q# zYCnyLiOKMu6sc56qkOgNwaUp4Y>!;cz=|7}-n~T+5Z0nuYCf#n@%W8O>v+IG{@c^j zHXl-b-s|OAT)DNh!*q0UDQVToxlz-^OM02tJZPUBhjzE!Y{Na=_u=q0!NH<_VMC7H z@gY_RcR$IViIuOo*emJ3Q06}8+(=8h@Hxhu{mb3bq`7Aq7OhD{H;Q`%1lG%T3^BLQ zUQ#b?k2UTawNDt>(~{@)CXiBO(%7MG)+}PbHtF5vPQfj_tMfJvWCrhfqI%;b__Hqv zbQLpA7#7SAm9x}}k#e!m0T4J_DF}g55@Rqg`Wk0$<-lu?1%a8ognJV%dGxuo zqh3+bSbOw|_??4nrtR#e>OSY|2DX>ePu=zyJ+ddwysWS!N!&BRMcS<|6)XPKt(#M= zN=oRe$%5{a7HbzqHFaB^Ed;pI&rU1Hy6IBI#5@OSH^F~ z<8}Grl;7nH*|N`cEoCMdbjVtQ09SJ2xD40BDF}2$ET>M`WE4bQd{<%CT`Yx{4t3){ zF}>=QUB;G*Hw8$_ong`1_V<0H*i7tfafrV@f%l12Quz^AWnqfPu}XR8o{kq|xao>> z#KpZipU)bar1>^mg!|noEU&M5PO{=Q>+OwSJ)+irZ(2q`FfO;-t>sop>qjynVdG?k z?QgZ0H>}TG9YyG+R&ICXvP3%jNAqV)Yu4Ep78V_;nsw=RdRNg@SeScPDYz)e?1IP| zSCN+?#@Hmaq`T9r{GR7%f2@7tY~_6mi_O_0X1llsCrsw+TXs=hC@vJL!00Rl^ujxs>dh0ehN6jtzV1_o zm~q+S?N&ErtiMP^aA0v}?E8D?hLk>*DxRtHmGe1dM^w#1SPJj>v!hE6HdRh9^vf=2 zKp_46J!TPghB4bGz#9Fd^e>Vei-q<_gQ)?=*RziOq g-do?BQmJUtC3_{N!V+~~uW_@`QFN}FGl07O3wFgwmjD0& literal 0 HcmV?d00001