From f597e2fe949a1e18eb778b9a5bd102de88570555 Mon Sep 17 00:00:00 2001 From: Max Date: Thu, 18 May 2017 14:03:27 +0200 Subject: Initial commit. --- sass/theme.scss | 41 +++++++++++++++++ sass/theme/_theme.scss | 1 + sass/theme/_theme_variables.scss | 13 ++++++ sass/understrap/understrap.scss | 96 ++++++++++++++++++++++++++++++++++++++++ 4 files changed, 151 insertions(+) create mode 100644 sass/theme.scss create mode 100644 sass/theme/_theme.scss create mode 100644 sass/theme/_theme_variables.scss create mode 100644 sass/understrap/understrap.scss (limited to 'sass') diff --git a/sass/theme.scss b/sass/theme.scss new file mode 100644 index 0000000..93635a0 --- /dev/null +++ b/sass/theme.scss @@ -0,0 +1,41 @@ +/***************************************************************** +Import all needed 3rd party sass files plus your own style and variables + +0. ../bower_components/_s/sass/style // Adding underscores default styles. Don´t needed if you use Bootstrap for styling +-------------------------------------- +1. theme/theme_variables.scss // Overwriting Bootstrap variables and for own variables <-- ADD YOUR VARIABLES HERE +-------------------------------------- +2.../bower_components/bootstrap-sass/assets/stylesheets/bootstrap // adding bootstrap from bower components folder. Make sure you run bower install before! <- Dont edit this files! +-------------------------------------- +3. understrap/understrap.scss // Some basic understrap styles. Helps to combine Bootsrap and _s theme and provides some basic styleing for additonal functions <- Dont edit this files! +-------------------------------------- +4. ../bower_components/fontawesome/scss/font-awesome <- Dont edit this files! If you don´t need/want Font Awesome support comment out this line +-------------------------------------- + + + + * + * + * + ******* + ***** + *** + * + + + +// Any additional imported files // +6. theme/theme.scss"; // <-- ADD YOUR STYLES HERE +***************************************************************** */ + +// @import "../bower_components/_s/sass/style"; +@import "theme/theme_variables"; // <--------- Add your variables into this file. Also add variables to overwrite Bootstrap or UnderStrap variables here +@import "../src/sass/bootstrap3/bootstrap";// <--------- Change from /bootstrap3 to /bootstrap4 Watch out! just for testing in the moment! +@import "understrap/understrap"; +@import "../src/sass/fontawesome/font-awesome"; +@import "../src/sass/owl-carousel2/owl.carousel"; +@import "../src/sass/owl-carousel2/theme.default"; + + +// Any additional imported files // +@import "theme/theme"; // <--------- Add your styles into this file \ No newline at end of file diff --git a/sass/theme/_theme.scss b/sass/theme/_theme.scss new file mode 100644 index 0000000..ff388be --- /dev/null +++ b/sass/theme/_theme.scss @@ -0,0 +1 @@ +// This is an empty scss file for your custom styles - Please add your super duper awesome mega design styles here diff --git a/sass/theme/_theme_variables.scss b/sass/theme/_theme_variables.scss new file mode 100644 index 0000000..a2cafaf --- /dev/null +++ b/sass/theme/_theme_variables.scss @@ -0,0 +1,13 @@ +// Use this file to overwrite the basic Bootstrap variables and add your own variables +// To overwrite a Bootstrap variable you don´t have to touch the Bootstrap folder. +// Just copy a variable from /sass/bootstrap/_variables.scss, paste it here and edit the value. +// As example you find one of the most important Bootstrap variable below: $brand-primary. +// Thats the ugly Bootstrap blue used for all the links, primary buttons etc. +// Just add your color code here, compile the theme.scss file to change this color everywhere + +$brand-primary: #0CB4CE; //#ff6d5a + +// Basics of a navbar +$navbar-height: 60px; +$navbar-margin-bottom: 0px; +$navbar-border-radius: 0px; diff --git a/sass/understrap/understrap.scss b/sass/understrap/understrap.scss new file mode 100644 index 0000000..4458165 --- /dev/null +++ b/sass/understrap/understrap.scss @@ -0,0 +1,96 @@ +// Some basic padding for all wrappers +.wrapper { + padding:$grid-gutter-width 0; +} + +// Reset hero wrapper padding to 0 +#wrapper-hero { + padding:0px!important; +} + +// Adding basic Wordpress classes to pass the Wordpress.org tests +.sticky, .gallery-caption, .bypostauthor { +font-size:inherit; +} + +// Separate sticky wrapper from main content +.wrapper#wrapper-sticky { + border-bottom:1px solid $gray-light; +} + +// Adding some contrast background color to footer full widget +#wrapper-footer-full, #wrapper-static-hero{ + background-color: $gray-lighter; +} + +// Necessary WP classes +.wp-caption { + font-size: inherit; +} + +.wp-caption-text { + font-size: inherit; +} + +.screen-reader-text { + font-size: inherit; + word-wrap: normal !important; +} + +.alignright { + float: right; +} + +.alignleft { + float: left; +} + +.aligncenter { + margin:0px auto; +} + +//Post design +.entry-footer span { + padding-right:10px; +} + +//Limit featured image size to 100% +img.wp-post-image, article img, figure, #secondary img { + max-width: 100%; +} + +// Skip to content link +a.skip-link{ +z-index: 1000; +position: fixed; +top: 0px; +right: 0px; +} + +// Reset Jumbotron default margin +.jumbotron { + margin-bottom:0px; +} + +//Bootstrap3 to Bootstrap4 "translation" +//.menu-item {float:left; width:auto; display:inline;} + +// Fixing BS dropdown in a dropdown +.dropdown-menu .dropdown-menu { + position:relative; + display:block; + border: none; + box-shadow: none; + margin-left:30px; + width:120px; + li { + list-style: square; + padding-left: 0px; + + a { + padding-left:10px; + padding-right:10px; + } + } +} + -- cgit v1.2.3