compass-drupal-plugin 0.1.0

data/compass-drupal-plugin.gemspec

@@ -0,0 +1,30 @@
+Gem::Specification.new do |s|
+  # Release Specific Information
+  s.version = "0.1.0"
+  s.date = "2010-11-12"
+
+  # Gem Details
+  s.name = %q{compass-drupal-plugin}
+  s.authors = ["Capi /. Etheriel"]
+  s.summary = %q{a compass extension providing drupal integration}
+  s.description = %q{a compass extension providing drupal integration, supporting the popular base theme Zen}
+  s.email = %q{barraponto@gmail.com}
+  s.homepage = %q{http://bitbucket.org/barraponto/drupal-compass-extension/}
+
+  # Gem Files
+  # s.files = %w(README.mkdn)
+  s.files = [
+    "compass-drupal-plugin.gemspec",
+    "lib/drupal.rb",
+    "stylesheets/drupal/_zen.scss",
+    "templates/zen/zen-base-rtl.scss",
+    "templates/zen/zen-base.scss",
+    "templates/zen/manifest.rb"
+  ]
+
+  # Gem Bookkeeping
+  s.require_paths = ["lib"]
+  s.has_rdoc = false
+  s.rubygems_version = %q{1.3.7}
+  s.add_dependency("compass", [">= 0.10.5"])
+end

data/lib/drupal.rb

@@ -0,0 +1,2 @@
+require 'compass'
+Compass::Frameworks.register("drupal", :path => "#{File.dirname(__FILE__)}/..")

data/stylesheets/drupal/_zen.scss

@@ -0,0 +1,324 @@
+@import 'compass';
+
+$zen-width: 960px !default;
+$zen-content-position: "middle" !default; //possible values are first, middle, last
+$zen-first-sidebar-width: 200px !default;
+$zen-second-sidebar-width: 200px !default;
+$zen-navigation-width: 100% !default;
+$zen-navigation-height: 2.3em !default;
+
+//TODO: liquid
+
+@mixin zen-layout-base {
+
+  .region-header {
+    clear: both; }
+
+  #main-wrapper {
+    position: relative; }
+
+  #page-wrapper, .region-page-closure {
+    margin-left: auto;
+    margin-right: auto;
+    width: $zen-width; }
+
+}
+
+@mixin zen-layout-fixed($direction: "ltr") {
+
+  @include zen-layout-base;
+
+  $first: "left";
+  $last: "right";
+
+  @if $direction == "rtl" {
+    $first:  "right";
+    $last: "left"; }
+
+  #content {
+    width: $zen-width;
+    @include float($first);
+    padding: 0;
+
+    .no-sidebars & {
+      width: $zen-width;
+      margin-#{$first}: 0;
+      margin-#{$last}: -($zen-width); }
+
+    .sidebar-first & {
+      width: $zen-width - $zen-first-sidebar-width;
+
+      @if $zen-content-position == "first" {
+        margin-#{$first}: 0;
+        margin-#{$last}: -($zen-width - $zen-first-sidebar-width); }
+
+      @else {
+        margin-#{$first}: $zen-first-sidebar-width;
+        margin-#{$last}: -($zen-width); } }
+
+    .sidebar-second & {
+      width: $zen-width - $zen-second-sidebar-width;
+
+      @if $zen-content-position == "last" {
+        margin-#{$first}: $zen-second-sidebar-width;
+        margin-#{$last}: -($zen-width); }
+
+      @else {
+        margin-#{$first}: 0;
+        margin-#{$last}: -($zen-width - $zen-second-sidebar-width); } }
+
+    .two-sidebars & {
+      width: $zen-width - $zen-first-sidebar-width - $zen-second-sidebar-width;
+
+      @if $zen-content-position == "middle" {
+        margin-#{$first}: $zen-first-sidebar-width;
+        margin-#{$last}: -($zen-width - $zen-second-sidebar-width); }
+
+      @if $zen-content-position == "first" {
+        margin-#{$first}: 0;
+        margin-#{$last}: -($zen-width - $zen-first-sidebar-width - $zen-second-sidebar-width); }
+
+      @if $zen-content-position == "last" {
+        margin-#{$first}: $zen-first-sidebar-width + $zen-second-sidebar-width;
+        margin-#{$last}: -($zen-width); } } }
+
+  .region-sidebar-first {
+    @include float($first);
+    width: $zen-first-sidebar-width;
+
+    @if $zen-content-position == "first" {
+      margin-#{$first}: $zen-width - $zen-first-sidebar-width;
+      margin-#{$last}: -($zen-width);
+
+      .two-sidebars & {
+        margin-#{$first}: $zen-width - $zen-first-sidebar-width - $zen-second-sidebar-width;
+        margin-#{$last}: -($zen-width - $zen-second-sidebar-width); } }
+
+    @else {
+      margin-#{$first}: 0;
+      margin-#{$last}: -$zen-first-sidebar-width; } }
+
+  .region-sidebar-second {
+    @include float($first);
+    width: $zen-second-sidebar-width;
+
+    @if $zen-content-position == "last" {
+      margin-#{$first}: 0;
+      margin-#{$last}: -$zen-second-sidebar-width;
+
+      .two-sidebars & {
+        margin-#{$first}: $zen-first-sidebar-width;
+        margin-#{$last}: -($zen-second-sidebar-width + $zen-first-sidebar-width); } }
+
+    @else {
+      margin-#{$first}: $zen-width - $zen-second-sidebar-width;
+      margin-#{$last}: -($zen-width);
+
+      .two-sidebars & {
+        margin-#{$first}: $zen-width - $zen-second-sidebar-width;
+        margin-#{$last}: -($zen-width - $zen-second-sidebar-width); } } }
+
+  #content .section {
+    margin: 0;
+    padding: 0; }
+
+}
+
+@mixin zen-layout-liquid($direction: "ltr") {
+
+  @include zen-layout-base;
+
+  $first: "left";
+  $last: "right";
+
+  @if $direction == "rtl" {
+    $first:  "right";
+    $last: "left"; }
+
+  #page-wrapper, .region-page-closure {
+    min-width: 960px; }
+
+  #content {
+    @include float($first);
+    width: 100%;
+    margin-#{$first}: 0;
+    margin-#{$last}: -100%;
+    padding: 0;
+
+    .section {
+      margin: 0;
+      padding: 0; } }
+
+  .region-sidebar {
+    padding: 0;
+    margin: 0;
+
+    .section {
+      padding: 0;
+      margin: 0; } }
+
+  .region-sidebar-first {
+    @extend .region-sidebar;
+    width: $zen-first-sidebar-width; }
+
+  .region-sidebar-second {
+    @extend .region-sidebar;
+    width: $zen-second-sidebar-width; }
+
+  .no-sidebars #content .section {
+    margin: 0;
+    padding: 0; }
+
+  @if $zen-content-position == "first" {
+
+    .sidebar-first #content .section {
+      padding-#{$last}: $zen-first-sidebar-width; }
+
+    .sidebar-second #content .section {
+      padding-#{$last}: $zen-second-sidebar-width; }
+
+    .two-sidebars #content .section {
+      padding-#{$last}: $zen-first-sidebar-width + $zen-second-sidebar-width; }
+
+    .region-sidebar-first {
+      @include float($last);
+      margin-#{$first}: -$zen-second-sidebar-width;
+
+      .two-sidebars &  {
+        margin-#{$first}: 0;
+        margin-#{$last}: $zen-second-sidebar-width;
+      }
+
+      .section {
+        margin-#{$first}: 20px; } }
+
+    .region-sidebar-second {
+      @include float($last);
+      margin-#{$first}: - $zen-second-sidebar-width;
+
+      .two-sidebars &  {
+        margin-#{$first}: 0;
+        margin-#{$last}: -($zen-first-sidebar-width + $zen-second-sidebar-width);
+      }
+
+      .section {
+        margin-#{$first}: 20px; } } }
+
+  @if $zen-content-position == "middle" {
+
+    .sidebar-first #content .section {
+      padding-#{$first}: $zen-first-sidebar-width; }
+
+    .sidebar-second #content .section {
+      padding-#{$last}: $zen-second-sidebar-width; }
+
+    .two-sidebars #content .section {
+      padding-#{$first}: $zen-first-sidebar-width;
+      padding-#{$last}: $zen-second-sidebar-width; }
+
+    .region-sidebar-first {
+      @include float($first);
+
+      .section {
+        margin-#{$last}: 20px; } }
+
+    .region-sidebar-second {
+      @include float($last);
+
+      .section {
+        margin-#{$first}: 20px; } } }
+
+  @if $zen-content-position == "last" {
+
+    .sidebar-first #content .section {
+      padding-#{$first}: $zen-first-sidebar-width; }
+
+    .sidebar-second #content .section {
+      padding-#{$first}: $zen-second-sidebar-width; }
+
+    .two-sidebars #content .section {
+      padding-#{$first}: $zen-first-sidebar-width + $zen-second-sidebar-width; } 
+
+    .region-sidebar-first {
+      @include float($first);
+      margin-#{$last}: -$zen-second-sidebar-width;
+
+      .two-sidebars &  {
+        margin-#{$last}: $zen-second-sidebar-width;
+        margin-#{$first}: 0; }
+
+      .section {
+        margin-#{$last}: 20px; } }
+
+    .region-sidebar-second {
+      @include float($first);
+      margin-#{$last}: - $zen-second-sidebar-width;
+
+      .two-sidebars &  {
+        margin-#{$first}: - $zen-second-sidebar-width;
+        margin-#{$last}: 0;
+      }
+
+      .section {
+        margin-#{$last}: 20px; } } }
+
+}
+
+@mixin zen-layout($direction: "ltr") {
+
+  @if unit($zen-width) == "px" {
+    @include zen-layout-fixed($direction); }
+
+  @else if unit($zen-width) == "%" {
+    @include zen-layout-liquid($direction); }
+
+}
+
+@mixin zen-navigation($direction: "ltr") {
+
+  $first: "left";
+  $last: "right";
+
+  @if $direction == "rtl" {
+    $first:  "right";
+    $last: "left";
+  }
+
+  #navigation {
+    overflow: hidden;
+    @include float($first);
+    width: 100%;
+    margin-#{$first}: 0;
+    margin-#{$last}: -100%;
+    padding: 0;
+    height: $zen-navigation-height;
+
+    ul {
+      margin: 0;
+      padding: 0;
+      text-align: $first; }
+
+    li {
+      @include float($first);
+      padding: 0;
+      padding-#{$last}: 10px; } }
+
+  .with-navigation {
+    #content, .region-sidebar-first, .region-sidebar-second {
+      margin-top: $zen-navigation-height; } }
+
+}
+
+@mixin zen-dropdown-navigation {
+
+  #navigation {
+    overflow: visible; }
+
+}
+
+@mixin zen-clearfix-fix { //ironic, isn't it?
+
+  #page-wrapper {
+    overflow-y: hidden; }
+
+}

data/templates/zen/manifest.rb

@@ -0,0 +1,16 @@
+# Make sure you list all the project template files here in the manifest.
+stylesheet 'zen-base.scss', :media => 'screen, projection', :to => "#{options[:project_name]}.scss"
+stylesheet 'zen-base-rtl.scss', :media => 'screen, projection', :to => "#{options[:project_name]}-rtl.scss"
+
+description "Zen Layout for Drupal Zen Theme"
+
+help %Q{
+  This plugin starts a Zen layout stylesheet in your Compass project
+}
+
+welcome_message %Q{
+  The Zen layout stylesheet has been created.
+  You need to add it to YOURTHEME.info in order to load it into Drupal.
+  If either zen-fixed.css or zen-liquid.css are declared on YOURTHEME.info,
+  you should comment it to avoid CSS conflicts.
+}

data/templates/zen/zen-base-rtl.scss

@@ -0,0 +1,25 @@
+// This file will generate proper RTL layout
+
+@import "drupal/zen";
+
+// This variable controls the total width of the Zen theme.
+// You can use px for a Fixed layout or % for a Liquid layout
+$zen-width: 960px;
+
+// These variables control the size of the sidebars
+$zen-first-sidebar-width: 200px;
+$zen-second-sidebar-width: 200px;
+
+// This variable positions the content relative to the sidebars
+// Possible values are first, last, middle
+$zen-content-position: "middle";
+
+// Use this mixin to generate the Zen layout
+@include zen-layout("rtl");
+
+// These variables control the #navigation div
+$zen-navigation-width: 100%;
+$zen-navigation-height: 2.3em;
+
+// Use this mixin to properly position the #navigation div
+@include zen-navigation("rtl");

data/templates/zen/zen-base.scss

@@ -0,0 +1,23 @@
+@import "drupal/zen";
+
+// This variable controls the total width of the Zen theme.
+// You can use px for a Fixed layout or % for a Liquid layout
+$zen-width: 960px;
+
+// These variables control the size of the sidebars
+$zen-first-sidebar-width: 200px;
+$zen-second-sidebar-width: 200px;
+
+// This variable positions the content relative to the sidebars
+// Possible values are first, last, middle
+$zen-content-position: "middle";
+
+// Use this mixin to generate the Zen layout
+@include zen-layout();
+
+// These variables control the #navigation div
+$zen-navigation-width: 100%;
+$zen-navigation-height: 2.3em;
+
+// Use this mixin to properly position the #navigation div
+@include zen-navigation();

metadata

@@ -0,0 +1,83 @@
+--- !ruby/object:Gem::Specification 
+name: compass-drupal-plugin
+version: !ruby/object:Gem::Version 
+  prerelease: false
+  segments: 
+  - 0
+  - 1
+  - 0
+  version: 0.1.0
+platform: ruby
+authors: 
+- Capi /. Etheriel
+autorequire: 
+bindir: bin
+cert_chain: []
+
+date: 2010-11-12 00:00:00 -02:00
+default_executable: 
+dependencies: 
+- !ruby/object:Gem::Dependency 
+  name: compass
+  prerelease: false
+  requirement: &id001 !ruby/object:Gem::Requirement 
+    none: false
+    requirements: 
+    - - ">="
+      - !ruby/object:Gem::Version 
+        segments: 
+        - 0
+        - 10
+        - 5
+        version: 0.10.5
+  type: :runtime
+  version_requirements: *id001
+description: a compass extension providing drupal integration, supporting the popular base theme Zen
+email: barraponto@gmail.com
+executables: []
+
+extensions: []
+
+extra_rdoc_files: []
+
+files: 
+- compass-drupal-plugin.gemspec
+- lib/drupal.rb
+- stylesheets/drupal/_zen.scss
+- templates/zen/zen-base-rtl.scss
+- templates/zen/zen-base.scss
+- templates/zen/manifest.rb
+has_rdoc: true
+homepage: http://bitbucket.org/barraponto/drupal-compass-extension/
+licenses: []
+
+post_install_message: 
+rdoc_options: []
+
+require_paths: 
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement 
+  none: false
+  requirements: 
+  - - ">="
+    - !ruby/object:Gem::Version 
+      segments: 
+      - 0
+      version: "0"
+required_rubygems_version: !ruby/object:Gem::Requirement 
+  none: false
+  requirements: 
+  - - ">="
+    - !ruby/object:Gem::Version 
+      segments: 
+      - 0
+      version: "0"
+requirements: []
+
+rubyforge_project: 
+rubygems_version: 1.3.7
+signing_key: 
+specification_version: 3
+summary: a compass extension providing drupal integration
+test_files: []
+