hugo-theme-next/assets/css/_schemes/Gemini/index.scss

131 lines
3.3 KiB
SCSS
Raw Normal View History

@import '../Pisces/_layout';
@import '../Pisces/_header';
@import '../Pisces/_menu';
@import '../Pisces/_sub-menu';
@import '../Pisces/_sidebar';
// ==================================================
// Rewrite _layout.styl
// ==================================================
// Sidebar padding used as main desktop content padding for sidebar padding and post blocks padding too.
// In `source/css/_variables/Pisces.styl` there are variable for main offset:
// $sidebar-offset : 12px;
// This value alse can be changed in main NexT config as `sidebar: offset: 12` option.
// In `source/css/_variables/base.styl` there are variables for other resolutions:
// $content-tablet-padding : 10px;
// $content-mobile-padding : 8px;
// P.S. If u want to change this paddings u may set this variables into `custom_file_path.variable` (in theme _config.yml).
// So, it will 12px in Desktop, 10px in Tablets and 8px in Mobiles for all possible paddings.
// ==================================================
// Desktop layout styles.
// ==================================================
// Post blocks.
.main-inner > {
.sub-menu, .post-block, .flinks-block, .tabs-comment, .comments, .post-comments, .pagination {
background: var(--content-bg-color);
border-radius: $border-radius-inner;
box-shadow: $box-shadow-inner;
&:not(:first-child):not(.sub-menu) {
border-radius: $border-radius;
box-shadow: $box-shadow;
margin-top: $sidebar-offset;
@include tablet() {
margin-top: $content-tablet-padding;
}
@include mobile() {
margin-top: $content-mobile-padding;
}
}
}
}
// Post & Comments blocks.
.post-block, .flinks-block, .comments, .post-comments {
padding: $content-desktop-padding;
}
// Post delimiters.
.post-eof {
display: none;
}
// Pagination.
.pagination {
border-top: initial;
padding: 10px 0;
}
// ==================================================
// Headers.
// ==================================================
.post-body {
h1, h2 {
border-bottom: 1px solid $body-bg-color;
}
h3 {
border-bottom: 1px dotted $body-bg-color;
}
}
// ==================================================
// > 768px & < 991px
// ==================================================
@include tablet() {
// Posts in blocks.
.main-inner {
padding: $content-tablet-padding;
}
.posts-expand {
// Components inside Posts.
.post-button {
margin-top: ($content-tablet-padding * 2);
}
}
.post-block, .flinks-block {
// Inside posts blocks content padding (default 40px).
padding: ($content-tablet-padding * 2);
}
.comments, .post-comments {
padding: $content-tablet-padding ($content-tablet-padding * 2);
// padding: initial;
// padding-top: $content-tablet-padding;
}
}
// ==================================================
// < 767px
// ==================================================
@include mobile() {
// Posts in blocks.
.main-inner {
padding: $content-mobile-padding;
}
.posts-expand {
// Components inside Posts.
.post-button {
margin: $sidebar-offset 0;
}
}
.post-block, .flinks-block {
// Inside posts blocks content padding (default 40px).
padding: $sidebar-offset;
}
.comments, .post-comments {
padding: 10px $sidebar-offset;
}
}