Welcome to mirror list, hosted at ThFree Co, Russian Federation.

github.com/uPagge/uBlogger.git - Unnamed repository; edit this file 'description' to name the repository.
summaryrefslogtreecommitdiff
path: root/assets/css/_ublogger.scss
diff options
context:
space:
mode:
Diffstat (limited to 'assets/css/_ublogger.scss')
-rw-r--r--assets/css/_ublogger.scss378
1 files changed, 313 insertions, 65 deletions
diff --git a/assets/css/_ublogger.scss b/assets/css/_ublogger.scss
index 74b32f3..4fa1c27 100644
--- a/assets/css/_ublogger.scss
+++ b/assets/css/_ublogger.scss
@@ -1,49 +1,21 @@
// ==============================
// uBlogger style
// ==============================
-@import url('https://fonts.googleapis.com/css2?family=Lobster&display=swap');
-
body {
line-height: 1.9rem;
}
-.single {
-
- p {
- margin: 1.2rem 0;
- }
-
- blockquote {
- blockquote {
- padding: 0;
- width: 100%;
- line-height: 3.5rem;
-
- blockquote {
- width: 100%;
- padding: 0;
- line-height: 6rem;
-
- blockquote {
- width: 100%;
- padding: 0;
- line-height: 8rem;
- }
- }
- }
- }
-}
-
.summary-title {
margin: 0;
}
.summary-content {
color: #a9a9b3;
- display: inline;
+ display: block;
+ margin-top: 1rem;
p {
- margin: 1rem 0;
+ margin: 0;
}
}
@@ -51,15 +23,17 @@ header {
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
-.header-logo {
- color: $global-color-accent;
- font-family: 'Lobster', sans-serif;
- font-size: 1.8rem;
+.logo-svg {
+ fill: $global-color-accent;
+
+ [theme=dark] & {
+ fill: $global-font-color-dark;
+ }
}
article {
- .post {
+ .content-block {
a:visited {
color: #70a0b0;
@@ -100,6 +74,7 @@ article {
padding-top: 90px;
text-align: center;
line-height: 3rem;
+ margin-bottom: 0.5rem;
a.header-mark:before {
content: none;
@@ -126,8 +101,9 @@ article {
em {
background: #fff3bc;
- padding-bottom: 1px;
font-style: inherit;
+ padding: 4px 7px 6px;
+ box-decoration-break: clone;
[theme=dark] & {
background: #AE8029;
@@ -138,6 +114,8 @@ article {
border-top-left-radius: $article-border-radius;
border-top-right-radius: $article-border-radius;
}
+
+ @import "_buttom";
}
.article-mini {
@@ -234,9 +212,10 @@ a.post-tag-summary {
.home-meta {
display: inline-block;
+ width: 80%;
}
- .home-title{
+ .home-title {
font-size: 30px;
}
@@ -341,7 +320,7 @@ a.post-tag-summary {
h2 {
font-size: 2rem;
- margin-top: 5rem;
+ margin-top: 7rem;
code {
font-size: 90%;
@@ -384,33 +363,21 @@ a.post-tag-summary {
}
.footer-post-author {
- margin: 20px 0 0 0;
padding: 20px;
background-color: $global-background-secondary-color;
color: black;
- border-radius: 10px 10px 0 0;
display: inline-block;
width: 100%;
box-sizing: border-box;
border: solid 2px $global-secondary-color;
- border-bottom: none;
+ border-radius: 10px;
+ border-bottom: solid 2px #DDD;
[theme=dark] & {
- background-color: white;
+ background-color: $global-background-secondary-color;
}
}
-.footer-donate {
- border: solid 2px $global-secondary-color;
- display: inline-block;
- width: 100%;
- box-sizing: border-box;
- background-color: $global-background-secondary-color;
- color: black;
- border-radius: 0 0 10px 10px;
- padding: 10px;
-}
-
.author-avatar {
width: 105px;
padding: 0 25px 0 0;
@@ -432,6 +399,7 @@ a.post-tag-summary {
a {
color: black;
+
&:hover {
color: $global-link-hover-color;
}
@@ -460,10 +428,10 @@ a.post-tag-summary {
width: 100%;
min-width: 200px;
box-sizing: border-box;
- border-radius: 10px 10px 0 0;
+ border-radius: 20px 20px 0 0;
[theme=dark] & {
- background: #1B1B1C;
+ background: $global-background-secondary-color-dark;
}
.single-title {
@@ -481,7 +449,7 @@ a.post-tag-summary {
background-position: center 50%;
background-repeat: no-repeat;
background-size: cover;
- border-radius: 10px 10px;
+ border-radius: 10px 10px 0px 0px;
.post-title {
position: absolute;
@@ -509,6 +477,14 @@ a.post-tag-summary {
a {
color: #a9a9b3;
}
+
+ span {
+ margin-right: 13px;
+
+ i.svg-icon {
+ margin-right: 1px;
+ }
+ }
}
}
@@ -616,7 +592,13 @@ footer {
.theme-full, .theme-classic, .theme-wide {
.content-block-first {
margin-top: 0 !important;
- box-shadow: 0 1.2rem 1.2rem 0 rgba(0,0,0,0.1);
+ box-shadow: 0 1.2rem 1.2rem 0 rgba(0, 0, 0, 0.1);
+ border-radius: 0 0 $article-summary-border-radius $article-summary-border-radius;
+ }
+
+ .header-post {
+ margin-left: auto;
+ margin-right: auto;
}
}
@@ -637,6 +619,7 @@ footer {
}
}
+
.theme-classic, .theme-wide, .theme-full {
.header-post {
margin-top: 6rem;
@@ -650,6 +633,7 @@ footer {
}
}
+
.theme-classic.page-toc, .theme-wide.page-toc, .theme-full.page-toc {
.header-post {
@@ -741,31 +725,33 @@ footer {
}
-.post-tags {
+.post-share {
max-width: 900px;
width: 100%;
min-width: 200px;
- box-sizing: border-box;
text-align: center;
margin: 1rem auto;
+}
+
+.post-tags {
+ box-sizing: border-box;
.tag {
margin-top: 10px;
margin-right: 10px;
padding: 5px 10px 5px 10px;
- background: $global-color-accent;
border-radius: 4px;
- color: white;
+ color: #DDD;
display: inline-block;
+ border: 2px solid #DDD;
[theme=dark] & {
- background-color: $global-font-color-dark;
- color: black;
+ color: #DDD;
}
}
}
-.post-tags-toc {
+.post-share-toc {
margin: 1rem 0;
}
@@ -841,6 +827,15 @@ footer {
text-align: right;
padding-right: 0;
margin-left: 40px;
+ margin-bottom: 10px;
+}
+
+.block-media_left {
+ width: 50%;
+ float: left;
+ text-align: left;
+ padding-right: 0;
+ margin-right: 40px;
}
figure {
@@ -900,6 +895,14 @@ figure {
.author {
font-size: 0.8rem;
}
+
+ span {
+ margin-right: 13px;
+
+ i.svg-icon {
+ margin-right: 1px;
+ }
+ }
}
.page.home {
@@ -925,8 +928,253 @@ figure {
img {
width: 100%;
+ box-shadow: none;
+ }
+}
+
+
+.theme-hero {
+ .header-post {
+ max-width: none;
+ margin: 0 !important;
+ border-bottom: 1px solid #CDD2D4;
+ padding-bottom: 80px;
+ background-color: #fff;
+ position: relative;
+ display: block;
+ box-sizing: border-box;
+
+ [theme=dark] & {
+ background-color: $global-background-secondary-color-dark;
+ }
}
}
+.post-hero.mobile {
+ display: block;
+ padding-bottom: 32px;
+}
+
+.post-hero.mobile .post-hero-grid {
+ flex-direction: column;
+}
+
+.post-hero-grid {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ padding-right: 16px;
+ padding-left: 16px;
+}
+
+.post-hero-grid .post-hero-info {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ margin-right: 78px;
+}
+
+.post-hero-grid .post-hero-logo {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+}
+
+.hero-text-container .hero-text-description {
+ margin-top: 24px;
+ margin-bottom: 32px;
+
+ [theme=dark] & {
+ color: $global-font-secondary-color-dark;
+ }
+}
+
+.hero-text-container span {
+ font-weight: 600;
+ font-size: 10px;
+ letter-spacing: 1px;
+ line-height: 16px;
+ text-transform: uppercase;
+ margin-bottom: 0;
+}
+
+.hero-text-container h1 {
+ font-weight: 400;
+ color: #000000;
+ letter-spacing: 0.2px;
+ line-height: 32px;
+
+ [theme=dark] & {
+ color: $global-font-color-dark;
+ }
+}
+
+.hero-text-container p {
+ font-weight: 400;
+ font-size: 16px;
+ color: #333333;
+ letter-spacing: 0.1px;
+ text-align: left;
+ line-height: 24px;
+}
+
+.hero-author .hero-author-profile {
+ display: flex;
+ align-items: center;
+ height: 56px;
+ margin-bottom: 24px;
+}
+
+.hero-author .hero-author-profile .hero-author-profile-name {
+ font-size: 16px;
+ color: #242424;
+ letter-spacing: -0.2px;
+ text-align: left;
+ line-height: 24px;
+
+ [theme=dark] & {
+ color: $global-font-color-dark;
+ }
+}
+
+.hero-author .hero-author-profile .hero-author-profile-title {
+ font-size: 16px;
+ color: #606060;
+ font-weight: 300;
+ letter-spacing: 0.1px;
+ text-align: left;
+ line-height: 24px;
+
+ [theme=dark] & {
+ color: $global-font-color-dark;
+ }
+}
+
+.hero-author .hero-author-profile:last-of-type {
+ margin-bottom: 0;
+}
+
+.hero-author img.hero-author-avatar {
+ height: 100%;
+ border-radius: 50%;
+ margin-right: 16px;
+}
+
+.hero-author .profile-text-wrapper {
+ display: flex;
+ flex-direction: column;
+}
+
+.hero-author h4 {
+ font-weight: 500;
+ font-size: 13px;
+ color: #333333;
+ letter-spacing: 0.08px;
+ text-align: left;
+ line-height: 24px;
+ margin: 0;
+}
+
+.hero-author p {
+ opacity: 0.7;
+ font-weight: 400;
+ font-size: 13px;
+ color: #333333;
+ letter-spacing: 0.08px;
+ text-align: left;
+ line-height: 24px;
+ margin: 0;
+}
+
+.rendered {
+ margin-top: 32px;
+ margin-bottom: 0;
+ opacity: 0.7;
+ font-weight: 400;
+ font-size: 13px;
+ color: #333333;
+ letter-spacing: 0.08px;
+ text-align: left;
+ line-height: 24px;
+
+ [theme=dark] & {
+ color: $global-font-color-dark;
+ }
+}
+
+.hero-img {
+ margin: 0;
+ display: flex;
+ justify-content: center;
+
+ img {
+ align-self: center;
+ }
+}
+
+.hero-tags {
+ margin-top: 3rem;
+ text-align: center;
+
+ span {
+ margin-right: 3rem;
+ }
+
+ [theme=dark] & {
+ color: $global-font-color-dark;
+ }
+}
+
+.cat-cit {
+ margin-top: 4rem;
+ margin-bottom: 4rem;
+ border: 2.5px dashed $global-color-accent;
+ padding: 10px;
+
+ [theme=dark] & {
+ background: #dddddd;
+ }
+
+ .no-adb {
+ color: black;
+ }
+}
+
+.header-title-share {
+
+ text-align: center;
+
+ a {
+ font-size: 12px;
+ display: inline-block;
+ padding: 2px 7px;
+ border: solid 2px #555555;
+ border-radius: 15px;
+ color: #555555;
+ text-decoration: none;
+ margin-right: 4px;
+ line-height: 16px;
+
+ [theme=dark] & {
+ color: $global-font-color-dark;
+ }
+ }
+}
+
+.home[data-home=posts] {
+ .post-pinned {
+ .summary {
+ border: 3px solid $global-color-accent;
+ }
+ }
+}
+
+.render-image {
+ text-align: center;
+ display: inline-block;
+}
+
@import "_partial/share-icon";
@import "ublogger_media"; \ No newline at end of file
generated by cgit v1.2.3 (git 2.25.1) at 2024-06-03 19:33:59 +0300