From 24aefd30b1beae74f71e96956de8b26ab1b97afc Mon Sep 17 00:00:00 2001 From: Thiago Date: Fri, 26 Jan 2024 19:57:05 -0300 Subject: [PATCH 1/4] fix white spaces in posts and improve colors --- ...s_511aa33e99371f93fbf403479ebfd32e.content | 2 +- ...scss_511aa33e99371f93fbf403479ebfd32e.json | 2 +- themes/basic/assets/css/_home.scss | 82 +++--- themes/basic/assets/css/_posts.scss | 238 +++++++++--------- 4 files changed, 162 insertions(+), 162 deletions(-) diff --git a/resources/_gen/assets/scss/css/style.scss_511aa33e99371f93fbf403479ebfd32e.content b/resources/_gen/assets/scss/css/style.scss_511aa33e99371f93fbf403479ebfd32e.content index 9c583f2..3bc2977 100644 --- a/resources/_gen/assets/scss/css/style.scss_511aa33e99371f93fbf403479ebfd32e.content +++ b/resources/_gen/assets/scss/css/style.scss_511aa33e99371f93fbf403479ebfd32e.content @@ -1 +1 @@ -@import "https://fonts.googleapis.com/css2?family=Open+Sans&display=swap";@media only screen and (min-width:768px){.project-container{display:flex}.project-container .project-list{width:20%}.project-container .project{flex:1}}#output li{list-style:none}.post-list{display:flex;flex-flow:row wrap;justify-content:space-evenly}.post-list .box-post{display:flex;flex-direction:column;flex-basis:calc(33% - 2.5rem);justify-content:flex-end;margin:.4rem;padding:.5rem;align-items:stretch}.post-list .box-post .title{text-decoration:none;flex:1}.post-list .box-post .title h3{color:#0086b3;flex-basis:20%;font-size:1.25em}.post-list .box-post .date{font-size:.9em;color:#818181}.post-list .box-post .summary-container{max-height:310px;overflow:hidden}.post-list .box-post .summary-container figure{max-width:300px;height:150px;margin-left:auto;margin-right:auto}.post-list .box-post .summary-container figure img{width:100%;height:100%;object-fit:cover}.post-list .box-post .summary-container figure figcaption{display:none}.post-list .box-post .summary-container p{font-size:.85em;color:#616161}.post{max-width:768px;margin:auto}.post>*{margin:2rem 0}.post header>*{margin:2rem 0}.post header h2{font-size:2.5em}.post header .tags{display:flex;flex-direction:row;flex-wrap:wrap}.post header .tags .tag{margin:.25rem;padding:.5rem;border-radius:5px;font-weight:700;font-size:.9em;background-color:#0086b3;color:#fff}.post header .meta{display:flex;flex-direction:column;font-size:.9em}.post header .meta label{padding:.5rem 0}.post header a.tag,.post .body a.tag{background-color:#ddd;color:#333;display:inline-block;padding:.1em;font-size:.9em;text-decoration:none}.post header figure,.post .body figure{display:flex;flex-direction:column;justify-content:center;align-items:center}.post header figure img,.post .body figure img{width:auto;height:auto;max-width:768px;max-height:400px;margin:auto;padding:1rem}.post header figure figcaption,.post .body figure figcaption{font-size:.8em;color:#666}.post .highlight pre{padding:1rem;border-radius:5px;overflow:auto}@media(max-width:768px){.post-list{flex-direction:column}.post figure img{max-width:100%}}.home .home-head{text-align:center;margin:1rem 0;padding:1rem 0}.home .home-head h1{margin:1rem 0;font-size:3.5em}.home .home-head label{font-size:.8em;color:#414141}.home .animation-gopher{margin:auto;max-width:150px;width:80%}.home .content{padding:1rem 0;display:flex;flex-direction:row;justify-content:center;flex-wrap:wrap}.home .content .box-section{flex-basis:calc(30% - 4rem);margin:1rem;text-decoration:none;display:flex;flex-direction:column;text-align:center;padding:1rem;color:#7c1ad2}.home .content .box-section:hover{background-color:#0086b3}.home .content .box-section:hover b{color:#fff}.home .content .box-section b{color:#313131}@media(max-width:768px){.home .content .box-section{flex-basis:calc(100% - 4rem)}}p img{max-width:100%;height:auto;display:block;margin-left:auto;margin-right:auto}footer{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:2rem}html,body,.container{width:100%;height:100%;margin:0;font-family:work sans,san-serif}.app-width{width:calc(100% - calc(10px * 2))!important;padding-left:10px!important;padding-right:10px!important}@media(min-width:1020px){.app-width{width:1000px!important;padding-left:calc(50% - calc(1000px/2))!important;padding-right:calc(50% - calc(1000px/2))!important}.app-width p>img{height:350px;display:block;margin:auto}}.box{border:1px solid #ddd;background-color:#fff;border-radius:.5rem}.box:hover{border:1px solid transparent;box-shadow:1px 1px 5px #999}a{text-decoration:none;color:#0013ff}a:hover{text-decoration:underline;cursor:pointer}.page-header{display:flex;flex-direction:row;justify-content:center;align-items:center;height:75px;border-bottom:1px solid #ddd}.page-header .header-left{text-align:left}.page-header .header-center{text-align:center;flex:1}.page-header .header-right{text-align:right}.page-header .button-search{text-decoration:none}.page-header:hover{border-bottom:1px solid #ccc;box-shadow:1px 1px 3px #ccc}nav a{text-decoration:none!important;font-weight:700;color:#313131;padding:.5rem;font-size:.9em}nav a:hover{color:#0086b3}.oss{display:flex;flex-wrap:wrap;justify-content:space-between}.oss article{border:1px solid #ddd;box-shadow:3px 3px 3px #ddd;margin:.5%;padding:.5%;width:30%;border-radius:4px;text-align:center}.colabs{display:flex;flex-wrap:wrap;justify-content:space-between;text-align:center}.colabs article{border:1px solid #ddd;margin:.5%;padding:.5%;width:20%;border-radius:10px;box-shadow:1px 1px 1px #c2c2c2;background-color:#fcfcfc}.colabs img{width:55px;height:55px;border-radius:5px;padding-bottom:8%}.colabs a{text-decoration:none;color:#333;font-size:16px}.colabs a:hover{text-decoration:underline;cursor:pointer}.pagination{display:flex;justify-content:space-between;list-style:none;margin:1em auto;padding:0}@media only screen and (min-width:768px){.pagination{width:30%}}.pagination>.page-item{border:1px solid #ddd;flex:1;text-align:center;width:5em}.pagination .page-link{display:block;color:#000;text-decoration:none}.pagination>.page-item.active{background-color:#333}.pagination>.page-item.active>.page-link{color:#fff}.pagination>.page-item.disabled>.page-link{color:#ddd} \ No newline at end of file +@import "https://fonts.googleapis.com/css2?family=Open+Sans&display=swap";@media only screen and (min-width:768px){.project-container{display:flex}.project-container .project-list{width:20%}.project-container .project{flex:1}}#output li{list-style:none}.post-list{display:flex;flex-flow:row wrap;justify-content:space-evenly}.post-list .box-post{display:initial;flex-basis:calc(33% - 2.5rem);margin:.4rem;padding:.5rem}.post-list .box-post .title{text-decoration:none;flex:1}.post-list .box-post .title h3{color:#0086b3;flex-basis:20%;font-size:1.25em}.post-list .box-post .date{font-size:.9em;color:#818181}.post-list .box-post .summary-container{max-height:310px;overflow:hidden}.post-list .box-post .summary-container figure{max-width:300px;height:150px;margin-left:auto;margin-right:auto}.post-list .box-post .summary-container figure img{width:100%;height:100%;object-fit:cover}.post-list .box-post .summary-container figure figcaption{display:none}.post-list .box-post .summary-container p{font-size:.85em;color:#616161}.post{max-width:768px;margin:auto}.post>*{margin:2rem 0}.post header>*{margin:2rem 0}.post header h2{font-size:2.5em}.post header .tags{display:flex;flex-direction:row;flex-wrap:wrap}.post header .tags .tag{margin:.25rem;padding:.5rem;border-radius:5px;font-weight:700;font-size:.9em;background-color:#0086b3;color:#fff}.post header .meta{display:flex;flex-direction:column;font-size:.9em}.post header .meta label{padding:.5rem 0}.post header a.tag,.post .body a.tag{background-color:#ddd;color:#333;display:inline-block;padding:.1em;font-size:.9em;text-decoration:none}.post header figure,.post .body figure{display:flex;flex-direction:column;justify-content:center;align-items:center}.post header figure img,.post .body figure img{width:auto;height:auto;max-width:768px;max-height:400px;margin:auto;padding:1rem}.post header figure figcaption,.post .body figure figcaption{font-size:.8em;color:#666}.post .highlight pre{padding:1rem;border-radius:5px;overflow:auto}@media(max-width:768px){.post-list{flex-direction:column}.post figure img{max-width:100%}}.home .home-head{text-align:center;margin:1rem 0;padding:1rem 0}.home .home-head h1{margin:1rem 0;font-size:3.5em}.home .home-head label{font-size:.8em;color:#414141}.home .animation-gopher{margin:auto;max-width:150px;width:80%}.home .content{padding:1rem 0;display:flex;flex-direction:row;justify-content:center;flex-wrap:wrap}.home .content .box-section{flex-basis:calc(30% - 4rem);margin:1rem;text-decoration:none;display:flex;flex-direction:column;text-align:center;padding:1rem;color:#7c1ad2}.home .content .box-section:hover{background-color:#8cc5e7}.home .content .box-section:hover b{color:#fff}.home .content .box-section b{color:#313131}@media(max-width:768px){.home .content .box-section{flex-basis:calc(100% - 4rem)}}p img{max-width:100%;height:auto;display:block;margin-left:auto;margin-right:auto}footer{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:2rem}html,body,.container{width:100%;height:100%;margin:0;font-family:work sans,san-serif}.app-width{width:calc(100% - calc(10px * 2))!important;padding-left:10px!important;padding-right:10px!important}@media(min-width:1020px){.app-width{width:1000px!important;padding-left:calc(50% - calc(1000px/2))!important;padding-right:calc(50% - calc(1000px/2))!important}.app-width p>img{height:350px;display:block;margin:auto}}.box{border:1px solid #ddd;background-color:#fff;border-radius:.5rem}.box:hover{border:1px solid transparent;box-shadow:1px 1px 5px #999}a{text-decoration:none;color:#0013ff}a:hover{text-decoration:underline;cursor:pointer}.page-header{display:flex;flex-direction:row;justify-content:center;align-items:center;height:75px;border-bottom:1px solid #ddd}.page-header .header-left{text-align:left}.page-header .header-center{text-align:center;flex:1}.page-header .header-right{text-align:right}.page-header .button-search{text-decoration:none}.page-header:hover{border-bottom:1px solid #ccc;box-shadow:1px 1px 3px #ccc}nav a{text-decoration:none!important;font-weight:700;color:#313131;padding:.5rem;font-size:.9em}nav a:hover{color:#0086b3}.oss{display:flex;flex-wrap:wrap;justify-content:space-between}.oss article{border:1px solid #ddd;box-shadow:3px 3px 3px #ddd;margin:.5%;padding:.5%;width:30%;border-radius:4px;text-align:center}.colabs{display:flex;flex-wrap:wrap;justify-content:space-between;text-align:center}.colabs article{border:1px solid #ddd;margin:.5%;padding:.5%;width:20%;border-radius:10px;box-shadow:1px 1px 1px #c2c2c2;background-color:#fcfcfc}.colabs img{width:55px;height:55px;border-radius:5px;padding-bottom:8%}.colabs a{text-decoration:none;color:#333;font-size:16px}.colabs a:hover{text-decoration:underline;cursor:pointer}.pagination{display:flex;justify-content:space-between;list-style:none;margin:1em auto;padding:0}@media only screen and (min-width:768px){.pagination{width:30%}}.pagination>.page-item{border:1px solid #ddd;flex:1;text-align:center;width:5em}.pagination .page-link{display:block;color:#000;text-decoration:none}.pagination>.page-item.active{background-color:#333}.pagination>.page-item.active>.page-link{color:#fff}.pagination>.page-item.disabled>.page-link{color:#ddd} \ No newline at end of file diff --git a/resources/_gen/assets/scss/css/style.scss_511aa33e99371f93fbf403479ebfd32e.json b/resources/_gen/assets/scss/css/style.scss_511aa33e99371f93fbf403479ebfd32e.json index 463afd7..d7282f9 100644 --- a/resources/_gen/assets/scss/css/style.scss_511aa33e99371f93fbf403479ebfd32e.json +++ b/resources/_gen/assets/scss/css/style.scss_511aa33e99371f93fbf403479ebfd32e.json @@ -1 +1 @@ -{"Target":"css/style.min.2df3ea3dd95a97ec03deab070e26b1d312943a60908cd90d93de6083b79278c5.css","MediaType":"text/css","Data":{"Integrity":"sha256-LfPqPdlal+wD3qsHDiax0xKUOmCQjNkNk95gg7eSeMU="}} \ No newline at end of file +{"Target":"css/style.min.57cc4181eda956a69baad5ef016d37861fe8765249427597a45c4af8acc82a81.css","MediaType":"text/css","Data":{"Integrity":"sha256-V8xBge2pVqabqtXvAW03hh/odlJJQnWXpFxK+KzIKoE="}} \ No newline at end of file diff --git a/themes/basic/assets/css/_home.scss b/themes/basic/assets/css/_home.scss index ba8c72f..ca48908 100644 --- a/themes/basic/assets/css/_home.scss +++ b/themes/basic/assets/css/_home.scss @@ -1,59 +1,59 @@ @import "vars"; .home { - .home-head { - text-align: center; - margin: 1rem 0; - padding: 1rem 0; + .home-head { + text-align: center; + margin: 1rem 0; + padding: 1rem 0; - h1 { - margin: 1rem 0; - font-size: 3.5em; + h1 { + margin: 1rem 0; + font-size: 3.5em; + } + label { + font-size: 0.8em; + color: #414141; + } } - label { - font-size: 0.8em; - color: #414141; - } - } - .animation-gopher { - margin: auto; - max-width: 150px; - width: 80%; - } + .animation-gopher { + margin: auto; + max-width: 150px; + width: 80%; + } - .content { - padding: 1rem 0; - display: flex; - flex-direction: row; - justify-content: center; - flex-wrap: wrap; + .content { + padding: 1rem 0; + display: flex; + flex-direction: row; + justify-content: center; + flex-wrap: wrap; - .box-section { - flex-basis: calc(30% - 4rem); - margin: 1rem; - text-decoration: none; - display: flex; - flex-direction: column; - text-align: center; - padding: 1rem; - color: #7c1ad2; + .box-section { + flex-basis: calc(30% - 4rem); + margin: 1rem; + text-decoration: none; + display: flex; + flex-direction: column; + text-align: center; + padding: 1rem; + color: #7c1ad2; - &:hover { - background-color: $second-color; + &:hover { + background-color: #8cc5e7; - b { color: white } - } + b { color: white } + } - b { color: #313131 } + b { color: #313131 } + } } - } } @media (max-width: #{$display-mid-max}) { - .home .content .box-section { - flex-basis: calc(100% - 4rem); - } + .home .content .box-section { + flex-basis: calc(100% - 4rem); + } } diff --git a/themes/basic/assets/css/_posts.scss b/themes/basic/assets/css/_posts.scss index 2760599..cb7aa69 100644 --- a/themes/basic/assets/css/_posts.scss +++ b/themes/basic/assets/css/_posts.scss @@ -1,150 +1,150 @@ @import "vars"; .post-list { - display: flex; - flex-flow: row wrap; - justify-content: space-evenly; - - .box-post { display: flex; - flex-direction: column; - flex-basis: calc(33% - 2.5rem); - justify-content: flex-end; - margin: 0.4rem; - padding: 0.5rem; - align-items: stretch; - - .title { - text-decoration: none; - flex: 1; - - h3 { - color: $second-color; - flex-basis: 20%; - font-size: 1.25em; - } - } - - .date { - font-size: 0.9em; - color: #818181; - } - - .summary-container { - max-height: 310px; - overflow: hidden; + flex-flow: row wrap; + justify-content: space-evenly; + + .box-post { + display: initial; // NOTE: fix the white space between the title and the date. + // flex-direction: column; + flex-basis: calc(33% - 2.5rem); + // justify-content: flex-end; + margin: 0.4rem; + padding: 0.5rem; + // align-items: stretch; - figure { - max-width: 300px; - height: 150px; - margin-left: auto; - margin-right: auto; + .title { + text-decoration: none; + flex: 1; - img { - width: 100%; - height: 100%; - object-fit: cover; + h3 { + color: $second-color; + flex-basis: 20%; + font-size: 1.25em; + } } - figcaption { display: none } - } + .date { + font-size: 0.9em; + color: #818181; + } - p { - font-size: 0.85em; - color: #616161; - } + .summary-container { + max-height: 310px; + overflow: hidden; + + figure { + max-width: 300px; + height: 150px; + margin-left: auto; + margin-right: auto; + + img { + width: 100%; + height: 100%; + object-fit: cover; + } + + figcaption { display: none } + } + + p { + font-size: 0.85em; + color: #616161; + } + } } - } } .post { - max-width: $display-mid-max; - margin: auto; - - > * { - margin: 2rem 0; - } + max-width: $display-mid-max; + margin: auto; - header { > * { - margin: 2rem 0; + margin: 2rem 0; } - h2 { font-size: 2.5em } - - .tags { - display: flex; - flex-direction: row; - flex-wrap: wrap; + header { + > * { + margin: 2rem 0; + } - .tag { - margin: 0.25rem; - padding: 0.5rem; - border-radius: 5px; - font-weight: bold; - font-size: 0.9em; - background-color: $second-color; - color: white; - } - } + h2 { font-size: 2.5em } + + .tags { + display: flex; + flex-direction: row; + flex-wrap: wrap; + + .tag { + margin: 0.25rem; + padding: 0.5rem; + border-radius: 5px; + font-weight: bold; + font-size: 0.9em; + background-color: $second-color; + color: white; + } + } - .meta { - display: flex; - flex-direction: column; - font-size: 0.9em; + .meta { + display: flex; + flex-direction: column; + font-size: 0.9em; - label { padding: 0.5rem 0 } - } - } - - header, .body { - a.tag { - background-color: #ddd; - color: #333; - display: inline-block; - padding: 0.1em; - font-size: 0.9em; - text-decoration: none; + label { padding: 0.5rem 0 } + } } - figure { - display: flex; - flex-direction: column; - justify-content: center; - align-items: center; - - img { - width: auto; - height: auto; - max-width: $display-mid-max; - max-height: 400px; - margin: auto; - padding: 1rem; - } - - figcaption { - font-size: 0.8em; - color: #666; - } + header, .body { + a.tag { + background-color: #ddd; + color: #333; + display: inline-block; + padding: 0.1em; + font-size: 0.9em; + text-decoration: none; + } + + figure { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + + img { + width: auto; + height: auto; + max-width: $display-mid-max; + max-height: 400px; + margin: auto; + padding: 1rem; + } + + figcaption { + font-size: 0.8em; + color: #666; + } + } } - } - .highlight { + .highlight { - pre { - padding: 1rem; - border-radius: 5px; - overflow: auto; + pre { + padding: 1rem; + border-radius: 5px; + overflow: auto; + } } - } } @media (max-width: #{$display-mid-max}) { - .post-list { - flex-direction: column; - } + .post-list { + flex-direction: column; + } - .post figure img { - max-width: 100%; - } + .post figure img { + max-width: 100%; + } } From 082242b14cf0e5df3745ce283f82759e0fa9dc14 Mon Sep 17 00:00:00 2001 From: Thiago Date: Fri, 26 Jan 2024 20:49:14 -0300 Subject: [PATCH 2/4] make project images responsive --- .../style.scss_511aa33e99371f93fbf403479ebfd32e.content | 2 +- .../css/style.scss_511aa33e99371f93fbf403479ebfd32e.json | 2 +- themes/basic/assets/css/_home.scss | 8 ++++++++ themes/basic/layouts/proyectos/single.html | 4 ++-- 4 files changed, 12 insertions(+), 4 deletions(-) diff --git a/resources/_gen/assets/scss/css/style.scss_511aa33e99371f93fbf403479ebfd32e.content b/resources/_gen/assets/scss/css/style.scss_511aa33e99371f93fbf403479ebfd32e.content index 3bc2977..4dd5359 100644 --- a/resources/_gen/assets/scss/css/style.scss_511aa33e99371f93fbf403479ebfd32e.content +++ b/resources/_gen/assets/scss/css/style.scss_511aa33e99371f93fbf403479ebfd32e.content @@ -1 +1 @@ -@import "https://fonts.googleapis.com/css2?family=Open+Sans&display=swap";@media only screen and (min-width:768px){.project-container{display:flex}.project-container .project-list{width:20%}.project-container .project{flex:1}}#output li{list-style:none}.post-list{display:flex;flex-flow:row wrap;justify-content:space-evenly}.post-list .box-post{display:initial;flex-basis:calc(33% - 2.5rem);margin:.4rem;padding:.5rem}.post-list .box-post .title{text-decoration:none;flex:1}.post-list .box-post .title h3{color:#0086b3;flex-basis:20%;font-size:1.25em}.post-list .box-post .date{font-size:.9em;color:#818181}.post-list .box-post .summary-container{max-height:310px;overflow:hidden}.post-list .box-post .summary-container figure{max-width:300px;height:150px;margin-left:auto;margin-right:auto}.post-list .box-post .summary-container figure img{width:100%;height:100%;object-fit:cover}.post-list .box-post .summary-container figure figcaption{display:none}.post-list .box-post .summary-container p{font-size:.85em;color:#616161}.post{max-width:768px;margin:auto}.post>*{margin:2rem 0}.post header>*{margin:2rem 0}.post header h2{font-size:2.5em}.post header .tags{display:flex;flex-direction:row;flex-wrap:wrap}.post header .tags .tag{margin:.25rem;padding:.5rem;border-radius:5px;font-weight:700;font-size:.9em;background-color:#0086b3;color:#fff}.post header .meta{display:flex;flex-direction:column;font-size:.9em}.post header .meta label{padding:.5rem 0}.post header a.tag,.post .body a.tag{background-color:#ddd;color:#333;display:inline-block;padding:.1em;font-size:.9em;text-decoration:none}.post header figure,.post .body figure{display:flex;flex-direction:column;justify-content:center;align-items:center}.post header figure img,.post .body figure img{width:auto;height:auto;max-width:768px;max-height:400px;margin:auto;padding:1rem}.post header figure figcaption,.post .body figure figcaption{font-size:.8em;color:#666}.post .highlight pre{padding:1rem;border-radius:5px;overflow:auto}@media(max-width:768px){.post-list{flex-direction:column}.post figure img{max-width:100%}}.home .home-head{text-align:center;margin:1rem 0;padding:1rem 0}.home .home-head h1{margin:1rem 0;font-size:3.5em}.home .home-head label{font-size:.8em;color:#414141}.home .animation-gopher{margin:auto;max-width:150px;width:80%}.home .content{padding:1rem 0;display:flex;flex-direction:row;justify-content:center;flex-wrap:wrap}.home .content .box-section{flex-basis:calc(30% - 4rem);margin:1rem;text-decoration:none;display:flex;flex-direction:column;text-align:center;padding:1rem;color:#7c1ad2}.home .content .box-section:hover{background-color:#8cc5e7}.home .content .box-section:hover b{color:#fff}.home .content .box-section b{color:#313131}@media(max-width:768px){.home .content .box-section{flex-basis:calc(100% - 4rem)}}p img{max-width:100%;height:auto;display:block;margin-left:auto;margin-right:auto}footer{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:2rem}html,body,.container{width:100%;height:100%;margin:0;font-family:work sans,san-serif}.app-width{width:calc(100% - calc(10px * 2))!important;padding-left:10px!important;padding-right:10px!important}@media(min-width:1020px){.app-width{width:1000px!important;padding-left:calc(50% - calc(1000px/2))!important;padding-right:calc(50% - calc(1000px/2))!important}.app-width p>img{height:350px;display:block;margin:auto}}.box{border:1px solid #ddd;background-color:#fff;border-radius:.5rem}.box:hover{border:1px solid transparent;box-shadow:1px 1px 5px #999}a{text-decoration:none;color:#0013ff}a:hover{text-decoration:underline;cursor:pointer}.page-header{display:flex;flex-direction:row;justify-content:center;align-items:center;height:75px;border-bottom:1px solid #ddd}.page-header .header-left{text-align:left}.page-header .header-center{text-align:center;flex:1}.page-header .header-right{text-align:right}.page-header .button-search{text-decoration:none}.page-header:hover{border-bottom:1px solid #ccc;box-shadow:1px 1px 3px #ccc}nav a{text-decoration:none!important;font-weight:700;color:#313131;padding:.5rem;font-size:.9em}nav a:hover{color:#0086b3}.oss{display:flex;flex-wrap:wrap;justify-content:space-between}.oss article{border:1px solid #ddd;box-shadow:3px 3px 3px #ddd;margin:.5%;padding:.5%;width:30%;border-radius:4px;text-align:center}.colabs{display:flex;flex-wrap:wrap;justify-content:space-between;text-align:center}.colabs article{border:1px solid #ddd;margin:.5%;padding:.5%;width:20%;border-radius:10px;box-shadow:1px 1px 1px #c2c2c2;background-color:#fcfcfc}.colabs img{width:55px;height:55px;border-radius:5px;padding-bottom:8%}.colabs a{text-decoration:none;color:#333;font-size:16px}.colabs a:hover{text-decoration:underline;cursor:pointer}.pagination{display:flex;justify-content:space-between;list-style:none;margin:1em auto;padding:0}@media only screen and (min-width:768px){.pagination{width:30%}}.pagination>.page-item{border:1px solid #ddd;flex:1;text-align:center;width:5em}.pagination .page-link{display:block;color:#000;text-decoration:none}.pagination>.page-item.active{background-color:#333}.pagination>.page-item.active>.page-link{color:#fff}.pagination>.page-item.disabled>.page-link{color:#ddd} \ No newline at end of file +@import "https://fonts.googleapis.com/css2?family=Open+Sans&display=swap";@media only screen and (min-width:768px){.project-container{display:flex}.project-container .project-list{width:20%}.project-container .project{flex:1}}#output li{list-style:none}.post-list{display:flex;flex-flow:row wrap;justify-content:space-evenly}.post-list .box-post{display:initial;flex-basis:calc(33% - 2.5rem);margin:.4rem;padding:.5rem}.post-list .box-post .title{text-decoration:none;flex:1}.post-list .box-post .title h3{color:#0086b3;flex-basis:20%;font-size:1.25em}.post-list .box-post .date{font-size:.9em;color:#818181}.post-list .box-post .summary-container{max-height:310px;overflow:hidden}.post-list .box-post .summary-container figure{max-width:300px;height:150px;margin-left:auto;margin-right:auto}.post-list .box-post .summary-container figure img{width:100%;height:100%;object-fit:cover}.post-list .box-post .summary-container figure figcaption{display:none}.post-list .box-post .summary-container p{font-size:.85em;color:#616161}.post{max-width:768px;margin:auto}.post>*{margin:2rem 0}.post header>*{margin:2rem 0}.post header h2{font-size:2.5em}.post header .tags{display:flex;flex-direction:row;flex-wrap:wrap}.post header .tags .tag{margin:.25rem;padding:.5rem;border-radius:5px;font-weight:700;font-size:.9em;background-color:#0086b3;color:#fff}.post header .meta{display:flex;flex-direction:column;font-size:.9em}.post header .meta label{padding:.5rem 0}.post header a.tag,.post .body a.tag{background-color:#ddd;color:#333;display:inline-block;padding:.1em;font-size:.9em;text-decoration:none}.post header figure,.post .body figure{display:flex;flex-direction:column;justify-content:center;align-items:center}.post header figure img,.post .body figure img{width:auto;height:auto;max-width:768px;max-height:400px;margin:auto;padding:1rem}.post header figure figcaption,.post .body figure figcaption{font-size:.8em;color:#666}.post .highlight pre{padding:1rem;border-radius:5px;overflow:auto}@media(max-width:768px){.post-list{flex-direction:column}.post figure img{max-width:100%}}.home .home-head{text-align:center;margin:1rem 0;padding:1rem 0}.home .home-head h1{margin:1rem 0;font-size:3.5em}.home .home-head label{font-size:.8em;color:#414141}.home .animation-gopher{margin:auto;max-width:150px;width:80%}.home .content{padding:1rem 0;display:flex;flex-direction:row;justify-content:center;flex-wrap:wrap}.home .content .box-section{flex-basis:calc(30% - 4rem);margin:1rem;text-decoration:none;display:flex;flex-direction:column;text-align:center;padding:1rem;color:#7c1ad2}.home .content .box-section:hover{background-color:#8cc5e7}.home .content .box-section:hover b{color:#fff}.home .content .box-section b{color:#313131}@media(max-width:768px){.home .content .box-section{flex-basis:calc(100% - 4rem)}}p img{max-width:100%;height:auto;display:block;margin-left:auto;margin-right:auto}.image-project{max-width:100%;height:auto;display:block;margin:0 auto}footer{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:2rem}html,body,.container{width:100%;height:100%;margin:0;font-family:work sans,san-serif}.app-width{width:calc(100% - calc(10px * 2))!important;padding-left:10px!important;padding-right:10px!important}@media(min-width:1020px){.app-width{width:1000px!important;padding-left:calc(50% - calc(1000px/2))!important;padding-right:calc(50% - calc(1000px/2))!important}.app-width p>img{height:350px;display:block;margin:auto}}.box{border:1px solid #ddd;background-color:#fff;border-radius:.5rem}.box:hover{border:1px solid transparent;box-shadow:1px 1px 5px #999}a{text-decoration:none;color:#0013ff}a:hover{text-decoration:underline;cursor:pointer}.page-header{display:flex;flex-direction:row;justify-content:center;align-items:center;height:75px;border-bottom:1px solid #ddd}.page-header .header-left{text-align:left}.page-header .header-center{text-align:center;flex:1}.page-header .header-right{text-align:right}.page-header .button-search{text-decoration:none}.page-header:hover{border-bottom:1px solid #ccc;box-shadow:1px 1px 3px #ccc}nav a{text-decoration:none!important;font-weight:700;color:#313131;padding:.5rem;font-size:.9em}nav a:hover{color:#0086b3}.oss{display:flex;flex-wrap:wrap;justify-content:space-between}.oss article{border:1px solid #ddd;box-shadow:3px 3px 3px #ddd;margin:.5%;padding:.5%;width:30%;border-radius:4px;text-align:center}.colabs{display:flex;flex-wrap:wrap;justify-content:space-between;text-align:center}.colabs article{border:1px solid #ddd;margin:.5%;padding:.5%;width:20%;border-radius:10px;box-shadow:1px 1px 1px #c2c2c2;background-color:#fcfcfc}.colabs img{width:55px;height:55px;border-radius:5px;padding-bottom:8%}.colabs a{text-decoration:none;color:#333;font-size:16px}.colabs a:hover{text-decoration:underline;cursor:pointer}.pagination{display:flex;justify-content:space-between;list-style:none;margin:1em auto;padding:0}@media only screen and (min-width:768px){.pagination{width:30%}}.pagination>.page-item{border:1px solid #ddd;flex:1;text-align:center;width:5em}.pagination .page-link{display:block;color:#000;text-decoration:none}.pagination>.page-item.active{background-color:#333}.pagination>.page-item.active>.page-link{color:#fff}.pagination>.page-item.disabled>.page-link{color:#ddd} \ No newline at end of file diff --git a/resources/_gen/assets/scss/css/style.scss_511aa33e99371f93fbf403479ebfd32e.json b/resources/_gen/assets/scss/css/style.scss_511aa33e99371f93fbf403479ebfd32e.json index d7282f9..6f9365d 100644 --- a/resources/_gen/assets/scss/css/style.scss_511aa33e99371f93fbf403479ebfd32e.json +++ b/resources/_gen/assets/scss/css/style.scss_511aa33e99371f93fbf403479ebfd32e.json @@ -1 +1 @@ -{"Target":"css/style.min.57cc4181eda956a69baad5ef016d37861fe8765249427597a45c4af8acc82a81.css","MediaType":"text/css","Data":{"Integrity":"sha256-V8xBge2pVqabqtXvAW03hh/odlJJQnWXpFxK+KzIKoE="}} \ No newline at end of file +{"Target":"css/style.min.9a8976ad57b77105f4d3cdaf4e5a9ec2d04fdd60d0dfe40d5cfae835630dc329.css","MediaType":"text/css","Data":{"Integrity":"sha256-mol2rVe3cQX0082vTlqewtBP3WDQ3+QNXProNWMNwyk="}} \ No newline at end of file diff --git a/themes/basic/assets/css/_home.scss b/themes/basic/assets/css/_home.scss index ca48908..551d4d1 100644 --- a/themes/basic/assets/css/_home.scss +++ b/themes/basic/assets/css/_home.scss @@ -65,3 +65,11 @@ p img { margin-left: auto; margin-right: auto; } + +// Project Images Responsives +.image-project { + max-width: 100%; + height: auto; + display: block; + margin: 0 auto; /* Esto centra la imagen dentro de su contenedor */ +} diff --git a/themes/basic/layouts/proyectos/single.html b/themes/basic/layouts/proyectos/single.html index 310a7e4..d5a0af3 100644 --- a/themes/basic/layouts/proyectos/single.html +++ b/themes/basic/layouts/proyectos/single.html @@ -11,7 +11,7 @@

