igor
/
portfoligor
1
1
Fork 0
Code Issues 9 Pull Requests Packages Projects 1 Releases 4 Wiki Activity
portfoligor/assets/scss/_main_body.scss

45 lines
579 B
SCSS
Raw Normal View History

shortcodes: adds an audio player with album cover * Adds a shortcodes with an image. * Updates the audio, stream and published shortcodes to group the figcaption under the audio player. * Adds a SCSS partial for grid construction that only contains for now a breakpoint mixin'. * Displays the cover above the player by default, and on the left side for bigger screens. * Fixes the SCSS files according to SCSS linting. Co-Authored-by: iGor milhit <igor@milhit.ch>
2020-12-26 19:59:54 +01:00
///////////////////
// //
// MAIN //
// //
///////////////////
section: improve sections, lists and navigation * Splits styles into partials. * Adds a category entry to the navigation menu. * Adds a flex to the header to get the menu on the right. * Adds a flex to the sections and lists to diplay information evenly. Co-Authored-by: Igor Milhit <igor@milhit@.ch>
2020-01-15 17:42:04 +01:00
theme: simplify the main layout * Simplifies the header and menu layout for all screen width. * Uses only one background color (Darkest Polar). * Change the main text color to Snow Light Grey. * Change the header and footer text color to Snow Lightest Grey. * Add a color for active and focused links (Frost Lighter Green). * Simplifies the figure layout and colors. * Adds a font-family variable and set it to the body. It uses the system default font. * Tries to set all font properties in the _fonts.scss file. * Removes the links decoration on the header and footer. * Harmonizes the footer accordingly to the header. * Uses the hugo regular method to generate the footer menu. * Stops centering the content on large screens. * Adds the content max width and content left margin to the variables. * Sets the font weight to bold for hovered links. * Suppress the main HTML tag of the index template, and set the correct classes on the main HTML tag of the baseof template. * Uses a second level header for the title of the page, as the first level is used for the website title. * Improves the layout of definition lists on the home page, with a better (and simpler) rendering on small screens. * Prevents to use the post information partial on static page. This is done through a test on the layout property `static` of the front header. * Reorders the sections of the home page and adds anchors to the section headers. * Closes #8, #11. Co-Authored-by: iGor milhit <igor@milhit.ch>
2021-10-29 22:34:24 +02:00
.home-lists {
section: improve sections, lists and navigation * Splits styles into partials. * Adds a category entry to the navigation menu. * Adds a flex to the header to get the menu on the right. * Adds a flex to the sections and lists to diplay information evenly. Co-Authored-by: Igor Milhit <igor@milhit@.ch>
2020-01-15 17:42:04 +01:00
theme: simplify the main layout * Simplifies the header and menu layout for all screen width. * Uses only one background color (Darkest Polar). * Change the main text color to Snow Light Grey. * Change the header and footer text color to Snow Lightest Grey. * Add a color for active and focused links (Frost Lighter Green). * Simplifies the figure layout and colors. * Adds a font-family variable and set it to the body. It uses the system default font. * Tries to set all font properties in the _fonts.scss file. * Removes the links decoration on the header and footer. * Harmonizes the footer accordingly to the header. * Uses the hugo regular method to generate the footer menu. * Stops centering the content on large screens. * Adds the content max width and content left margin to the variables. * Sets the font weight to bold for hovered links. * Suppress the main HTML tag of the index template, and set the correct classes on the main HTML tag of the baseof template. * Uses a second level header for the title of the page, as the first level is used for the website title. * Improves the layout of definition lists on the home page, with a better (and simpler) rendering on small screens. * Prevents to use the post information partial on static page. This is done through a test on the layout property `static` of the front header. * Reorders the sections of the home page and adds anchors to the section headers. * Closes #8, #11. Co-Authored-by: iGor milhit <igor@milhit.ch>
2021-10-29 22:34:24 +02:00
@include breakpoint(laptop) {
display: inline-flex;
flex-flow: row;
flex-wrap: wrap;
overflow: visible;
width: 100%; // set the container width
section: improve sections, lists and navigation * Splits styles into partials. * Adds a category entry to the navigation menu. * Adds a flex to the header to get the menu on the right. * Adds a flex to the sections and lists to diplay information evenly. Co-Authored-by: Igor Milhit <igor@milhit@.ch>
2020-01-15 17:42:04 +01:00
theme: simplify the main layout * Simplifies the header and menu layout for all screen width. * Uses only one background color (Darkest Polar). * Change the main text color to Snow Light Grey. * Change the header and footer text color to Snow Lightest Grey. * Add a color for active and focused links (Frost Lighter Green). * Simplifies the figure layout and colors. * Adds a font-family variable and set it to the body. It uses the system default font. * Tries to set all font properties in the _fonts.scss file. * Removes the links decoration on the header and footer. * Harmonizes the footer accordingly to the header. * Uses the hugo regular method to generate the footer menu. * Stops centering the content on large screens. * Adds the content max width and content left margin to the variables. * Sets the font weight to bold for hovered links. * Suppress the main HTML tag of the index template, and set the correct classes on the main HTML tag of the baseof template. * Uses a second level header for the title of the page, as the first level is used for the website title. * Improves the layout of definition lists on the home page, with a better (and simpler) rendering on small screens. * Prevents to use the post information partial on static page. This is done through a test on the layout property `static` of the front header. * Reorders the sections of the home page and adds anchors to the section headers. * Closes #8, #11. Co-Authored-by: iGor milhit <igor@milhit.ch>
2021-10-29 22:34:24 +02:00
dt {
flex: 0 0 39%;
word-wrap: anywhere;
}
dd {
flex: 0 0 59%;
margin-left: auto;
text-align: left;
}
}
dd {
margin-left: .5rem;
}
dt::after {
content: ' :';
}
section: improve sections, lists and navigation * Splits styles into partials. * Adds a category entry to the navigation menu. * Adds a flex to the header to get the menu on the right. * Adds a flex to the sections and lists to diplay information evenly. Co-Authored-by: Igor Milhit <igor@milhit@.ch>
2020-01-15 17:42:04 +01:00
}
.contents {
padding: 0;
}
theme: simplify the main layout * Simplifies the header and menu layout for all screen width. * Uses only one background color (Darkest Polar). * Change the main text color to Snow Light Grey. * Change the header and footer text color to Snow Lightest Grey. * Add a color for active and focused links (Frost Lighter Green). * Simplifies the figure layout and colors. * Adds a font-family variable and set it to the body. It uses the system default font. * Tries to set all font properties in the _fonts.scss file. * Removes the links decoration on the header and footer. * Harmonizes the footer accordingly to the header. * Uses the hugo regular method to generate the footer menu. * Stops centering the content on large screens. * Adds the content max width and content left margin to the variables. * Sets the font weight to bold for hovered links. * Suppress the main HTML tag of the index template, and set the correct classes on the main HTML tag of the baseof template. * Uses a second level header for the title of the page, as the first level is used for the website title. * Improves the layout of definition lists on the home page, with a better (and simpler) rendering on small screens. * Prevents to use the post information partial on static page. This is done through a test on the layout property `static` of the front header. * Reorders the sections of the home page and adds anchors to the section headers. * Closes #8, #11. Co-Authored-by: iGor milhit <igor@milhit.ch>
2021-10-29 22:34:24 +02:00
.home-lists {
margin: 0;
template: compare lastmod and publishdate Most of blog posts have the lastmod displayed even if the publishdate is the same day, because lastmod comes from git information and has also hour, minutes and second, and publishdate is set manually, with only year, month and day. * Formats the date to compare them accurately, with datFormat function. * Styles a little bit the blockquote tag. * Spaces evenly the post information blocks. * Closes #5 Co-Authored-by: Igor Milhit <igor@milhit.ch>
2020-05-22 12:25:50 +02:00
}