← All changes | modules/related-posts/rtl/related-posts-rtl.css +190 -0 16.2-beta → 16.3-beta View file →

		@@ -1,0 +1,190 @@
	1	+/* This file was automatically generated on Dec 01 2014 22:02:36 */
	2	+
	3	+/**
	4	+ * Styles for Jetpack related posts
	5	+ */
	6	+
	7	+/* Container */
	8	+
	9	+div#jp-relatedposts {
	10	+ display: none;
	11	+ padding-top: 1em;
	12	+ margin: 1em 0;
	13	+ position: relative;
	14	+}
	15	+
	16	+div.jp-relatedposts:after {
	17	+ content: '';
	18	+ display: block;
	19	+ clear: both;
	20	+}
	21	+
	22	+/* Headline above related posts section, labeled "Related" */
	23	+
	24	+div#jp-relatedposts h3.jp-relatedposts-headline {
	25	+ margin: 0 0 1em 0;
	26	+ display: inline-block;
	27	+ float: right;
	28	+ font-size: 9pt;
	29	+ font-weight: bold;
	30	+ font-family: inherit;
	31	+}
	32	+
	33	+div#jp-relatedposts h3.jp-relatedposts-headline em:before {
	34	+ content: "";
	35	+ display: block;
	36	+ width: 100%;
	37	+ min-width: 30px;
	38	+ border-top: 1px solid #ddd;
	39	+ border-top: 1px solid rgba(0,0,0,.2);
	40	+ margin-bottom: 1em;
	41	+}
	42	+
	43	+div#jp-relatedposts h3.jp-relatedposts-headline em {
	44	+ font-style: normal;
	45	+ font-weight: bold;
	46	+}
	47	+
	48	+/* Related posts items (wrapping items) */
	49	+
	50	+div#jp-relatedposts div.jp-relatedposts-items {
	51	+ clear: right;
	52	+}
	53	+
	54	+div#jp-relatedposts div.jp-relatedposts-items-visual {
	55	+ margin-left: -20px;
	56	+}
	57	+
	58	+/* Related posts item */
	59	+
	60	+div#jp-relatedposts div.jp-relatedposts-items .jp-relatedposts-post {
	61	+ float: right;
	62	+ width: 33%;
	63	+ margin: 0 0 1em; /* Needs to be same as the main outer wrapper for Related Posts */
	64	+ box-sizing: border-box;
	65	+ -moz-box-sizing: border-box;
	66	+ -webkit-box-sizing: border-box;
	67	+}
	68	+
	69	+div#jp-relatedposts div.jp-relatedposts-items-visual .jp-relatedposts-post {
	70	+ padding-left: 20px;
	71	+ /*cursor: pointer;*/
	72	+ filter: alpha(opacity=80);
	73	+ -moz-opacity: .8;
	74	+ opacity: .8;
	75	+}
	76	+
	77	+div#jp-relatedposts div.jp-relatedposts-items div.jp-relatedposts-post:hover .jp-relatedposts-post-title a {
	78	+ text-decoration: underline;
	79	+}
	80	+
	81	+div#jp-relatedposts div.jp-relatedposts-items div.jp-relatedposts-post:hover {
	82	+ filter: alpha(opacity=100);
	83	+ -moz-opacity: 1;
	84	+ opacity: 1;
	85	+}
	86	+
	87	+/* Related posts item content */
	88	+
	89	+div#jp-relatedposts div.jp-relatedposts-items-visual h4.jp-relatedposts-post-title,
	90	+div#jp-relatedposts div.jp-relatedposts-items p {
	91	+ font-size: 14px;
	92	+ line-height: 20px;
	93	+ margin: 0;
	94	+}
	95	+div#jp-relatedposts div.jp-relatedposts-items-visual div.jp-relatedposts-post-nothumbs {
	96	+ position:relative;
	97	+}
	98	+div#jp-relatedposts div.jp-relatedposts-items-visual div.jp-relatedposts-post-nothumbs a.jp-relatedposts-post-aoverlay {
	99	+ position:absolute;
	100	+ top:0;
	101	+ bottom:0;
	102	+ right:0;
	103	+ left:0;
	104	+ display:block;
	105	+}
	106	+
	107	+div#jp-relatedposts div.jp-relatedposts-items p {
	108	+ margin-bottom: 0;
	109	+}
	110	+
	111	+div#jp-relatedposts div.jp-relatedposts-items-visual h4.jp-relatedposts-post-title {
	112	+ text-transform: none;
	113	+ margin: 0;
	114	+ font-family: inherit;
	115	+ display: block;
	116	+ max-width: 100%;
	117	+}
	118	+
	119	+div#jp-relatedposts div.jp-relatedposts-items .jp-relatedposts-post .jp-relatedposts-post-title a {
	120	+ font-size: inherit;
	121	+ font-weight: normal;
	122	+ text-decoration: none;
	123	+ filter: alpha(opacity=100);
	124	+ -moz-opacity: 1;
	125	+ opacity: 1;
	126	+}
	127	+
	128	+div#jp-relatedposts div.jp-relatedposts-items .jp-relatedposts-post .jp-relatedposts-post-title a:hover {
	129	+ text-decoration: underline;
	130	+}
	131	+
	132	+div#jp-relatedposts div.jp-relatedposts-items .jp-relatedposts-post img.jp-relatedposts-post-img,
	133	+div#jp-relatedposts div.jp-relatedposts-items .jp-relatedposts-post span {
	134	+ display: block;
	135	+ max-width: 90%;
	136	+ overflow: hidden;
	137	+ text-overflow: ellipsis;
	138	+}
	139	+
	140	+div#jp-relatedposts div.jp-relatedposts-items-visual .jp-relatedposts-post img.jp-relatedposts-post-img,
	141	+div#jp-relatedposts div.jp-relatedposts-items-visual .jp-relatedposts-post span {
	142	+ max-width: 100%;
	143	+}
	144	+
	145	+div#jp-relatedposts div.jp-relatedposts-items .jp-relatedposts-post .jp-relatedposts-post-context {
	146	+ opacity: .6;
	147	+}
	148	+
	149	+/* Behavior when there are thumbnails in visual mode */
	150	+div#jp-relatedposts div.jp-relatedposts-items-visual div.jp-relatedposts-post-thumbs p.jp-relatedposts-post-excerpt {
	151	+ display: none;
	152	+}
	153	+
	154	+/* Behavior when there are no thumbnails in visual mode */
	155	+div#jp-relatedposts div.jp-relatedposts-items-visual div.jp-relatedposts-post-nothumbs p.jp-relatedposts-post-excerpt {
	156	+ overflow: hidden;
	157	+}
	158	+div#jp-relatedposts div.jp-relatedposts-items-visual div.jp-relatedposts-post-nothumbs span {
	159	+ margin-bottom: 1em;
	160	+}
	161	+
	162	+/**
	163	+ * Responsive
	164	+ */
	165	+
	166	+@media only screen and (max-width: 640px) {
	167	+
	168	+ div#jp-relatedposts div.jp-relatedposts-items .jp-relatedposts-post {
	169	+ width: 50%;
	170	+ }
	171	+
	172	+ div#jp-relatedposts div.jp-relatedposts-items .jp-relatedposts-post:nth-child(3n) {
	173	+ clear: right;
	174	+ }
	175	+
	176	+ div#jp-relatedposts div.jp-relatedposts-items-visual {
	177	+ margin-left: 20px;
	178	+ }
	179	+
	180	+}
	181	+
	182	+@media only screen and (max-width: 320px) {
	183	+
	184	+ div#jp-relatedposts div.jp-relatedposts-items .jp-relatedposts-post {
	185	+ width: 100%;
	186	+ clear: both;
	187	+ margin: 0 0 1em;
	188	+ }
	189	+
	190	+}