jonny/jonnybarnes.uk
1
0
Fork 0
Code Issues 5 Pull requests Projects Releases 5 Packages Wiki Activity Actions

Merge pull request #118 from jonnybarnes/feature/better-mobile-width

Browse source 
Making improvements to the layout on mobile
This commit is contained in:
Jonny Barnes 2019-03-25 17:27:16 +00:00 • committed by GitHub
commit 27638226fa
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 30 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
public/assets/css/app.css vendored
View file

@ -1,2 +1,2 @@
html{font-family:montserrat, sans-serif;font-weight:300;font-style:normal;font-size:20px}h1{font-family:bebas-neue, sans-serif;font-weight:400;font-style:normal}code{font-family:"Operator Mono", monospace}#topheader{display:flex;width:100vw;flex-direction:column;align-items:center;background-color:var(--black)}#topheader a{color:var(--white);text-decoration:none}#topheader h1{margin-top:0;padding-top:1rem;font-size:3rem}#topheader nav{padding-bottom:1rem;font-size:1.5rem}main{display:flex;flex-direction:column;align-items:center;background-color:var(--white);color:var(--black)}main a{color:var(--blue);text-decoration:none}main .h-entry{margin:3rem 0}.pagination{display:flex;flex-direction:row;align-items:center;justify-content:space-around;list-style-type:none;width:40rem}.personal-bio{width:40rem}article.h-entry{width:40rem}.h-entry .note{width:40rem}@media screen and (max-width: 40rem){.h-entry .note{width:95vw}.h-entry .note .e-content img{width:100%}}footer{display:flex;flex-direction:column;align-items:center;background-color:var(--white);color:var(--black)}footer a{color:var(--blue);text-decoration:none}footer form:first-child{margin-bottom:1rem}footer p{margin-bottom:0}.map{height:200px}.note-metadata{display:flex;flex-direction:row;justify-content:space-between}.note-metadata .social-links{flex-direction:row}.note-metadata .social-links svg{height:1em;width:auto}span[role=img][aria-label]{position:relative}span[role=img][aria-label]:focus::after,span[role=img][aria-label]:hover::after{position:absolute;display:block;z-index:1;bottom:1.5em;left:0;padding:0.5em 0.75em;border:0.05em solid #fff;border-radius:0.2em;box-shadow:0.15em 0.15em 0.5em #000;content:attr(aria-label);background-color:rgba(0,0,0,0.85);color:#fff;font-size:80%;-webkit-animation:TOOLTIP 0.1s ease-out 1;animation:TOOLTIP 0.1s ease-out 1}@-webkit-keyframes TOOLTIP{from{bottom:0.5em;background-color:rgba(0,0,0,0);border:0.05em solid rgba(255,255,255,0);color:rgba(255,255,255,0);box-shadow:0 0 0 #000}to{bottom:1.5em;background-color:rgba(0,0,0,0.85);border:0.05em solid #fff;color:#fff;box-shadow:0.15em 0.15em 0.5em #000}}@keyframes TOOLTIP{from{bottom:0.5em;background-color:rgba(0,0,0,0);border:0.05em solid rgba(255,255,255,0);color:rgba(255,255,255,0);box-shadow:0 0 0 #000}to{bottom:1.5em;background-color:rgba(0,0,0,0.85);border:0.05em solid #fff;color:#fff;box-shadow:0.15em 0.15em 0.5em #000}}@media print{span[role=img][aria-label]::after{content:" (" attr(aria-label) ") "}}
html{font-family:montserrat, sans-serif;font-weight:300;font-style:normal;font-size:20px}h1{font-family:bebas-neue, sans-serif;font-weight:400;font-style:normal}code{font-family:"Operator Mono", monospace}#topheader{display:flex;width:100vw;flex-direction:column;align-items:center;background-color:var(--black)}#topheader a{color:var(--white);text-decoration:none}#topheader h1{margin-top:0;padding-top:1rem;font-size:3rem}#topheader nav{padding-bottom:1rem;font-size:1.5rem}main{display:flex;flex-direction:column;align-items:center;background-color:var(--white);color:var(--black)}main a{color:var(--blue);text-decoration:none}main .h-entry{margin:3rem 0}.pagination{display:flex;flex-direction:row;align-items:center;justify-content:space-around;list-style-type:none;width:40rem}@media screen and (max-width: 40rem){.pagination{width:95vw}}.personal-bio{width:40rem}@media screen and (max-width: 40rem){.personal-bio{width:95vw}}article.h-entry{width:40rem}.h-entry .note{width:40rem}@media screen and (max-width: 40rem){.h-entry .note{width:95vw}.h-entry .note .e-content img{width:100%}}footer{display:flex;flex-direction:column;align-items:center;background-color:var(--white);color:var(--black)}footer a{color:var(--blue);text-decoration:none}footer form:first-child{margin-bottom:1rem}footer p{margin-bottom:0}@media screen and (max-width: 40rem){footer img{width:95%}footer form{width:95vw}footer select{width:90vw}}.map{height:200px}.note-metadata{display:flex;flex-direction:row;justify-content:space-between}.note-metadata .social-links{flex-direction:row}.note-metadata .social-links svg{height:1em;width:auto}span[role=img][aria-label]{position:relative}span[role=img][aria-label]:focus::after,span[role=img][aria-label]:hover::after{position:absolute;display:block;z-index:1;bottom:1.5em;left:0;padding:0.5em 0.75em;border:0.05em solid #fff;border-radius:0.2em;box-shadow:0.15em 0.15em 0.5em #000;content:attr(aria-label);background-color:rgba(0,0,0,0.85);color:#fff;font-size:80%;-webkit-animation:TOOLTIP 0.1s ease-out 1;animation:TOOLTIP 0.1s ease-out 1}@-webkit-keyframes TOOLTIP{from{bottom:0.5em;background-color:rgba(0,0,0,0);border:0.05em solid rgba(255,255,255,0);color:rgba(255,255,255,0);box-shadow:0 0 0 #000}to{bottom:1.5em;background-color:rgba(0,0,0,0.85);border:0.05em solid #fff;color:#fff;box-shadow:0.15em 0.15em 0.5em #000}}@keyframes TOOLTIP{from{bottom:0.5em;background-color:rgba(0,0,0,0);border:0.05em solid rgba(255,255,255,0);color:rgba(255,255,255,0);box-shadow:0 0 0 #000}to{bottom:1.5em;background-color:rgba(0,0,0,0.85);border:0.05em solid #fff;color:#fff;box-shadow:0.15em 0.15em 0.5em #000}}@media print{span[role=img][aria-label]::after{content:" (" attr(aria-label) ") "}}
/*# sourceMappingURL=app.css.map */

