Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Minor mobile and Safari fixes #129

Open
wants to merge 7 commits into
base: source
Choose a base branch
from
Open

Minor mobile and Safari fixes #129

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
6c79737
Merge pull request #1 from kiwitcms/source
emiltoteb Aug 1, 2020
50badd9
Merge remote-tracking branch 'upstream/source' into source
emiltoteb Aug 2, 2020
15e61e0
Source update
emiltoteb Aug 2, 2020
c54352f
Combined fix
emiltoteb Aug 2, 2020
23252c7
Merge branch 'source' of https://github.com/emiltoteb/kiwitcms.github…
emiltoteb Aug 2, 2020
b5868ed
Safari transparent issue (#128)
emiltoteb Aug 19, 2020
aa4f5e7
Minor mobile order fix
emiltoteb Aug 19, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion theme/static/style/responsive-micro.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -262,7 +262,7 @@

@media screen and (max-width: 500px) {
#quick-links div {
grid-template-columns: unset;
grid-template-columns: 1fr;
grid-template-rows: max-content auto 1fr;
grid-template-areas:
"icon"
Expand Down
47 changes: 34 additions & 13 deletions theme/static/style/style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -110,11 +110,20 @@ code {
font-size: inherit;
border-radius: 2px;
border: 1px solid var(--trans-green);
overflow: scroll;
width: fit-content;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

the formatting is different on this line and the one above it. let's unify it

max-width: 86vw;
display: inline-grid;
overflow-wrap: normal!important;
}
p > code{
margin-bottom:0!important;
}

pre > code {
border: none;
padding: 0;
padding: 0;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

again. different formatting

display:inline;
}

/* pre > code > span { */
Expand Down Expand Up @@ -227,7 +236,7 @@ transform: rotate(90deg);
}

.ghost-btn {
background: transparent;
background: rgba(255, 255, 255, 0);
border: 2px solid white;
}
.ghost-btn:hover {
Expand All @@ -249,7 +258,7 @@ header {
grid-template-areas: "lead video";
align-items: center;
column-gap: var(--grid-gap);
background-image: linear-gradient(to top, var(--white) 0%, transparent 5%), url("/theme/images/header-pattern.png");
background-image: linear-gradient(to top, var(--white) 0%, rgba(255, 255, 255, 0) 5%), url("/theme/images/header-pattern.png");
background-size: cover, contain;
background-attachment: scroll, fixed;
background-repeat: no-repeat;
Expand Down Expand Up @@ -391,7 +400,7 @@ header .video a {
/* S FEATURES */

#features {
background-image: linear-gradient(to top, var(--dark-green), var(--dark-green) 50%, transparent 50%, transparent);
background-image: linear-gradient(to top, var(--dark-green), var(--dark-green) 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0));
padding-top: 0;
margin-top: calc(var(--unusable-padding) * -1 - 10px);
}
Expand Down Expand Up @@ -450,6 +459,11 @@ header .video a {
padding: var(--x3-padding) var(--unusable-padding);
}

#quick-links div > *{
float:left;
grid-column: 1 / 2;
}

#quick-links div {
background: var(--white);
filter: var(--light-shadow);
Expand Down Expand Up @@ -559,12 +573,18 @@ summary, #plans-modal h3{
}

/* S PRICING > Details */
#pricing summary::-webkit-details-marker{
summary::-webkit-details-marker{
display: none;
}
#pricing summary::marker{
summary::marker{
display:none;
}
::-webkit-details-marker { display:none; }

summary{
list-style-image: none;
}


#pricing summary:after {
height: 20px;
Expand Down Expand Up @@ -993,7 +1013,7 @@ footer .mail {
body.page section{
gap: var(--x3-padding);
padding-top: 150px;
background-image: linear-gradient(to top, var(--white), transparent), url(/theme/images/pattern-v2.png);
background-image: linear-gradient(to top, var(--white), rgba(255, 255, 255, 0)), url(/theme/images/pattern-v2.png);
background-size: auto 500px, auto 500px;
background-position: top right;
background-repeat: no-repeat;
Expand Down Expand Up @@ -1097,8 +1117,8 @@ font-size: 25px;
#blog-list, #blog-article{
gap: var(--x3-padding);
padding-top: 150px;
background-image: linear-gradient(to top, var(--white), transparent), url(/theme/images/pattern-v2.png);
background-size: auto 500px, auto 500px;
background-image: linear-gradient(to top, var(--white), rgba(255, 255, 255, 0)), url(/theme/images/pattern-v2.png);
background-size: 1000px 500px, auto 500px;
background-position: top right;
background-repeat: no-repeat;
}
Expand Down Expand Up @@ -1138,17 +1158,18 @@ font-size: 25px;
}
#blog-list article.blog-list .content *, #blog-article article.content *{
margin-bottom:var(--x1-padding);
max-width: 86vw;
overflow-wrap: break-word;
}
#blog-list article.blog-list .content img, #blog-article article.content img{
max-width: 100%;
}
#blog-list article.blog-list .content pre, #blog-article article.content pre{
white-space: pre-wrap;
white-space: -moz-pre-wrap;
white-space: -o-pre-wrap;
word-wrap: break-word;
font-family: "Source Code Pro", monospace;
overflow: scroll;
width: fit-content;
max-width: 86vw;
background: var(--light-gray);
}
#blog-list article.blog-list .content a, #blog-article article.content a{
overflow-wrap: anywhere;
Expand Down