assets/themes/j1/core/css/themes/unolight/bootstrap.css in j1-template-2023.1.0 vs assets/themes/j1/core/css/themes/unolight/bootstrap.css in j1-template-2023.2.0

- old
+ new

@@ -14886,10 +14886,93 @@ padding: 1.5rem; border-radius: 3px; margin-bottom: 0.25rem; z-index: 9; } +.article-item { + max-width: 26rem; + margin-left: auto; + margin-right: auto; } + .article-item .article-link { + position: relative; + display: block; + margin: 0 auto; } + .article-item .article-link .article-hover { + display: flex; + position: absolute; + width: 100%; + height: 100%; + background: rgba(0, 0, 0, 0.5); + align-items: center; + justify-content: center; + opacity: 0; + transition: opacity ease-in-out 0.25s; } + .article-item .article-link .article-hover .article-hover-content { + font-size: 1.25rem; + color: white; } + .article-item .article-link:hover .article-hover { + opacity: 1; } + .article-item .article-caption { + padding: 1.5rem; + text-align: center; + background-color: #e0e0e0; } + .article-item .article-caption .article-caption-heading { + font-size: 1.5rem; + font-weight: 400; + margin-bottom: 0; } + .article-item .article-caption .article-caption-subheading { + font-style: italic; + font-family: "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; } + +.article-item--w100 { + max-width: 100px !important; } + +.article-item--w200 { + max-width: 200px !important; } + +.article-item--w300 { + max-width: 300px !important; } + +.article-item--w400 { + max-width: 400px !important; } + +.article-item--w500 { + max-width: 500px !important; } + +.article-modal .modal-dialog { + margin: 1rem; + max-width: 100vw; } + +.article-modal .modal-content { + padding-top: 6rem; + padding-bottom: 6rem; + text-align: center; } + .article-modal .modal-content h2, .article-modal .modal-content .h2 { + font-size: 3rem; + line-height: 3rem; } + .article-modal .modal-content p.item-intro { + font-style: italic; + margin-bottom: 2rem; + font-family: "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; } + .article-modal .modal-content p { + margin-bottom: 2rem; } + .article-modal .modal-content ul.list-inline { + margin-bottom: 2rem; } + .article-modal .modal-content img { + margin-bottom: 2rem; } + +.article-modal .close-modal { + position: absolute; + top: 1.5rem; + right: 1.5rem; + width: 3rem; + height: 3rem; + cursor: pointer; + background-color: transparent; } + .article-modal .close-modal:hover { + opacity: 0.3; } + /* # ----------------------------------------------------------------------------- # ~/scss/theme_uno/extensions/_attic.scss # # Product/Info: @@ -15097,10 +15180,108 @@ border-radius: 1px; margin-bottom: 0.25rem; } /* # ----------------------------------------------------------------------------- + # ~/scss/theme_uno/extensions/_caption.scss + # + # Product/Info: + # https://jekyll.one + # + # Copyright (C) 2023 Juergen Adams + # + # J1 Theme is licensed under the MIT License. + # See: https://github.com/jekyll-one-org/j1-template/blob/main/LICENSE.md + # ----------------------------------------------------------------------------- +*/ +/* General +-------------------------------------------------------------------------------- */ +.caption { + display: none; + /* hidden for default */ + position: absolute; + /* positions set by translate */ + padding: 10px; + /* space around a caption */ + text-align: center; + /* caption text align */ + color: #E0E0E0; + /* caption text color */ + background: rgba(0, 0, 0, 0.6); + /* caption background color */ + width: 100%; + font-weight: 500; + font-size: 16px; + z-index: 999; } + +/* Caption Positions +-------------------------------------------------------------------------------- */ +/* Top +TODO: Fix top position if NO gutters are used: +top: 5px; +width: 97%; +-------------------------------------------------------------------------------- */ +.top .caption { + top: 0%; + transform: translate(-100%, -50%); + /* move hidden caption */ + -moz-transform: translate(-100%, -50%); + -webkit-transform: translate(-100%, -50%); } + +.top:hover .caption { + display: block; + /* show caption */ + transform: translate(0, 0); + /* move visible caption */ + -moz-transform: translate(0, 0); + -webkit-transform: translate(0, 0); + transition: all 0.25s; + -moz-transition: all 0.25s; + -webkit-transition: all 0.25s; + transition-delay: 0.25s; + -moz-transition-delay: 0.25s; + -webkit-transition-delay: 0.25s; } + +/* Bottom +-------------------------------------------------------------------------------- */ +.bottom .caption { + top: 100%; + transform: translate(0, 0); + -moz-transform: translate(0, 0); + -webkit-transform: translate(0, 0); } + +.bottom:hover .caption { + display: block; + transform: translate(0, -100%); + -moz-transform: translate(0, -100%); + -webkit-transform: translate(0, -100%); + transition: all 0.25s; + -moz-transition: all 0.25s; + -webkit-transition: all 0.25s; } + +/* Centered +-------------------------------------------------------------------------------- */ +.center .caption { + top: 50%; + transform: translate(-100%, -50%); + -moz-transform: translate(-100%, -50%); + -webkit-transform: translate(-100%, -50%); } + +.center:hover .caption { + display: block; + transform: translate(0, -50%); + -moz-transform: translate(0, -50%); + -webkit-transform: translate(0, -50%); + transition: all 0.25s; + -moz-transition: all 0.25s; + -webkit-transition: all 0.25s; + transition-delay: 0.25s; + -moz-transition-delay: 0.25s; + -webkit-transition-delay: 0.25s; } + +/* + # ----------------------------------------------------------------------------- # ~/scss/theme_uno/extensions/_cards.scss # # Product/Info: # https://jekyll.one # @@ -17835,10 +18016,50 @@ .img-bg--fill { background-size: cover; background-repeat: no-repeat; background-position: center; } +.img-object--w100 { + width: 100%; + max-width: 100px; } + +.img-object--w200 { + width: 100%; + max-width: 200px; } + +.img-object--w300 { + width: 100%; + max-width: 300px; } + +.img-object--w400 { + width: 100%; + max-width: 400px; } + +.img-object--w500 { + width: 100%; + max-width: 500px; } + +.img-object--h100 { + height: 100%; + max-height: 100px; } + +.img-object--h200 { + width: 100%; + max-width: 200px; } + +.img-object--h300 { + width: 100%; + max-width: 300px; } + +.img-object--h400 { + width: 100%; + max-width: 400px; } + +.img-object--h500 { + width: 100%; + max-width: 500px; } + .img-object--contain { object-fit: contain; } .img-object--cover { object-fit: cover; } @@ -18147,9 +18368,35 @@ order: 2; } .aside-2 { order: 3; } .footer-mobile { order: 4; } } + +/* + # ----------------------------------------------------------------------------- + # ~/scss/theme_uno/extensions/_people.scss + # + # Product/Info: + # https://jekyll.one + # + # Copyright (C) 2023 Juergen Adams + # + # J1 Theme is licensed under the MIT License. + # See: https://github.com/jekyll-one-org/j1-template/blob/main/LICENSE.md + # ----------------------------------------------------------------------------- + # NOTE: Additional styles for page articles (pages) + # ----------------------------------------------------------------------------- +*/ +.people-member { + margin-bottom: 3rem; + text-align: center; } + .people-member img { + width: 14rem; + height: 14rem; + border: 0.5rem solid rgba(0, 0, 0, 0.1); } + .people-member h4, .people-member .h4 { + margin-top: 1.5rem; + margin-bottom: 0; } /* // ----------------------------------------------------------------------------- // ~/scss/theme_uno/extensions/_plans.scss // Provides general styles for the J1 Plan Banner