From de1716855e4b3c1dde71476135cfc4bd62c22169 Mon Sep 17 00:00:00 2001 From: raphaelgoettter Date: Thu, 5 Mar 2015 10:14:20 +0100 Subject: [PATCH] =?UTF-8?q?ajout=20d'un=20fichier=20de=20reset=20d=C3=A9di?= =?UTF-8?q?=C3=A9=20=C3=A0=20WordPress?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- less/_11-wordpress.less | 298 ++++++++++++++++++++++++++++++++++++++++ less/knacss.less | 3 + sass/_11-wordpress.scss | 298 ++++++++++++++++++++++++++++++++++++++++ sass/knacss.scss | 3 + 4 files changed, 602 insertions(+) create mode 100644 less/_11-wordpress.less create mode 100644 sass/_11-wordpress.scss diff --git a/less/_11-wordpress.less b/less/_11-wordpress.less new file mode 100644 index 0000000..0fc3ec7 --- /dev/null +++ b/less/_11-wordpress.less @@ -0,0 +1,298 @@ +/* +Author: Geoffrey Crofte, Alsacréations +Contributors: Automattic, Geoffrey Crofte +Description: Reset styles for WordPress usage of KNACSS +*/ + +/* ----------------------------- */ +/* ==Menus */ +/* ----------------------------- */ + +// current menu elements +.current_page_item > a { +} +.current-menu-item > a { +} +.current_page_ancestor > a { +} + +// blocks of content navigation +.comment-navigation, +.paging-navigation, +.post-navigation { + margin: 0 0 1.5em; + overflow: hidden; +} + +.comment-navigation .nav-previous, +.paging-navigation .nav-previous, +.post-navigation .nav-previous { + float: left; + width: 50%; +} + +.comment-navigation .nav-next, +.paging-navigation .nav-next, +.post-navigation .nav-next { + float: right; + text-align: right; + width: 50%; +} + +/* ----------------------------- */ +/* ==Alignments */ +/* ----------------------------- */ + +// class in img elements +.alignnone { + margin: .25em 1.5em 1.5em 0; +} + +.aligncenter { + clear: both; + display: block; + margin: 1.5em auto; +} + +.alignleft { + float: left; + margin: 0 1.5em .25em 0; +} + +.alignright { + float: right; + margin: 0 0 .25em 1.5em; +} + +/* ----------------------------- */ +/* ==Clearings */ +/* ----------------------------- */ + +.entry-content, +.comment-content { + clear: both; + + &:after, &:before { + content: ""; + display: table; + } +} + +/* ----------------------------- */ +/* ==Widgets */ +/* ----------------------------- */ + +.widget + .widget { + margin: 1.5em 0 0; +} + +// usage example: +.widget select { + max-width: 100%; +} + +/* ----------------------------- */ +/* ==Posts and pages */ +/* ----------------------------- */ + +/* === 5.1 Posts - post_class === */ + +// featured content +.sticky { +} + +// attachment post +.attachment { +} + +// format of post +.format- { + &aside { + } + &gallery { + } + &link { + } + &image { + } + "e { + } + &status { + } + &video { + } + &chat { + } +} + +// class for a tag +.tag- { + &name-of-tag { + } +} + +// class for categorie +.category- { + &name-of-category { + } +} + +/* === 5.2 Pages - body_class === */ + +// front page +.home { + // if display posts + &.blog { + } + // if static page + &.page { + } +} + +// page displays posts +.blog { + // if is frontpage + &.home { + } + // if static page + &.page { + } +} + +// simple page +.page { +} + +// page of single post +.single { +} + +// page of archives +.archive { +} + +// page of search +.search { + // if has results + .search-results { + } + // if has no results + .search-no-results { + } +} + +// page 404 +.error404 { +} + +// user logged in +.logged-in { +} + +// text direction if right-to-left +// prefer rtl.css: http://codex.wordpress.org/Right-to-Left_Language_Support +.rtl { +} + +/* === 5.3 Posts and Pages - Contents === */ + +.hentry { + margin: 0 0 1.5em; +} + +.page-content, +.entry-content, +.entry-summary { + margin: 1.5em 0 0; +} + +.page-links { + clear: both; + margin: 0 0 1.5em; +} + +/* ----------------------------- */ +/* ==Comments */ +/* ----------------------------- */ + +.comment-content a { + word-wrap: break-word; +} + +.bypostauthor { + // some make-the-logo-bigger styles +} + +/* ----------------------------- */ +/* ==Media */ +/* ----------------------------- */ + +img.wp-smiley { + margin-bottom: 0; + margin-top: 0; + padding: 0; + border: none; +} + +/* ----------------------------- */ +/* ==Captions */ +/* ----------------------------- */ + +.wp-caption { + max-width: 100%; + margin-bottom: 1.5em; +} + +.wp-caption img { + display: block; + margin: 0 auto; +} + +.wp-caption-text { + margin: 1em 0; + text-align: center; +} + +/* ----------------------------- */ +/* ==Galleries */ +/* ----------------------------- */ + +.gallery { + margin-bottom: 1.5em; +} + +.gallery-item { + display: inline-block; + width: 100%; + text-align: center; + vertical-align: top; + + .gallery-columns-2 & { + max-width: 50%; + } + .gallery-columns-3 & { + max-width: 33.33%; + } + .gallery-columns-4 & { + max-width: 25%; + } + .gallery-columns-5 & { + max-width: 20%; + } + .gallery-columns-6 & { + max-width: 16.66%; + } + .gallery-columns-7 & { + max-width: 14.28%; + } + .gallery-columns-8 & { + max-width: 12.5%; + } + .gallery-columns-9 & { + max-width: 11.11%; + } +} + +.gallery-caption { + display: block; +} diff --git a/less/knacss.less b/less/knacss.less index c920411..21a92e9 100644 --- a/less/knacss.less +++ b/less/knacss.less @@ -18,6 +18,9 @@ @import "_09-misc"; // skip links, google maps and hyphens @import "_10-styling"; // minor stylings +// WordPress base styles +@import "_11-wordpress"; // WordPress reset and basic styles + /* ----------------------------- */ /* ==own stylesheet */ /* ----------------------------- */ diff --git a/sass/_11-wordpress.scss b/sass/_11-wordpress.scss new file mode 100644 index 0000000..0fc3ec7 --- /dev/null +++ b/sass/_11-wordpress.scss @@ -0,0 +1,298 @@ +/* +Author: Geoffrey Crofte, Alsacréations +Contributors: Automattic, Geoffrey Crofte +Description: Reset styles for WordPress usage of KNACSS +*/ + +/* ----------------------------- */ +/* ==Menus */ +/* ----------------------------- */ + +// current menu elements +.current_page_item > a { +} +.current-menu-item > a { +} +.current_page_ancestor > a { +} + +// blocks of content navigation +.comment-navigation, +.paging-navigation, +.post-navigation { + margin: 0 0 1.5em; + overflow: hidden; +} + +.comment-navigation .nav-previous, +.paging-navigation .nav-previous, +.post-navigation .nav-previous { + float: left; + width: 50%; +} + +.comment-navigation .nav-next, +.paging-navigation .nav-next, +.post-navigation .nav-next { + float: right; + text-align: right; + width: 50%; +} + +/* ----------------------------- */ +/* ==Alignments */ +/* ----------------------------- */ + +// class in img elements +.alignnone { + margin: .25em 1.5em 1.5em 0; +} + +.aligncenter { + clear: both; + display: block; + margin: 1.5em auto; +} + +.alignleft { + float: left; + margin: 0 1.5em .25em 0; +} + +.alignright { + float: right; + margin: 0 0 .25em 1.5em; +} + +/* ----------------------------- */ +/* ==Clearings */ +/* ----------------------------- */ + +.entry-content, +.comment-content { + clear: both; + + &:after, &:before { + content: ""; + display: table; + } +} + +/* ----------------------------- */ +/* ==Widgets */ +/* ----------------------------- */ + +.widget + .widget { + margin: 1.5em 0 0; +} + +// usage example: +.widget select { + max-width: 100%; +} + +/* ----------------------------- */ +/* ==Posts and pages */ +/* ----------------------------- */ + +/* === 5.1 Posts - post_class === */ + +// featured content +.sticky { +} + +// attachment post +.attachment { +} + +// format of post +.format- { + &aside { + } + &gallery { + } + &link { + } + &image { + } + "e { + } + &status { + } + &video { + } + &chat { + } +} + +// class for a tag +.tag- { + &name-of-tag { + } +} + +// class for categorie +.category- { + &name-of-category { + } +} + +/* === 5.2 Pages - body_class === */ + +// front page +.home { + // if display posts + &.blog { + } + // if static page + &.page { + } +} + +// page displays posts +.blog { + // if is frontpage + &.home { + } + // if static page + &.page { + } +} + +// simple page +.page { +} + +// page of single post +.single { +} + +// page of archives +.archive { +} + +// page of search +.search { + // if has results + .search-results { + } + // if has no results + .search-no-results { + } +} + +// page 404 +.error404 { +} + +// user logged in +.logged-in { +} + +// text direction if right-to-left +// prefer rtl.css: http://codex.wordpress.org/Right-to-Left_Language_Support +.rtl { +} + +/* === 5.3 Posts and Pages - Contents === */ + +.hentry { + margin: 0 0 1.5em; +} + +.page-content, +.entry-content, +.entry-summary { + margin: 1.5em 0 0; +} + +.page-links { + clear: both; + margin: 0 0 1.5em; +} + +/* ----------------------------- */ +/* ==Comments */ +/* ----------------------------- */ + +.comment-content a { + word-wrap: break-word; +} + +.bypostauthor { + // some make-the-logo-bigger styles +} + +/* ----------------------------- */ +/* ==Media */ +/* ----------------------------- */ + +img.wp-smiley { + margin-bottom: 0; + margin-top: 0; + padding: 0; + border: none; +} + +/* ----------------------------- */ +/* ==Captions */ +/* ----------------------------- */ + +.wp-caption { + max-width: 100%; + margin-bottom: 1.5em; +} + +.wp-caption img { + display: block; + margin: 0 auto; +} + +.wp-caption-text { + margin: 1em 0; + text-align: center; +} + +/* ----------------------------- */ +/* ==Galleries */ +/* ----------------------------- */ + +.gallery { + margin-bottom: 1.5em; +} + +.gallery-item { + display: inline-block; + width: 100%; + text-align: center; + vertical-align: top; + + .gallery-columns-2 & { + max-width: 50%; + } + .gallery-columns-3 & { + max-width: 33.33%; + } + .gallery-columns-4 & { + max-width: 25%; + } + .gallery-columns-5 & { + max-width: 20%; + } + .gallery-columns-6 & { + max-width: 16.66%; + } + .gallery-columns-7 & { + max-width: 14.28%; + } + .gallery-columns-8 & { + max-width: 12.5%; + } + .gallery-columns-9 & { + max-width: 11.11%; + } +} + +.gallery-caption { + display: block; +} diff --git a/sass/knacss.scss b/sass/knacss.scss index b414c59..1f2f7ed 100644 --- a/sass/knacss.scss +++ b/sass/knacss.scss @@ -18,6 +18,9 @@ @import "_09-misc"; // skip links, google maps and hyphens @import "_10-styling"; // minor stylings +// WordPress base styles +@import "_11-wordpress"; // WordPress reset and basic styles + /* ----------------------------- */ /* ==own stylesheet */ /* ----------------------------- */