mirror/webslides
1
0
Fork 0
mirror of https://github.com/webslides/WebSlides.git synced 2025-08-23 21:33:09 +02:00
Code Issues Releases Wiki Activity

longform elements: container, lists, alignments...

Browse Source
This commit is contained in:
José Luis Antúnez
2017-03-26 17:59:32 +02:00
committed by GitHub
parent f4d52e36e2
commit b2e6e032d4
1 changed files with 51 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

73
static/css/base.css
View File

@@ -47,8 +47,9 @@
12. Avatars 12. Avatars
13. Tables 13. Tables
14. Forms 14. Forms
15. Safari Bug (flex-wrap) 15. Longform Elements
16. Print 16. Safari Bug (flex-wrap)
17. Print
----------------------------------------------------------------------------------- */ ----------------------------------------------------------------------------------- */
@@ -420,29 +421,28 @@ nav a[rel="external"] em,
text-align: center; text-align: center;
} }
img.aligncenter { img.aligncenter,figure.aligncenter {
display: block; display: block;
} }
img.alignleft, img.alignleft,figure.alignleft,
img.alignright, img.alignright,figure.alignright,
img.aligncenter { img.aligncenter,figure.aligncenter {
margin-top: 2.4rem; margin-top: 3.2rem;
margin-bottom: 2.4rem; margin-bottom: 3.2rem;
} }
@media (min-width: 768px) { img.aligncenter,figure.aligncenter {
img.aligncenter { margin-top: .8rem;
margin-top: .8rem; margin-bottom: .8rem;
margin-bottom: .8rem;
}
img.alignright,svg.alignright {
margin: .8rem 0 .8rem 4.8rem
}
img.alignleft,svg.alignright {
margin: .8rem 4.8rem .8rem 0;
}
} }
img.alignright,svg.alignright,figure.alignright {
margin: .8rem 0 .8rem 2.4rem
}
img.alignleft,svg.alignleft,figure.alignleft {
margin: .8rem 2.4rem .8rem 0;
}
@media (min-width: 1024px) { @media (min-width: 1024px) {
/*=== div.size-60, img.size-50, h1.size-40, p.size-30... === */ /*=== div.size-60, img.size-50, h1.size-40, p.size-30... === */
@@ -1158,7 +1158,7 @@ p.text-subtitle svg {vertical-align: text-top;}
} }
@media (min-width: 568px) { @media (min-width: 568px) {
[class*="text-pull-"] { [class*="text-pull-"] {
width: 32rem; max-width: 45%;
} }
.text-pull-right { .text-pull-right {
float: right; float: right;
@@ -1171,6 +1171,10 @@ p.text-subtitle svg {vertical-align: text-top;}
margin-right: 2.4rem; margin-right: 2.4rem;
} }
} }
img[class*="text-pull-"],figure[class*="text-pull-"] {
padding-top:0;
margin-top: .8rem;
}
/* -- Interviews (Questions & Answers) --- */ /* -- Interviews (Questions & Answers) --- */
/* -- <dl class="text-interview"> /* -- <dl class="text-interview">
@@ -3143,7 +3147,32 @@ button:disabled:hover {
} }
/*========================================= /*=========================================
15. SAFARI BUGS (flex-wrap) 15. Longform
=========================================== */
/* -- Posts = .wrap.longform -- */
.longform {
width: 72rem;
/* Why 72rem=720px?
90-95 characters per line = better reading speed */
}
.longform .alignleft, .longform .alignright {
max-width: 45%;
}
.longform img.aligncenter,.longform figure.aligncenter {
margin-top: 3.2rem;
margin-bottom: 3.2rem;
}
.longform ul,.longform ol {
margin-bottom: 3.2rem;
}
.longform ul ol,.longform ol ul,.longform ul ul,.longform ol ol {
margin-bottom: 0;
}
/*=========================================
16. SAFARI BUGS (flex-wrap)
Solution: stackoverflow.com/questions/34250282/flexbox-safari-bug-flex-wrap Solution: stackoverflow.com/questions/34250282/flexbox-safari-bug-flex-wrap
=========================================== */ =========================================== */
@@ -3153,7 +3182,7 @@ Solution: stackoverflow.com/questions/34250282/flexbox-safari-bug-flex-wrap
} }
/*========================================= /*=========================================
16. PRINT 17. PRINT
=========================================== */ =========================================== */
@media print { @media print {