Skip to content

Instantly share code, notes, and snippets.

@snhasani
Last active January 2, 2017 21:31
Show Gist options
  • Save snhasani/4ac8136a0cda2aaa6d0badfad40c07a8 to your computer and use it in GitHub Desktop.
Save snhasani/4ac8136a0cda2aaa6d0badfad40c07a8 to your computer and use it in GitHub Desktop.
wordpress amp plugin rtl style
@font-face {
font-family: IranSans;
font-style: normal;
font-weight: 300;
src: url('../assets/fonts/iransans/IRANSansWeb_Light.woff2') format('woff2'), /* FF39+,Chrome36+, Opera24+*/
url('../assets/fonts/iransans/IRANSansWeb_Light.woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
url('../assets/fonts/iransans/IRANSansWeb_Light.ttf') format('truetype');
}
html {
background-color: #fff;
}
body {
font-weight: 300;
color: #212121;
font-size: .875em;
line-height: 2;
}
.comments_list ul li p,
.amp-wp-title,
.comment-body,
.comment-button-wrapper a,
.related_posts ol,
.amp-wp-meta,
.amp-wp-header div,
.wp-caption-text,
.amp-wp-tax-category,
.amp-wp-tax-tag,
.amp-wp-comments-link,
.amp-wp-footer p,
.back-to-top,
body {
font-family: IranSans, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen-Sans", "Ubuntu", "Cantarell", "Helvetica Neue",sans-serif;
}
.amp-wp-header {
margin-bottom: 1.5em;
}
.amp-wp-header div {
max-width: 768px;
padding: .7em 1em 0;
}
.ampforwp-logo-area a {
font-size: 0;
}
.amp-wp-article {
font-weight: 300;
margin-top: 0;
max-width: 768px;
}
.amp-wp-article-featured-image {
margin: 0 0 1em;
}
.amp-wp-article-header {
display: block;
margin: 0 1em 1em;
}
.amp-wp-meta {
display: inline-block;
margin-left: 2em;
}
/* menu */
.amp-wp-header .nav_container {
top: 0;
left: 0;
right: auto;
float: left;
line-height: 1;
}
.toggle-text span:nth-child(2) {
top: 7px;
}
.toggle-text span:nth-child(3) {
top: 14px;
}
.toggle-navigationv2 ul ul li a {
background: #efefef;
border-bottom-color: #e0dede;
}
.toggle-navigationv2 ul li a {
background: #ffffff;
}
.amp-wp-tax-category span {
display: inline-block;
margin-right: 0;
margin-left: .5em;
}
.related_posts h3, .comments_list h3 {
margin: 0 0 1em;
font-size: 1.3em;
}
.comments_list ul li .comment-body {
padding: 1.5em;
}
.comments_list ul li {
margin-bottom: 1.5em;
background: #fff;
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.22);
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.22);
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.22);
}
.comments_list ul li:last-child {
margin-bottom: 0;
}
.comment-author {
float: right;
margin-left: 1em;
}
.comment-metadata {
float: left;
}
.comment-meta:after {
content: "" !important;
display: block !important;
clear: both !important;
}
.comment-metadata a {
color: #b1b1b1;
}
.comment-edit-link.comment-edit-link {
color: initial;
}
.related_posts ol li {
margin-bottom: 1.5em;
}
.related_posts ol li:last-child {
margin-bottom: 0;
}
.related_posts ol li amp-img {
float: right;
margin-left: 15px;
margin-right: 0;
width: 75px;
}
.related_posts .related_link a {
display: block;
margin-bottom: 1em;
font-size: 1em;
color: #212121;
line-height: 1.5;
}
.related_posts ol li p {
font-size: 12px;
color: #999;
line-height: 1.5;
margin: 0;
}
.amp-wp-footer {
text-align: center;
}
.amp-wp-footer h2 {
margin-bottom: 1em;
}
.copyright_txt.copyright_txt {
margin-bottom: 1.5em;
}
.amp-wp-footer p {
margin-right: 0;
}
.copyright_txt.copyright_txt {
float: none;
}
.back-to-top {
float: none;
}
@media (min-width: 480px) {
.amp-wp-unknown-size img {
object-fit: cover;
}
}
@media (min-width: 480px) and (max-width: 768px) {
.amp-wp-header {
margin-bottom: 0;
}
}
@media (min-width: 768px) {
.amp-wp-footer {
text-align: inherit;
}
.copyright_txt.copyright_txt {
margin-bottom: 0;
float: left;
}
.back-to-top {
float: right;
}
}
@navidkashani
Copy link

فونت ها ایراد داره... اکثر کاربرا روی موبایل هستن و خب بهتره به جای Arial از فونت سیستمیشون یعنی HelveticaNeue و روبوتو استفاده کرد

@navidkashani
Copy link

Since the Ice Cream Sandwich release, Roboto has been the standard typeface on Android.

Since Froyo, Noto has been the standard typeface on Android for all languages not covered by Roboto. Noto is also the standard typeface for all languages on Chrome OS.

http://stackoverflow.com/questions/29384114/what-fonts-are-installed-by-default-on-android/29384237#29384237

@snhasani
Copy link
Author

@navidkasani yeah, this is correct. I added system fonts.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment