From c647bdf5eea6ce173d4871ea45361f6d07d68379 Mon Sep 17 00:00:00 2001 From: Scott Tolksdorf Date: Sun, 19 Mar 2017 15:07:00 -0400 Subject: [PATCH] Added in stlying for blockquotes and clean up logic in footer --- .../homebrewery/phb_style/img/footer_flip.png | Bin 0 -> 12853 bytes shared/homebrewery/phb_style/phb.blocks.less | 58 +++- .../homebrewery/phb_style/phb.elements.less | 172 ++++++++++ shared/homebrewery/phb_style/phb.fonts.less | 15 - shared/homebrewery/phb_style/phb.img.less | 1 + shared/homebrewery/phb_style/phb.less | 317 ++++-------------- shared/homebrewery/phb_style/phb.mixins.less | 29 ++ statics/faq.md | 6 +- 8 files changed, 305 insertions(+), 293 deletions(-) create mode 100644 shared/homebrewery/phb_style/img/footer_flip.png create mode 100644 shared/homebrewery/phb_style/phb.elements.less create mode 100644 shared/homebrewery/phb_style/phb.mixins.less diff --git a/shared/homebrewery/phb_style/img/footer_flip.png b/shared/homebrewery/phb_style/img/footer_flip.png new file mode 100644 index 0000000000000000000000000000000000000000..6e512afb9aceefda355cfab32a1bdd706e3f9714 GIT binary patch literal 12853 zcmch8cUV*B{&=vZDyV=EnE|yGEg(Y-d#Gj9D$vLf!`{e_$Ph?CEy_%K>qZ4hDnu|0 zWsd{|k}86xOd${|dQ7_sXcrfIy(V zXMeW400PN20Dn*H`VRQ*d57Bqd`QJ#a6AL5=+&47ZoUmW?Q|Lhs>aA}21o<)85{qQv5ZfrqMB?LDu$#)e)^3b+yiiVL_Lb5%bk+}p zZt5+{A=!$2#5fpEG4U3qNF|9qsw){|+#tm^2w{?s?+D;FL_?= zlV-Ar5pC?0fCzERDovBx#`G`%THRWg+EveZ-oAcF z5@h&MwZ+K)^YkwiB0374h;KdD2HD1wak);i#z1^K=iKyEYNUkh=c(JfIQA>gZjcg!aNEP5*W%bG`DBjL4~V?K7pHydgEJ!VWlk-1?{k-b zO3Y3)3D(hcyQDF4a(YXZvxH8rLnddqm#%iqD1O>6*ELIBYK*5T2nt*%xkEAy-)xJc z2R~<1vq&32?D(<(W2K+>8j3v$Kt}$+2Y6hKb9MjClbfKstA3XPApwtET2_6zhT5oGO zRG7Oc5#brvUfx*XcV<`Xm~`g;#86DNDaxIrHIOg6 zh?W%*CwNaKLSpLn)5(7P*_p>U@PVSgN*c_abLTF(embRP z5BedZvOpj>Jg((sQJG+^Y)VGKCIl!^`hIa&9xl^aZarb6!LidlXj4WaLs;#AE_HNh zzET@kF4e4C-tS@Y%}n5}e&;2GFCW(J&5aEDsbnrBfuUp?Qom^9K zPA_^WA#9$y^J%(~jiN1jfGTs#g-k$%zRVg#m3F7wMT&wN4evXa4-HG0DfGPbNK!ry z`(`FRzlSQ5i3#-Nk0l4qD-Z8u0a!+?cAvI z^pn>lAa)__j~Uct3wZI;+hGmnWHI+w4W(v#rdeoTYM^Tky76Uxd=MslfMg{BYj7p5Zx@JqOHHFG6J;?7Z(aXdey+NXbQZHfF85t|2|Lz%~9yH5I4r`Dh^>zhN# z1vKBvpsSMdW{TiG3y0otd`)0K$CkU6|y-LllHis`Yjz^Y<{trysKG^B?E5T{z zi>k>#nAq#ywT77NtFy%@PI5gp35+KnoO7z*EKEC;hbHb8FKe%(F1P5Tb2=FP4Mz&| z!vc{tXNLQ}#IpQfq6^@t&!;k(UX*6}CkpYFG+zl5s;=KMJ8q+*mCp=xs(CYLT)bnI zl246!}@Sa%g2FKEx-*(jsT#9JxctilT*`dP#REG0UCdKmSD&}pK77=t7yW^cpqjE zVW2(j!1TViigSORAR(o-WoKkyQF21dAsa<-Ajv?eB-eE-JhL?H?|9fD9*Jy^xT>LW zyYr9m)}pSN`S7QtmD-1or+*PQ=mA0qBDm!UI!AHxWrOyhgYqU;z6tC;k1j3tn zzbsK+?qpVYtE0o}RI)a2dgBEULlIL4#52o7*N918B7{A%VrJ8u&15`)wX+M_d~GYy zr8upq!gE4-aH#DO=lrBDXKK3Wd=E3oY3)O5tB32D7c^d?C4HZ>z!-o9uqy;XA!&yC z7_UiU@<~nfPR3hLWiPCjf1#|2gVVlB#>;0&2qz48X5+S_(}7CPh=oB*TEbp|Ij`s( zQgbQKqlfl`cpv1t{?5#7T>fZhHh_D@0C8c{%UdbQF7tO?yzc~~2O{ua@%B(`k5uEA zwXgRkr)$WkcKY6ocEZL!H7*&7#M#^wPS@Bt=K^?-h~Wj2)IysH!mdSE=ZUZ4fGs2} z=?OG>;W4alP-JOh=VU-v68z3eTld`5smLy8kS2{`cZQj1wY^7Pmunv8o~^MV0Ul*s zzq_FW>*^PKB}!wvg_P~2vZlB{r~TNQUr>Mw@CJiF#%ut=3!W5qwe?YDWDSDTbC`@9 zc=>c`oCvxvX90W9F*v5-2YAtJeIUyDqjKEsYvnN(&E&7osR;x%MKO z&Y`JCeqDa}OO5O&R4oP8UVDZ@9Yd)=uM3cfv=(dUydekO^1o;va);JzS1*|V{qBBU z#FULx(nHg^NSC>@crYToU-3dYmiTwD)8=s#2d2aJ@=#9$46i&Ty2JX}O3kHn4j;El zVKkT>^i|$Twh2(~FI8&(Os z3uUVOG#tq*!-wwgomV=CyLUEtLPeM6D`%~tPAJ#_+ngji-6z!d>i|QnQEsS`PZbooJmxkknMi0?_Cifo-!bw@p@i2 z<08!E<65lM*OtDGcHuhvc90WI;Q@JQa-JLh#Ax}g85EuU&6~RkCD@WRkqK{Tq6yC| zcQ+R8YUuEA6`2p@Pc?Xg*>)ZR$05?zy8l0y>+9#Z6Ddr_MtdT6b(u3#ftHaM*$^RN zWOLSavy^9N=DrNKFM&PNqusQt?kWE^dj+{x$qK`1mV^_EioT@e!!0UXm>;4fN50LdGCK(8e|;b1AJBAyxAAumBBEx{V9$<4!|%tHNEo40 z$YD&^UPSo3!l*;Jm;|yzESC4$>k_}*L0%@{OeF(}tZGknf%-d7lg_7zv-27R;x=-< zeU{|1nK0+d9N=yHHi(e)G_XFI{cXf6ULk8_IH`&-gwFTE5qZVwKdE*%ah)}k2tnH( z>5tg(UNbHwp}UNJz63x|Fj$^6TkOus2{f;Dj&FJ=yZ=v4Goylg*6kE=sg4}EO*yFX zh(4x!@~+v5bqoai-Hrz#)jz-+f2k`}40OG^T9Tgq4Yn3Fp%8aFof~>J_S)cO zdP{n~R%iS^Yz)74E_865mAq!#;bIplcmt$O(empV`krmz12{|E znSrG|#hs%_+`aZ-p0|?V!z4MJ;M4Fe?NaCceRW#d!XE#os4OVV#l~8TxeZ!^f0cFb zY?=wYvFp)VDL3$m?ehAt32){a$o`AbS7X0R=&L;H zKSxfz(9+ECfmIIWH+mW0=kd@S$~!YX^tMzFv0#MT6GeJXWsmaY8dLO={P6cCF|w0YHBYEU49)-&`JrR zX$qQ%GQCCesSf3GUnOWef6ZM(BQ{$Rr~R9jRw?D;CF?Id;O}ZcYowLv+;#8dU zI439Mn{&8?C!6snP$F+%bwaHy{orTcfU&23D~_JSHU|Wc+Xbv9fDSKWjmew4{3jAS z*nDU^*~j;cvu@$#H&>G5pQw|vWy)-oF!oN@V?&M{y->VSik(}^b;X`2*y-S;7YpeN zd=*@UM83=xHdAJ0UMV94cDI)15#^cr%C3pUY*^d#gHUoRT7gbE{L>dD(zay}> z2>7;-H+iBpHc$WcG;?u?N>WX;opYeV{XFcf&-Pa`d9a#@?GQh3BZRfcO-VZfWcao5 zckbxPvW6eV)d_;*!CLvk4gAjC@JMCM={CWm%?n5WB#&Oqs&7>}aLdJ!8CvC9Gx%VP zQ86==ATUqN_ptuTblVv=8DF)oia=PY5MF*sj@ZTO`6i5#SnZ_O-#)gp6Gye)39V|; z)C?#1S*1vEF1VcT@A{~pv9ZuUGrsGWu{~%YT#IFKenadbGd+0iSHz&)x4u9LH`mV( z!>trN#@*|fA5{Vih0#xx_!J^_WGIb2Fhg4E#?>YwE`LkwrifUSX;O1=Rc7Y1GxKB2 zG(2$-2)h{wwM@P2@xr_Cf$dn=3mqkER;Tvg<)kuPSXXPVJVL7PjKOfoM%75Sr45TQ zr2X3JsEeIbLM*}0o4l*xqCe*ws{W0Q>3fLCtCg!O3wRQSZAj@gq7DUnD-qz^T#t+^ zU8F>_l50*B9GB|~W2_Ayhqq3b1so)e$BU4ywmhbC>FKuCGep6i8WVJW;-U9)9qR2v zxb%EFq#Fy4p@&upepzESp}@dMNb@V+45|hM8pq8^wt+wDAvz&~ybtVjV5>%cW_e#| z-?Ug?Ox;MBR|TBn1K<=vJmxoxh4@z%>zG8N_i{xTVXY4u$f3ouSa;Jk&-bP3hrc3j z^Y*y*zTUyfnDirjqvw9X94hjO%DsgryklmiY4z$+wu%BpPaAc1(xIfOS4do8@2npwiSjCZV9!$pAWJp1i$~kTOQQ~% z{kk90Leq?e`w8#2SdHAVsg4~;(r(p{z@~AM3(*C?(BY&8sCI)K654bW5w3FOb|e1H z0x3tB&}^dJw7b8b6NdF0Wq%R(UPFFj);-uy=%PFi;p_4ni?ww(RtTs*0(z;BYKtz= zA)SOnb4SgjI4NZl>QviD&$V0XBm5&rEKv{vGr?!`TusC+KjUf_poPF~EOF^iZM2rM zJbIQ##*94dNp+D<8v6y?ZVP&E9h*NI6kqeI_@@V5*Nt2s&E#T9A1ZInE(EC_`i%OO z1{NrKMR=nKpJJ*q3B`p`8`st)b_Ctd0%eRqcG&1kvvlp4z zdkV*a`ON&V4cxjU0y8sRW!goh!d+CqrPcQsFpvkqS7Mzg`qK`CPoY(rpVmggGe?=) zC->B2IKOq*18Plj?uQSVef5F1O;_{TzQBZxg7CBvSsdGkP=!;fTQGp5_-u)5C z=N+4`rq2nvfzT9Eq3=x5KNoPTUQok3a|O{pcfc{C2Y4tWbJP|r7$JUeEI;rSbH>J( zd<4o$gFp+vW+Ie#?D`{|t=bhiSu(TktJRUG8w9Y-{B7X3b;!hgwb|4EJqrds1byGWA;OW3|V@@bnWrwhuT)>$&n*^?+9W zr2i%<6TB~9JFJfhp_VPBMy{pOAcWdAD1etd{3BVGw;}?XpRYv41E`4P< zqwDzzd`J6Vm1uYByMp^NZKUHo>st}wtGt;(w_6EA;e^uICqQPq6s1_3+_Jo!Ni8$b z%8tgl?^L`N)ZeF1h-9)uG`=MD^Urnk%KxSNa4^NXE)c zrL`?DQnmYADb5OGSbt=%?=E7IGJ$uTHD>lh#MtuecMt!XWkuCgl$QtHJ$h+hZuXmn zFN)N%?ad~CgvANXe2?{-G@B-7B#-ZhB`prmR0LUl4;0UIinGz65@+JK^@5Bs-mmXm zVOm#62jIQgg9&bO=hJlHP~=h;1v^m6l$FFeYORm1zGX6G$dajAk`L>enh^@#se}?# zyRxJ>SI*7vUvMxmGmFXdz^L`5J49(|H}+jn97+<|gio*-(|DC@SRFr)A^#h*wnk~Ng_9SxRC&se|J#v$fsL1d++VOiDvbG}@ zH-KBpJw)5yENcs%*LdKlTQqX<+JJ`~*?3oj+)ZK_<=CCdB{U8fQ3r{lygD4Ql3MQ4 zXq1@iaa^{~@OR&#v3JR4@F9m6w}0TVk3$;;z2WScGG?>pRJd4m%76h~#>=^n@rW}u z5vnd>H~1zum4Rrsfgf#RKH~o3)?;^w17W06=UjCRMYH(Yj%8!n(G@Nt4>}<_%38yw4IIe-L~o8qXsw%boqLC!g%sz+p2i||FKogqenl2*$6`lY zN+wOW%4)o3adh&p8IFGd{#lBTu3x?*E@AIoExU3eu)a^P;a!cEnMnK^A)t~zRqDG6 zlnI>q=x2k^z@aF^TMdsX)D)=sA4=2 zue6=zv=%oxCEU;&o9Pv|&6DeB4q(DhrF2%jyn_u1UG)N9G5P&Ts-^fa$&(!-?q!fqrTol&j3W zKS3W?WH?=4Dtml0PHYp``0`tSua4HCu8^DbM>z^R7Jp(meO_!nzAwK_-Jr(Gt@w+U zefh-~a=i8AbNxJ6$}9G~lCr(iL@cuK%Of*`^;{3keFMAli``3sMd9r2be}Qn*3qKN z*c=&-Sypp3$_BEGcb;i)_69n1Y*Acxi#aeGk`Guk{b7nsRzSShB|3ra+3c3WY*uCuw z4>2Wxa+}E*9M~}Cl42}oqCvpYu8dWL_8>_OMrCya@p$c~i@SILPn7rOHu`8*$>IZB zJL%6}*5oTuX$Eis`AX8fCIPjLv(4MID}(E(W+}@5! zzJrsSANVmYVez(RwoLnymH@>tw_423wqX#9D8AG=F^#-e?gKP3N_k3^(ZW0*)KYXG zo%^)%&Qk$uPE5&DuJP51#13j|q&j5Ic_FX8DEO0@+J94;geG+*x35~zp;W=0YQLHk z^mFaXAvTqc?N9v=pasyA?A?fD%jLJ0o?YGS>#SM^_ zOELcAMiu>!-VZo4C{YzkXdNJZNn)`ZtUT<>m(HxdGc&Hp)9S>#E_XX20?tnb{8o_y znshXx26I_7wPt(v<9X=z3J~<(-Po|bwY=o2$gs{%7f*X-vWS)=uN&>@aUnmR^kMad zF9hjifaO_I=wyQ)cUK3?(*-!+E?ggt)QTq-qYP3tQUCA4*!i{ z$bMTi>}V(E%hWKmtW-Q9=>1@<61VhSpFtJ{*qJ-ieY|#k9RG~BNL{clYh_e%&s!)DM;RTYdE@*B*_W&G}iq)rBmLb8D`y$r;8V!qAA~bq~{kQsG6!oTzjGh{nXO({rLW!j!s3fknUjjs+Kpj(Jpn|I;>b^ zp(Wa1+Vz}OI-@zgJPmW_iVE@a8!*^(BqbcuXE*n{Vl^(LW*rKy?{dRzw;!N~a-l|_ zi5>o46Z0~<^=IBIZUlL2Q0&-hw@A%=RTqMm^Wn;>wGEi-yV$$}`1r_l@W7vI1s*71 zK1|P9opfc*-mX5DV2bk}@{Jh- zR10O?NNCjE>88DgDb;=_r-gp_zC&#G)|U4A9+1*?C+Q3Ws*I@%Flg8B%?hb@ ztywp|1Rkzf-h5{U%mhoZ>*ixpi?ek{Zc(_SW=GMOByu}7g>=W=b=gnVvD09(ct(qI zm5Wh9mAnxP-l~t$Uo!X~)p0i#!Jc$^Le*-riGy@A2~r7c1lJb57|~zP{qoIGvNR&r zN)x<{G7}z%3<9=$<1Jod!X~MBi^OKK4m{?$TlSTXhQF`fHMm7itL=evHcOwFJ5@qa7@RIqz|7?bYq(fpK(S!e;eH{ zd;Zl0I4REatu2!?gZ1{hd#r&LQoES01`R+qU?vi)=ZGTQ5CMS{nOjF6j!Q+-yJr^Q?)Y3qLP$9*i^yOfK#^46#nPZJFxo0XPcUH8uAyr?o^w= z17_b2@Bgs(We%qE@#GBNU+_mbq&w|GyP%*KW!GXH@e7}fU*%lUI&h5rv7Ld4Z?T+f z89>S9rTqTPz0cj1$ES!nnx4t3-e=$Y`}#kGks(IEWToh6<{6M*z}h(+atzhBr18%; z^IBOho8>?E_i0dzd+S8Gd+I^PQ+Hf4$EdJTrN9UtJz`c?N z)z5dKcm-8@9v}og(FaBr^KzJ6#w&af7w)YJ%_Jt!`kwd3J_U}WXd0?$UNrse>pH0g zbW}rOfu7qb2BeoL3n*c&z|0_Gj<tkL6hZLTQuKbdBqS2=T@?Xt@K*`n82jZ42PUu7-Q8X>^ zDFZ?k)S&LroVVbJPF#ARh5})g#wI5J0Jm=L6`x9isvaKy3`Ed6!hc>ltjh;>XAqc{ za8s(wvX?myPJX155o$srY`QYRm+wJlQ0K-%u81{nAM1AQSPU}%5v5e$Wq{o=PB^uG zruIjjdA}vmpqcfp>CnepRY*q@J&0|f1!t%QJY7|XHnQ{#Q zOFLZh{l{_l=}_!Wsk+V=;%hKa^7RbjN;V>GGqS&vL+=z+YZs~{r!DhGl5Ga} zM&)?Or{Q-@jIr7A>}z^uVK0R2kugMw8;GR+k!0+w8I=U=LqF6n%1?43H6-Y-C%rHnF8#^k2H@f6M(a_|GhFyq>{8J{s7L9oZ^2hF*_om zo*>1zFgw32n0CFaSY-pbe*d|5mp(e5DpMmj5X?z(6dMzP{DDJs=Rg0U5^{zARzhPc z`5BfB?k|8|o+0rikg14)|0FFB!Lst>+3qZgD z79_061h7*@0^&?R@5s&L|1|~(^lw5}E6^U#fZDl0k<@G`fKUhb+h|b^1M4ofLNkp2 zmZqFvjs=G=jc7>F^17YD$HqC;0Gf+r3`>am-b#ui9eelf0&|i8V?NkZx6K6T^|?0W zX<#)7un1+{mju%Uz(OuhPwQ@xgKJS7>c!fPw!uT6i3feagj1<#a-lZlhCS<>!?59)w-r0b0< zNd#o0QybEED}3h6PDTj+Xx|=ag8YT@aYd`d16%H{m2zw!T0$9{2S3}C`W)C&h5*FNXfY@whP5~RCVv`EclokN| z<@bi8TmInn<{zFrp29diw+cY+ebMzMKsp&_X6&Bg^$3~xeLs3j{iZLaFw_jb!LXYHNs JD$e-d_&>l4@qhpT literal 0 HcmV?d00001 diff --git a/shared/homebrewery/phb_style/phb.blocks.less b/shared/homebrewery/phb_style/phb.blocks.less index 82f7877da..2e3c7775b 100644 --- a/shared/homebrewery/phb_style/phb.blocks.less +++ b/shared/homebrewery/phb_style/phb.blocks.less @@ -1,19 +1,5 @@ -.breakAvoid(){ - column-break-inside : avoid; - -webkit-column-break-inside : avoid; -} -.pseudoBorder(){ - position : relative; - &:before{ - content : ''; - position : absolute; - z-index : -1; - box-sizing : border-box; - border-style : solid; - border-image-repeat : round; - } -} + /////////////////// .spell{ ul:first-of-type{ @@ -54,7 +40,7 @@ .breakAvoid(); .pseudoBorder(); margin : 9px 0px; - padding : 12px 5px; + padding : 17px 5px; &:before{ top : 9px; right : 0px; @@ -100,6 +86,46 @@ border-image-width : 47px; } } + +.footnote{ + position : absolute; + right : 80px; + bottom : 28px; + z-index : 150; + width : 200px; + font-size : 0.9em; + color : @gold; + text-align : right; +} + + +//***************************** +// * TABLE OF CONTENTS +// *****************************/ +.toc{ + .breakAvoid(); + a{ + color : black; + text-decoration : none; + &:hover{ + text-decoration : underline; + } + } + ul{ + padding-left : 0; + list-style-type : none; + } + &>ul>li{ + margin-bottom : 10px; + } +} + + + + + + + .wide{ column-span : all; -webkit-column-span : all; diff --git a/shared/homebrewery/phb_style/phb.elements.less b/shared/homebrewery/phb_style/phb.elements.less new file mode 100644 index 000000000..bebe734d2 --- /dev/null +++ b/shared/homebrewery/phb_style/phb.elements.less @@ -0,0 +1,172 @@ +pre{ + font-family : monospace; + background-color : @yellow; + padding : 12px; + border: 1px solid #bfbfbf; + white-space: pre-wrap; + color : #333; + -webkit-column-break-inside : avoid; + column-break-inside : avoid; +} + + +hr{ + visibility : visible; + height : 6px; + margin : 4px 0px; + background-image : @dividerImg; + background-size : 100% 100%; + border : none; +} + + +p{ + padding-bottom : 0.8em; + line-height : 1.3em; + &+p{ + margin-top : -0.8em; + } +} + +blockquote{ + font-style : italic; + &>p{ + line-height: 1.8em; + &:first-child::first-line{ + + //TODO: Find the right font for block quotes + font-style: normal; + font-family: ScalySansSmallCaps; + + + } + } + .cite{ + font-style: normal; + text-align: right; + } + + +} + +//Indents after p or lists +p+p, ul+p, ol+p{ + text-indent : 1em; +} +img{ + z-index : -1; +} +strong{ + font-weight : bold; + letter-spacing : 0.03em; +} +em{ + font-style : italic; +} +sup{ + vertical-align : super; + font-size : smaller; + line-height : 0; +} +sub{ + vertical-align : sub; + font-size : smaller; + line-height : 0; +} +//***************************** +// * HEADERS +// *****************************/ +h1,h2,h3,h4{ + margin-top : 0.2em; + margin-bottom : 0.2em; + font-family : MrEaves; + font-weight : 800; + color : @headerText; +} +h1{ + column-span : all; + font-size : 0.987cm; + -webkit-column-span : all; + -moz-column-span : all; + &+p::first-letter{ + float : left; + font-family : Solbera; + font-size : 10em; + color : #222; + line-height : 0.8em; + } +} +h2{ + font-size : 0.705cm; +} +h3{ + font-size : 0.529cm; + border-bottom : 2px solid @headerUnderline; +} +h4{ + margin-bottom : 0.00em; + font-size : 0.458cm; +} +h5{ + margin-bottom : 0.2em; + font-family : ScalySansSmallCaps; + font-size : 0.423cm; + font-weight : 900; +} + + +//****************************** +// LISTS +//****************************** +ul ul,ol ol,ul ol,ol ul{ + margin-bottom : 0px; + margin-left : 1.5em; +} +li{ + -webkit-column-break-inside : avoid; + column-break-inside : avoid; +} +ul{ + margin-bottom : 0.8em; + padding-left : 1.4em; + line-height : 1.3em; + list-style-position : outside; + list-style-type : disc; +} +ol{ + margin-bottom : 0.8em; + padding-left : 1.4em; + line-height : 1.3em; + list-style-position : outside; + list-style-type : decimal; +} + + +//***************************** +// * TABLE +// *****************************/ +table{ + .useSansSerif(); + width : 100%; + margin-bottom : 1em; + font-size : 10pt; + thead{ + font-weight : 800; + th{ + vertical-align : bottom; + padding-bottom : 0.3em; + padding-right : 0.1em; + padding-left : 0.1em; + } + } + tbody{ + tr{ + td{ + padding : 0.3em 0.1em; + } + &:nth-child(odd){ + background-color : @green; + } + } + } +} \ No newline at end of file diff --git a/shared/homebrewery/phb_style/phb.fonts.less b/shared/homebrewery/phb_style/phb.fonts.less index 976972ff3..e6ec1a847 100644 --- a/shared/homebrewery/phb_style/phb.fonts.less +++ b/shared/homebrewery/phb_style/phb.fonts.less @@ -53,18 +53,3 @@ font-weight: normal; font-style: normal; } - -//TODO: move the useSansSerif into here - -.useSansSerif(){ - font-family : ScalySans; - em{ - font-family : ScalySans; - font-style : italic; - } - strong{ - font-family : ScalySans; - font-weight : 800; - letter-spacing : -0.02em; - } -} \ No newline at end of file diff --git a/shared/homebrewery/phb_style/phb.img.less b/shared/homebrewery/phb_style/phb.img.less index 00f1bf012..5328fa27d 100644 --- a/shared/homebrewery/phb_style/phb.img.less +++ b/shared/homebrewery/phb_style/phb.img.less @@ -1,4 +1,5 @@ @footerImg : url('/assets/homebrewery/phb_style/img/footer.png'); +@footerFlipImg : url('/assets/homebrewery/phb_style/img/footer_flip.png'); @dividerImg : url('/assets/homebrewery/phb_style/img/divider.png'); @frameBorder : url('/assets/homebrewery/phb_style/img/frame_border.png'); diff --git a/shared/homebrewery/phb_style/phb.less b/shared/homebrewery/phb_style/phb.less index 35c4e8ba1..e9adf63c6 100644 --- a/shared/homebrewery/phb_style/phb.less +++ b/shared/homebrewery/phb_style/phb.less @@ -1,3 +1,6 @@ + +//TODO: Remove this +/* @media print { .phb.v2{ .descriptive, blockquote{ @@ -5,29 +8,16 @@ } } } - +*/ .phb.v2{ + @import './phb.mixins.less'; @import './phb.fonts.less'; @import './phb.colors.less'; @import './phb.img.less'; @import './phb.blocks.less'; - - - @page { margin: 0; } //TODO: ???? - - - .useColumns(){ - column-count : 2; - column-fill : auto; - column-gap : 1cm; - column-width : 8cm; - } - & *{ - -webkit-print-color-adjust : exact; - } - .useColumns(); + @import './phb.elements.less'; counter-increment : phb-page-numbers; position : relative; z-index : 15; @@ -37,6 +27,10 @@ width : 215.9mm; padding : 1.0cm 1.7cm; padding-bottom : 1.5cm; + column-count : 2; + column-fill : auto; + column-gap : 1cm; + column-width : 8cm; background-color : @background; background-image : @phbBG; font-family : BookInsanity; @@ -44,167 +38,56 @@ text-rendering : optimizeLegibility; page-break-before : always; page-break-after : always; - - - /* CODE */ - pre{ - font-family : monospace; - background-color : @yellow; - padding : 12px; - border: 1px solid #bfbfbf; - white-space: pre-wrap; - color : #333; - -webkit-column-break-inside : avoid; - column-break-inside : avoid; + @page { margin: 0; } //TODO: ???? + & *{ + -webkit-print-color-adjust : exact; + } + //***************************** + // * FOOTER + // *****************************/ + &:after{ + content : "Made with The Homebrewery"; + position : absolute; + bottom : 0px; + left : 0px; + z-index : 100; + height : 50px; + width : 100%; + background-image : @footerImg; + background-size : cover; + padding: 28px 63px; + box-sizing: border-box; + color : lighten(@gold, 0%); + font-size: 0.7em; + } + &:nth-child(even){ + &:after{ + background-image: @footerFlipImg; + text-align: right; + } + &:before{ + left : 2px; + } + .footnote{ + left : 80px; + text-align : left; + } } + &:before{ + content : counter(phb-page-numbers); + position : absolute; + right : 2px; + bottom : 22px; + width : 50px; + font-size : 0.9em; + color : @gold; + text-align : center; + } //***************************** // * BASE // *****************************/ - p{ - padding-bottom : 0.8em; - line-height : 1.3em; - &+p{ - margin-top : -0.8em; - } - } - ul{ - margin-bottom : 0.8em; - padding-left : 1.4em; - line-height : 1.3em; - list-style-position : outside; - list-style-type : disc; - } - ol{ - margin-bottom : 0.8em; - padding-left : 1.4em; - line-height : 1.3em; - list-style-position : outside; - list-style-type : decimal; - } - //Indents after p or lists - p+p, ul+p, ol+p{ - text-indent : 1em; - } - img{ - z-index : -1; - } - strong{ - font-weight : bold; - letter-spacing : 0.03em; - } - em{ - font-style : italic; - } - sup{ - vertical-align : super; - font-size : smaller; - line-height : 0; - } - sub{ - vertical-align : sub; - font-size : smaller; - line-height : 0; - } - //***************************** - // * HEADERS - // *****************************/ - h1,h2,h3,h4{ - margin-top : 0.2em; - margin-bottom : 0.2em; - font-family : MrEaves; - font-weight : 800; - color : @headerText; - } - h1{ - column-span : all; - font-size : 0.987cm; - -webkit-column-span : all; - -moz-column-span : all; - &+p::first-letter{ - float : left; - font-family : Solbera; - font-size : 10em; - color : #222; - line-height : 0.8em; - } - } - h2{ - font-size : 0.705cm; - } - h3{ - font-size : 0.529cm; - border-bottom : 2px solid @headerUnderline; - } - h4{ - margin-bottom : 0.00em; - font-size : 0.458cm; - } - h5{ - margin-bottom : 0.2em; - font-family : ScalySansSmallCaps; - font-size : 0.423cm; - font-weight : 900; - } - - hr{ - visibility : visible; - height : 6px; - margin : 4px 0px; - background-image : @dividerImg; - background-size : 100% 100%; - border : none; - } - //***************************** - // * TABLE - // *****************************/ - table{ - .useSansSerif(); - width : 100%; - margin-bottom : 1em; - font-size : 10pt; - thead{ - font-weight : 800; - th{ - vertical-align : bottom; - padding-bottom : 0.3em; - padding-right : 0.1em; - padding-left : 0.1em; - } - } - tbody{ - tr{ - td{ - padding : 0.3em 0.1em; - } - &:nth-child(odd){ - background-color : @noteGreen; - } - } - } - } - //***************************** - // * NOTE - // *****************************/ - /* - blockquote{ - .useSansSerif(); - box-sizing : border-box; - margin-bottom : 1em; - padding : 5px 10px; - background-color : @noteGreen; - border-style : solid; - border-width : 11px; - border-image : @noteBorder 11; - border-image-outset : 9px 0px; - box-shadow : 1px 4px 14px #888; - p, ul{ - font-size : 0.352cm; - line-height : 1.1em; - } - } - */ //If a note starts a column, give it space at the top to render border //pre+blockquote, h2+blockquote, h3+blockquote, h4+blockquote, h5+blockquote { // margin-top : 13px; @@ -212,6 +95,7 @@ //***************************** // * MONSTER STAT BLOCK // *****************************/ + /* hr+blockquote{ position : relative; padding-top : 15px; @@ -271,62 +155,10 @@ border : none; } } - //Full Width - hr+hr+blockquote{ - //.useColumns(0.96); - } - //***************************** - // * FOOTER - // *****************************/ - &:after{ - content : ""; - position : absolute; - bottom : 0px; - left : 0px; - z-index : 100; - height : 50px; - width : 100%; - background-image : @footerImg; - background-size : cover; - } - &:nth-child(even){ - &:after{ - transform : scaleX(-1); - } - .pageNumber{ - left : 2px; - } - .footnote{ - left : 80px; - text-align : left; - } - } - .pageNumber{ - position : absolute; - right : 2px; - bottom : 22px; - width : 50px; - font-size : 0.9em; - color : #c9ad6a; - text-align : center; - &.auto::after { - content : counter(phb-page-numbers); - } - } - .footnote{ - position : absolute; - right : 80px; - bottom : 32px; - z-index : 150; - width : 200px; - font-size : 0.8em; - color : #c9ad6a; - text-align : right; - } + //***************************** // * EXTRAS // *****************************/ - //Modified unorder list, used in spells // hr+ul{ // margin-bottom : 0.5em; @@ -350,7 +182,6 @@ -webkit-column-break-inside : avoid; column-break-inside : avoid; overflow: hidden; /* Firefox fix */ - //Better spacing for spell blocks // h4+p+hr+ul{ // margin-top : -0.5em @@ -360,15 +191,6 @@ // text-indent : 1em; // } // Nested lists - ul ul,ol ol,ul ol,ol ul{ - margin-bottom : 0px; - margin-left : 1.5em; - } - li{ - -webkit-column-break-inside : avoid; - column-break-inside : avoid; - } - //***************************** // * SPELL LIST // *****************************/ @@ -403,7 +225,6 @@ // box-shadow : none; // } // } - //***************************** // * WIDE // *****************************/ @@ -468,41 +289,15 @@ margin-top : 8px; } */ - //***************************** - // * TABLE OF CONTENTS - // *****************************/ - .toc{ - -webkit-column-break-inside : avoid; - column-break-inside : avoid; - a{ - color : black; - text-decoration : none; - &:hover{ - text-decoration : underline; - } - } - ul{ - padding-left : 0; - list-style-type : none; - } - &>ul>li{ - margin-bottom : 10px; - } - } - - - //***************************** // * Old Stuff // *****************************/ - // //Double hr for full width elements // hr+hr+blockquote{ // column-span : all; // -webkit-column-span : all; // -moz-column-span : all; // } - //***************************** // * CLASS TABLE // *****************************/ diff --git a/shared/homebrewery/phb_style/phb.mixins.less b/shared/homebrewery/phb_style/phb.mixins.less new file mode 100644 index 000000000..9e0abaa8d --- /dev/null +++ b/shared/homebrewery/phb_style/phb.mixins.less @@ -0,0 +1,29 @@ +.breakAvoid(){ + column-break-inside : avoid; + -webkit-column-break-inside : avoid; +} +.pseudoBorder(){ + position : relative; + &:before{ + content : ''; + position : absolute; + z-index : -1; + box-sizing : border-box; + border-style : solid; + border-image-repeat : round; + } +} + + +.useSansSerif(){ + font-family : ScalySans; + em{ + font-family : ScalySans; + font-style : italic; + } + strong{ + font-family : ScalySans; + font-weight : 800; + letter-spacing : -0.02em; + } +} \ No newline at end of file diff --git a/statics/faq.md b/statics/faq.md index 9aa79d13a..ef045cf99 100644 --- a/statics/faq.md +++ b/statics/faq.md @@ -15,7 +15,11 @@ How to make spacers - +- How to skip page numbers +- How to set page number +- How to hide footers +#p1:before, #p1:after{ display:none } +#p2:before{ counter-reset: phb-page-numbers 30; } ## Changing backgrounds