Proyectos

{{ .Title }}

{{ .Content }} - {{ .Params.alt_text }} + {{ .Params.alt_text }}

Tecnología utilizada

    {{ range .Params.tech_used }} @@ -24,4 +24,4 @@

    Repositorio

-{{ end }} \ No newline at end of file +{{ end }} From 77907ef3815b417644a0a902e62849d60fffbe3d Mon Sep 17 00:00:00 2001 From: Thiago Date: Fri, 26 Jan 2024 20:55:33 -0300 Subject: [PATCH 3/4] improve the comment lines --- themes/basic/assets/css/_home.scss | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/themes/basic/assets/css/_home.scss b/themes/basic/assets/css/_home.scss index 551d4d1..cdc29fe 100644 --- a/themes/basic/assets/css/_home.scss +++ b/themes/basic/assets/css/_home.scss @@ -40,7 +40,7 @@ color: #7c1ad2; &:hover { - background-color: #8cc5e7; + background-color: #8cc5e7; // same color as the golang logo. b { color: white } } @@ -71,5 +71,5 @@ p img { max-width: 100%; height: auto; display: block; - margin: 0 auto; /* Esto centra la imagen dentro de su contenedor */ + margin: 0 auto; } From 6ab64c8ab43961f6f0d4d3fb4c36aac807c2b68a Mon Sep 17 00:00:00 2001 From: Thiago Date: Sat, 27 Jan 2024 13:17:02 -0300 Subject: [PATCH 4/4] fix colab boxs responsive --- ...s_511aa33e99371f93fbf403479ebfd32e.content | 2 +- ...scss_511aa33e99371f93fbf403479ebfd32e.json | 2 +- themes/basic/assets/css/_colabs.scss | 24 +++++++++++++++++++ 3 files changed, 26 insertions(+), 2 deletions(-) diff --git a/resources/_gen/assets/scss/css/style.scss_511aa33e99371f93fbf403479ebfd32e.content b/resources/_gen/assets/scss/css/style.scss_511aa33e99371f93fbf403479ebfd32e.content index 4dd5359..8a22b2f 100644 --- a/resources/_gen/assets/scss/css/style.scss_511aa33e99371f93fbf403479ebfd32e.content +++ b/resources/_gen/assets/scss/css/style.scss_511aa33e99371f93fbf403479ebfd32e.content @@ -1 +1 @@ -@import "https://fonts.googleapis.com/css2?family=Open+Sans&display=swap";@media only screen and (min-width:768px){.project-container{display:flex}.project-container .project-list{width:20%}.project-container .project{flex:1}}#output li{list-style:none}.post-list{display:flex;flex-flow:row wrap;justify-content:space-evenly}.post-list .box-post{display:initial;flex-basis:calc(33% - 2.5rem);margin:.4rem;padding:.5rem}.post-list .box-post .title{text-decoration:none;flex:1}.post-list .box-post .title h3{color:#0086b3;flex-basis:20%;font-size:1.25em}.post-list .box-post .date{font-size:.9em;color:#818181}.post-list .box-post .summary-container{max-height:310px;overflow:hidden}.post-list .box-post .summary-container figure{max-width:300px;height:150px;margin-left:auto;margin-right:auto}.post-list .box-post .summary-container figure img{width:100%;height:100%;object-fit:cover}.post-list .box-post .summary-container figure figcaption{display:none}.post-list .box-post .summary-container p{font-size:.85em;color:#616161}.post{max-width:768px;margin:auto}.post>*{margin:2rem 0}.post header>*{margin:2rem 0}.post header h2{font-size:2.5em}.post header .tags{display:flex;flex-direction:row;flex-wrap:wrap}.post header .tags .tag{margin:.25rem;padding:.5rem;border-radius:5px;font-weight:700;font-size:.9em;background-color:#0086b3;color:#fff}.post header .meta{display:flex;flex-direction:column;font-size:.9em}.post header .meta label{padding:.5rem 0}.post header a.tag,.post .body a.tag{background-color:#ddd;color:#333;display:inline-block;padding:.1em;font-size:.9em;text-decoration:none}.post header figure,.post .body figure{display:flex;flex-direction:column;justify-content:center;align-items:center}.post header figure img,.post .body figure img{width:auto;height:auto;max-width:768px;max-height:400px;margin:auto;padding:1rem}.post header figure figcaption,.post .body figure figcaption{font-size:.8em;color:#666}.post .highlight pre{padding:1rem;border-radius:5px;overflow:auto}@media(max-width:768px){.post-list{flex-direction:column}.post figure img{max-width:100%}}.home .home-head{text-align:center;margin:1rem 0;padding:1rem 0}.home .home-head h1{margin:1rem 0;font-size:3.5em}.home .home-head label{font-size:.8em;color:#414141}.home .animation-gopher{margin:auto;max-width:150px;width:80%}.home .content{padding:1rem 0;display:flex;flex-direction:row;justify-content:center;flex-wrap:wrap}.home .content .box-section{flex-basis:calc(30% - 4rem);margin:1rem;text-decoration:none;display:flex;flex-direction:column;text-align:center;padding:1rem;color:#7c1ad2}.home .content .box-section:hover{background-color:#8cc5e7}.home .content .box-section:hover b{color:#fff}.home .content .box-section b{color:#313131}@media(max-width:768px){.home .content .box-section{flex-basis:calc(100% - 4rem)}}p img{max-width:100%;height:auto;display:block;margin-left:auto;margin-right:auto}.image-project{max-width:100%;height:auto;display:block;margin:0 auto}footer{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:2rem}html,body,.container{width:100%;height:100%;margin:0;font-family:work sans,san-serif}.app-width{width:calc(100% - calc(10px * 2))!important;padding-left:10px!important;padding-right:10px!important}@media(min-width:1020px){.app-width{width:1000px!important;padding-left:calc(50% - calc(1000px/2))!important;padding-right:calc(50% - calc(1000px/2))!important}.app-width p>img{height:350px;display:block;margin:auto}}.box{border:1px solid #ddd;background-color:#fff;border-radius:.5rem}.box:hover{border:1px solid transparent;box-shadow:1px 1px 5px #999}a{text-decoration:none;color:#0013ff}a:hover{text-decoration:underline;cursor:pointer}.page-header{display:flex;flex-direction:row;justify-content:center;align-items:center;height:75px;border-bottom:1px solid #ddd}.page-header .header-left{text-align:left}.page-header .header-center{text-align:center;flex:1}.page-header .header-right{text-align:right}.page-header .button-search{text-decoration:none}.page-header:hover{border-bottom:1px solid #ccc;box-shadow:1px 1px 3px #ccc}nav a{text-decoration:none!important;font-weight:700;color:#313131;padding:.5rem;font-size:.9em}nav a:hover{color:#0086b3}.oss{display:flex;flex-wrap:wrap;justify-content:space-between}.oss article{border:1px solid #ddd;box-shadow:3px 3px 3px #ddd;margin:.5%;padding:.5%;width:30%;border-radius:4px;text-align:center}.colabs{display:flex;flex-wrap:wrap;justify-content:space-between;text-align:center}.colabs article{border:1px solid #ddd;margin:.5%;padding:.5%;width:20%;border-radius:10px;box-shadow:1px 1px 1px #c2c2c2;background-color:#fcfcfc}.colabs img{width:55px;height:55px;border-radius:5px;padding-bottom:8%}.colabs a{text-decoration:none;color:#333;font-size:16px}.colabs a:hover{text-decoration:underline;cursor:pointer}.pagination{display:flex;justify-content:space-between;list-style:none;margin:1em auto;padding:0}@media only screen and (min-width:768px){.pagination{width:30%}}.pagination>.page-item{border:1px solid #ddd;flex:1;text-align:center;width:5em}.pagination .page-link{display:block;color:#000;text-decoration:none}.pagination>.page-item.active{background-color:#333}.pagination>.page-item.active>.page-link{color:#fff}.pagination>.page-item.disabled>.page-link{color:#ddd} \ No newline at end of file +@import "https://fonts.googleapis.com/css2?family=Open+Sans&display=swap";@media only screen and (min-width:768px){.project-container{display:flex}.project-container .project-list{width:20%}.project-container .project{flex:1}}#output li{list-style:none}.post-list{display:flex;flex-flow:row wrap;justify-content:space-evenly}.post-list .box-post{display:initial;flex-basis:calc(33% - 2.5rem);margin:.4rem;padding:.5rem}.post-list .box-post .title{text-decoration:none;flex:1}.post-list .box-post .title h3{color:#0086b3;flex-basis:20%;font-size:1.25em}.post-list .box-post .date{font-size:.9em;color:#818181}.post-list .box-post .summary-container{max-height:310px;overflow:hidden}.post-list .box-post .summary-container figure{max-width:300px;height:150px;margin-left:auto;margin-right:auto}.post-list .box-post .summary-container figure img{width:100%;height:100%;object-fit:cover}.post-list .box-post .summary-container figure figcaption{display:none}.post-list .box-post .summary-container p{font-size:.85em;color:#616161}.post{max-width:768px;margin:auto}.post>*{margin:2rem 0}.post header>*{margin:2rem 0}.post header h2{font-size:2.5em}.post header .tags{display:flex;flex-direction:row;flex-wrap:wrap}.post header .tags .tag{margin:.25rem;padding:.5rem;border-radius:5px;font-weight:700;font-size:.9em;background-color:#0086b3;color:#fff}.post header .meta{display:flex;flex-direction:column;font-size:.9em}.post header .meta label{padding:.5rem 0}.post header a.tag,.post .body a.tag{background-color:#ddd;color:#333;display:inline-block;padding:.1em;font-size:.9em;text-decoration:none}.post header figure,.post .body figure{display:flex;flex-direction:column;justify-content:center;align-items:center}.post header figure img,.post .body figure img{width:auto;height:auto;max-width:768px;max-height:400px;margin:auto;padding:1rem}.post header figure figcaption,.post .body figure figcaption{font-size:.8em;color:#666}.post .highlight pre{padding:1rem;border-radius:5px;overflow:auto}@media(max-width:768px){.post-list{flex-direction:column}.post figure img{max-width:100%}}.home .home-head{text-align:center;margin:1rem 0;padding:1rem 0}.home .home-head h1{margin:1rem 0;font-size:3.5em}.home .home-head label{font-size:.8em;color:#414141}.home .animation-gopher{margin:auto;max-width:150px;width:80%}.home .content{padding:1rem 0;display:flex;flex-direction:row;justify-content:center;flex-wrap:wrap}.home .content .box-section{flex-basis:calc(30% - 4rem);margin:1rem;text-decoration:none;display:flex;flex-direction:column;text-align:center;padding:1rem;color:#7c1ad2}.home .content .box-section:hover{background-color:#8cc5e7}.home .content .box-section:hover b{color:#fff}.home .content .box-section b{color:#313131}@media(max-width:768px){.home .content .box-section{flex-basis:calc(100% - 4rem)}}p img{max-width:100%;height:auto;display:block;margin-left:auto;margin-right:auto}.image-project{max-width:100%;height:auto;display:block;margin:0 auto}footer{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:2rem}html,body,.container{width:100%;height:100%;margin:0;font-family:work sans,san-serif}.app-width{width:calc(100% - calc(10px * 2))!important;padding-left:10px!important;padding-right:10px!important}@media(min-width:1020px){.app-width{width:1000px!important;padding-left:calc(50% - calc(1000px/2))!important;padding-right:calc(50% - calc(1000px/2))!important}.app-width p>img{height:350px;display:block;margin:auto}}.box{border:1px solid #ddd;background-color:#fff;border-radius:.5rem}.box:hover{border:1px solid transparent;box-shadow:1px 1px 5px #999}a{text-decoration:none;color:#0013ff}a:hover{text-decoration:underline;cursor:pointer}.page-header{display:flex;flex-direction:row;justify-content:center;align-items:center;height:75px;border-bottom:1px solid #ddd}.page-header .header-left{text-align:left}.page-header .header-center{text-align:center;flex:1}.page-header .header-right{text-align:right}.page-header .button-search{text-decoration:none}.page-header:hover{border-bottom:1px solid #ccc;box-shadow:1px 1px 3px #ccc}nav a{text-decoration:none!important;font-weight:700;color:#313131;padding:.5rem;font-size:.9em}nav a:hover{color:#0086b3}.oss{display:flex;flex-wrap:wrap;justify-content:space-between}.oss article{border:1px solid #ddd;box-shadow:3px 3px 3px #ddd;margin:.5%;padding:.5%;width:30%;border-radius:4px;text-align:center}.colabs{display:flex;flex-wrap:wrap;justify-content:space-between;text-align:center}.colabs article{border:1px solid #ddd;margin:.5%;padding:.5%;width:20%;border-radius:10px;box-shadow:1px 1px 1px #c2c2c2;background-color:#fcfcfc}.colabs img{width:55px;height:55px;border-radius:5px;padding-bottom:8%}.colabs a{text-decoration:none;color:#333;font-size:16px}.colabs a:hover{text-decoration:underline;cursor:pointer}@media only screen and (max-width:768px){.colabs article{width:45%;margin:1.5%}.colabs img{width:90px;height:90px}}@media only screen and (max-width:480px){.colabs article{width:100%;margin:1.5%}.colabs img{width:90px;height:90px}}.pagination{display:flex;justify-content:space-between;list-style:none;margin:1em auto;padding:0}@media only screen and (min-width:768px){.pagination{width:30%}}.pagination>.page-item{border:1px solid #ddd;flex:1;text-align:center;width:5em}.pagination .page-link{display:block;color:#000;text-decoration:none}.pagination>.page-item.active{background-color:#333}.pagination>.page-item.active>.page-link{color:#fff}.pagination>.page-item.disabled>.page-link{color:#ddd} \ No newline at end of file diff --git a/resources/_gen/assets/scss/css/style.scss_511aa33e99371f93fbf403479ebfd32e.json b/resources/_gen/assets/scss/css/style.scss_511aa33e99371f93fbf403479ebfd32e.json index 6f9365d..7d07bff 100644 --- a/resources/_gen/assets/scss/css/style.scss_511aa33e99371f93fbf403479ebfd32e.json +++ b/resources/_gen/assets/scss/css/style.scss_511aa33e99371f93fbf403479ebfd32e.json @@ -1 +1 @@ -{"Target":"css/style.min.9a8976ad57b77105f4d3cdaf4e5a9ec2d04fdd60d0dfe40d5cfae835630dc329.css","MediaType":"text/css","Data":{"Integrity":"sha256-mol2rVe3cQX0082vTlqewtBP3WDQ3+QNXProNWMNwyk="}} \ No newline at end of file +{"Target":"css/style.min.5c43d42176932b665337e50d7340aece08d086e5c40b6f4eecff0e6abb091d0a.css","MediaType":"text/css","Data":{"Integrity":"sha256-XEPUIXaTK2ZTN+UNc0CuzgjQhuXEC29O7P8OarsJHQo="}} \ No newline at end of file diff --git a/themes/basic/assets/css/_colabs.scss b/themes/basic/assets/css/_colabs.scss index a6539ea..4f4049a 100644 --- a/themes/basic/assets/css/_colabs.scss +++ b/themes/basic/assets/css/_colabs.scss @@ -32,3 +32,27 @@ text-decoration: underline; cursor: pointer; } + +@media only screen and (max-width: 768px) { + .colabs article { + width: 45%; + margin: 1.5%; + } + + .colabs img { + width: 90px; + height: 90px; + } +} + +@media only screen and (max-width: 480px) { + .colabs article { + width: 100%; + margin: 1.5%; + } + +.colabs img { + width: 90px; + height: 90px; + } +}