BIN
public/assets/css/app.css.br
View file

Binary file not shown.

BIN
public/assets/css/app.css.gz
View file

Binary file not shown.

2
public/assets/css/app.css.map
View file

@ -1 +1 @@
{"version":3,"sources":["../../../resources/sass/_base.scss","../../../resources/sass/_site-header.scss","../../../resources/sass/_main.scss","../../../resources/sass/_pagination.scss","../../../resources/sass/_bio.scss","../../../resources/sass/_articles.scss","../../../resources/sass/_notes.scss","../../../resources/sass/_footer.scss","../../../resources/sass/_mapbox.scss","../../../resources/sass/_syndication.scss","../../../resources/sass/_emoji.scss"],"names":[],"mappings":"AAGA,KACI,kCAAmC,CACnC,eAAgB,CAChB,iBAAkB,CAClB,cAAe,CAClB,GAGG,kCAAmC,CACnC,eAAgB,CAChB,iBAAkB,CACrB,KAGG,sCAAuC,CAC1C,WCfG,YAAa,CACb,WAAY,CACZ,qBAAsB,CACtB,kBAAmB,CACnB,6BAA8B,CALlC,aAQQ,kBAAmB,CACnB,oBAAqB,CAT7B,cAaQ,YAAa,CACb,gBAAiB,CACjB,cAAe,CAfvB,eAmBQ,mBAAoB,CACpB,gBAAiB,CACpB,KCpBD,YAAa,CACb,qBAAsB,CACtB,kBAAmB,CACnB,6BAA8B,CAC9B,kBAAmB,CALvB,OAQQ,iBAAkB,CAClB,oBAAqB,CAT7B,cAaQ,aAAc,CACjB,YCbD,YAAa,CACb,kBAAmB,CACnB,kBAAmB,CACnB,4BAA6B,CAC7B,oBAAqB,CACrB,WHaa,CGZhB,cCNG,WJkBa,CIjBhB,gBCDG,WLkBa,CKjBhB,eCDG,WNkBa,CMjBhB,qCAGG,eACI,UAAW,CADf,8BAKY,UAAW,CACd,CCXb,OACI,YAAa,CACb,qBAAsB,CACtB,kBAAmB,CACnB,6BAA8B,CAC9B,kBAAmB,CALvB,SAQQ,iBAAkB,CAClB,oBAAqB,CAT7B,wBAaQ,kBAAmB,CAb3B,SAiBQ,eAAgB,CACnB,KCjBD,YAAa,CAChB,eCDG,YAAa,CACb,kBAAmB,CACnB,6BAA8B,CAHlC,6BAMQ,kBAAmB,CAN3B,iCASY,UAAW,CACX,UAAW,CACd,2BCRL,iBAAkB,CACrB,gFAIG,iBAAkB,CAClB,aAAc,CACd,SAAU,CACV,YAAa,CACb,MAAO,CACP,oBAAqB,CACrB,wBAA2C,CAC3C,mBAAoB,CACpB,mCAAgD,CAChD,wBAAyB,CACzB,iCAAqC,CACrC,UAA6B,CAC7B,aAAc,CACd,yCAAW,CAAX,iCAAkC,CACrC,2BAGG,KACI,YAAa,CACb,8BAAkC,CAClC,uCAA2C,CAC3C,yBAA6B,CAC7B,qBAAkC,CAGtC,GACI,YAAa,CACb,iCAAqC,CACrC,wBAA2C,CAC3C,UAA6B,CAC7B,mCAAgD,CAAA,CAhBvD,mBAGG,KACI,YAAa,CACb,8BAAkC,CAClC,uCAA2C,CAC3C,yBAA6B,CAC7B,qBAAkC,CAGtC,GACI,YAAa,CACb,iCAAqC,CACrC,wBAA2C,CAC3C,UAA6B,CAC7B,mCAAgD,CAAA,CAIxD,aACI,kCACI,kCAAmC,CACtC","file":"app.css"}
{"version":3,"sources":["../../../resources/sass/_base.scss","../../../resources/sass/_site-header.scss","../../../resources/sass/_main.scss","../../../resources/sass/_pagination.scss","../../../resources/sass/_bio.scss","../../../resources/sass/_articles.scss","../../../resources/sass/_notes.scss","../../../resources/sass/_footer.scss","../../../resources/sass/_mapbox.scss","../../../resources/sass/_syndication.scss","../../../resources/sass/_emoji.scss"],"names":[],"mappings":"AAGA,KACI,kCAAmC,CACnC,eAAgB,CAChB,iBAAkB,CAClB,cAAe,CAClB,GAGG,kCAAmC,CACnC,eAAgB,CAChB,iBAAkB,CACrB,KAGG,sCAAuC,CAC1C,WCfG,YAAa,CACb,WAAY,CACZ,qBAAsB,CACtB,kBAAmB,CACnB,6BAA8B,CALlC,aAQQ,kBAAmB,CACnB,oBAAqB,CAT7B,cAaQ,YAAa,CACb,gBAAiB,CACjB,cAAe,CAfvB,eAmBQ,mBAAoB,CACpB,gBAAiB,CACpB,KCpBD,YAAa,CACb,qBAAsB,CACtB,kBAAmB,CACnB,6BAA8B,CAC9B,kBAAmB,CALvB,OAQQ,iBAAkB,CAClB,oBAAqB,CAT7B,cAaQ,aAAc,CACjB,YCbD,YAAa,CACb,kBAAmB,CACnB,kBAAmB,CACnB,4BAA6B,CAC7B,oBAAqB,CACrB,WHaa,CGZhB,qCAGG,YACI,UAAW,CACd,CCZL,cACI,WJkBa,CIjBhB,qCAGG,cACI,UAAW,CACd,CCPL,gBACI,WLkBa,CKjBhB,eCDG,WNkBa,CMjBhB,qCAGG,eACI,UAAW,CADf,8BAKY,UAAW,CACd,CCXb,OACI,YAAa,CACb,qBAAsB,CACtB,kBAAmB,CACnB,6BAA8B,CAC9B,kBAAmB,CALvB,SAQQ,iBAAkB,CAClB,oBAAqB,CAT7B,wBAaQ,kBAAmB,CAb3B,SAiBQ,eAAgB,CACnB,qCAID,WAEQ,SAAU,CAFlB,YAMQ,UAAW,CANnB,cAUQ,UAAW,CACd,CCjCT,KACI,YAAa,CAChB,eCDG,YAAa,CACb,kBAAmB,CACnB,6BAA8B,CAHlC,6BAMQ,kBAAmB,CAN3B,iCASY,UAAW,CACX,UAAW,CACd,2BCRL,iBAAkB,CACrB,gFAIG,iBAAkB,CAClB,aAAc,CACd,SAAU,CACV,YAAa,CACb,MAAO,CACP,oBAAqB,CACrB,wBAA2C,CAC3C,mBAAoB,CACpB,mCAAgD,CAChD,wBAAyB,CACzB,iCAAqC,CACrC,UAA6B,CAC7B,aAAc,CACd,yCAAW,CAAX,iCAAkC,CACrC,2BAGG,KACI,YAAa,CACb,8BAAkC,CAClC,uCAA2C,CAC3C,yBAA6B,CAC7B,qBAAkC,CAGtC,GACI,YAAa,CACb,iCAAqC,CACrC,wBAA2C,CAC3C,UAA6B,CAC7B,mCAAgD,CAAA,CAhBvD,mBAGG,KACI,YAAa,CACb,8BAAkC,CAClC,uCAA2C,CAC3C,yBAA6B,CAC7B,qBAAkC,CAGtC,GACI,YAAa,CACb,iCAAqC,CACrC,wBAA2C,CAC3C,UAA6B,CAC7B,mCAAgD,CAAA,CAIxD,aACI,kCACI,kCAAmC,CACtC","file":"app.css"}

6
resources/sass/_bio.scss vendored
View file

@ -3,3 +3,9 @@
.personal-bio {
width: $mainWidth;
}
@media screen and (max-width: $mainWidth) {
.personal-bio {
width: 95vw;
}
}

16
resources/sass/_footer.scss vendored
View file

@ -20,3 +20,19 @@ footer {
margin-bottom: 0;
}
}
@media screen and (max-width: $mainWidth) {
footer {
img {
width: 95%;
}
form {
width: 95vw;
}
select {
width: 90vw;
}
}
}

6
resources/sass/_pagination.scss vendored
View file

@ -8,3 +8,9 @@
list-style-type: none;
width: $mainWidth;
}
@media screen and (max-width: $mainWidth) {
.pagination {
width: 95vw;
}
}