diff --git a/themes/hugo-casper3/assets/scss/main.scss b/themes/hugo-casper3/assets/scss/main.scss index 1df02b2..01fe1ae 100644 --- a/themes/hugo-casper3/assets/scss/main.scss +++ b/themes/hugo-casper3/assets/scss/main.scss @@ -667,20 +667,6 @@ body{ .social-link-rss svg{ height:1.9rem } -.subscribe-button{ - display:block; - padding:4px 10px; - border:1px solid #fff; - color:#fff; - font-size:1.2rem; - line-height:1em; - border-radius:10px; - opacity:.8 -} -.subscribe-button:hover{ - text-decoration:none; - opacity:1 -} .rss-button{ opacity:.8 } @@ -1568,129 +1554,6 @@ body{ font-size:1.2rem } } -.subscribe-form{ - margin:1.5em 0; - padding:6.5vw 7vw 8vw; - border:1px solid #e3e9ed; - text-align:center; - background:linear-gradient(#fbfdfe,#f4f8fb); - border-radius:3px -} -.subscribe-form-title{ - margin:0 0 3px; - padding:0; - color:#15171a; - font-size:3.5rem; - line-height:1; - font-weight:600 -} -.subscribe-form-description{ - margin-bottom:.2em 0 1em; - color:#000000; - font-size:2.1rem; - line-height:1.55em -} -.subscribe-form form{ - display:flex; - flex-direction:column; - justify-content:center; - align-items:center; - margin:0 auto; - max-width:460px -} -.subscribe-form .form-group{ - align-self:stretch; - display:flex -} -.subscribe-email{ - display:block; - padding:10px; - width:100%; - border:1px solid #dae2e7; - color:#000000; - font-size:1.8rem; - line-height:1em; - font-weight:400; - -webkit-user-select:text; - -moz-user-select:text; - -ms-user-select:text; - user-select:text; - border-radius:5px; - transition:border-color .15s linear; - -webkit-appearance:none -} -.subscribe-form button{ - position:relative; - display:inline-block; - margin:0 0 0 10px; - padding:0 20px; - height:43px; - outline:none; - color:#fff; - font-size:1.5rem; - line-height:39px; - font-weight:400; - text-align:center; - background:linear-gradient(#4fb7f0,#29a0e0 60%,#29a0e0 90%,#36a6e2); - border-radius:5px; - -webkit-font-smoothing:subpixel-antialiased -} -.subscribe-form button:active,.subscribe-form button:focus{ - background:#209cdf -} -.subscribe-form .button-loader,.subscribe-form .message-error,.subscribe-form .message-success{ - display:none -} -.subscribe-form .loading .button-content{ - visibility:hidden -} -.subscribe-form .loading .button-loader{ - position:absolute; - top:0; - left:50%; - display:inline-block; - margin-left:-19px; - transform:scale(.7) -} -.subscribe-form .button-loader svg path,.subscribe-form .button-loader svg rect{ - fill:#fff -} -.subscribe-form .error .message-error,.subscribe-form .invalid .message-error,.subscribe-form .success .message-success{ - margin:1em auto 0; - max-width:400px; - color:#f05230; - font-size:1.6rem; - line-height:1.5em; - text-align:center -} -.subscribe-form .success .message-success{ - display:block; - color:#98c22e -} -.subscribe-form .error .message-error,.subscribe-form .invalid .message-error{ - display:block -} -@media (max-width:650px){ - .subscribe-form-title{ - font-size:2.4rem - } - .subscribe-form-description{ - font-size:1.6rem - } -} -@media (max-width:500px){ - .subscribe-form form{ - flex-direction:column - } - .subscribe-form .form-group{ - flex-direction:column; - width:100% - } - .subscribe-form button{ - margin:10px 0 0; - width:100% - } -} .post-full-comments{ margin:0 auto; max-width:840px @@ -2239,169 +2102,6 @@ body{ padding-bottom:14vw } } -.subscribe-success-message{ - position:fixed; - top:0; - right:0; - left:0; - z-index:9000; - padding:20px 0; - color:#fff; - text-align:center; - background:#a4d037; - transition:all .35s cubic-bezier(.19,1,.22,1) .5s; - transform:translateY(-175%) -} -.subscribe-success .subscribe-success-message{ - visibility:visible; - transform:translateY(0) -} -.subscribe-success-message.close{ - visibility:hidden; - transition:all 1.35s cubic-bezier(.19,1,.22,1); - transform:translateY(-175%) -} -.subscribe-close{ - position:absolute; - top:0; - right:0; - bottom:0; - left:0; - display:block -} -.subscribe-close:before{ - transform:rotate(45deg) -} -.subscribe-close:after,.subscribe-close:before{ - content:""; - position:absolute; - top:32px; - right:25px; - display:block; - width:20px; - height:1px; - background:#fff; - opacity:.8 -} -.subscribe-close:after{ - transform:rotate(-45deg) -} -.subscribe-close:hover{ - cursor:default -} -.subscribe-overlay{ - position:fixed; - top:0; - right:0; - bottom:0; - left:0; - z-index:9000; - display:flex; - justify-content:center; - align-items:center; - background:rgba(9,10,11,.97); - opacity:0; - transition:opacity .2s ease-in; - pointer-events:none; - -webkit-backdrop-filter:blur(3px); - backdrop-filter:blur(3px) -} -.subscribe-overlay .subscribe-close:after,.subscribe-overlay .subscribe-close:before{ - top:36px; - width:30px -} -.subscribe-overlay:target{ - opacity:1; - pointer-events:auto -} -.subscribe-overlay-content{ - position:relative; - z-index:9999; - margin:0 0 5vw; - padding:4vw; - color:#fff; - text-align:center -} -.subscribe-overlay .subscribe-form{ - border:none; - color:#fff; - background:none -} -.subscribe-overlay-logo{ - position:fixed; - top:23px; - left:30px; - height:30px -} -.subscribe-overlay-title{ - display:inline-block; - margin:0 0 10px; - font-size:5.2rem; - line-height:1.15em -} -.subscribe-overlay-description{ - margin:0 auto 50px; - max-width:650px; - color:#fff; - font-family:"Roboto",serif; - font-size:2.4rem; - line-height:1.3em; - font-weight:300; - opacity:.8 -} -.subscribe-overlay form{ - display:flex; - justify-content:center; - align-items:center; - margin:0 auto; - max-width:540px -} -.subscribe-overlay .form-group{ - flex-grow:1 -} -.subscribe-overlay .subscribe-email{ - display:block; - padding:14px 20px; - width:100%; - border:none; - color:#000000; - font-size:2rem; - line-height:1em; - font-weight:400; - letter-spacing:.5px; - -webkit-user-select:text; - -moz-user-select:text; - -ms-user-select:text; - user-select:text; - border-radius:8px; - transition:border-color .15s linear; - -webkit-appearance:none -} -.subscribe-email:focus{ - outline:0; - border-color:#becdd5 -} -.subscribe-overlay button{ - display:inline-block; - margin:0 0 0 15px; - padding:0 25px; - height:52px; - outline:none; - color:#fff; - font-size:1.7rem; - line-height:38px; - font-weight:400; - text-align:center; - background:linear-gradient(#4fb7f0,#29a0e0 60%,#29a0e0 90%,#36a6e2); - border-radius:8px; - -webkit-font-smoothing:subpixel-antialiased -} -.subscribe-overlay button:active,.subscribe-overlay button:focus{ - background:#209cdf -} -.subscribe-overlay .loading .button-loader{ - top:5px -} .site-footer{ position:relative; padding-top:20px; @@ -2565,32 +2265,5 @@ body{ .site-header-content .author-profile-image{ box-shadow:0 0 0 6px hsla(0,0%,100%,.04) } - .subscribe-form{ - border:none; - background:linear-gradient(#0b0c0e,#121417) - } - .subscribe-form-title{ - color:hsla(0,0%,100%,.9) - } - .subscribe-form p{ - color:hsla(0,0%,100%,.7) - } - .subscribe-email{ - border-color:#272a30; - color:hsla(0,0%,100%,.9); - background:#202228 - } - .subscribe-email:focus{ - border-color:#525866 - } - .subscribe-form button{ - opacity:.9 - } - .subscribe-form .error .message-error,.subscribe-form .invalid .message-error{ - color:#ec694b - } - .subscribe-form .success .message-success{ - color:#acd053 - } } @import "custom.scss";