Author: sevein
Date: Thu Aug 25 15:02:48 2011
New Revision: 9602
Log:
Add icon, scaffolding, buttons, ...
Added:
trunk/plugins/qtTrilliumPlugin/images/add.png (contents, props changed)
trunk/plugins/qtTrilliumPlugin/js/trillium.js
Modified:
trunk/plugins/qtTrilliumPlugin/config/qtTrilliumPluginConfiguration.class.php
trunk/plugins/qtTrilliumPlugin/css/less/patterns.less
trunk/plugins/qtTrilliumPlugin/css/less/preboot.less
trunk/plugins/qtTrilliumPlugin/css/less/scaffolding.less
trunk/plugins/qtTrilliumPlugin/css/less/type.less
trunk/plugins/qtTrilliumPlugin/modules/menu/templates/_mainMenu.php
trunk/plugins/qtTrilliumPlugin/templates/_header.php
Modified:
trunk/plugins/qtTrilliumPlugin/config/qtTrilliumPluginConfiguration.class.php
==============================================================================
---
trunk/plugins/qtTrilliumPlugin/config/qtTrilliumPluginConfiguration.class.php
Thu Aug 25 13:02:33 2011 (r9601)
+++
trunk/plugins/qtTrilliumPlugin/config/qtTrilliumPluginConfiguration.class.php
Thu Aug 25 15:02:48 2011 (r9602)
@@ -39,6 +39,7 @@
$context->response->addStylesheet('/plugins/qtTrilliumPlugin/css/less/bootstrap.less',
'last', array('rel' => 'stylesheet/less'));
// Trillium CSS file generated with lessc
+ $context->response->addJavaScript('/plugins/qtTrilliumPlugin/js/trillium');
//
$context->response->addStylesheet('/plugins/qtTrilliumPlugin/css/main.css',
'last', array('rel' => 'stylesheet/less'));
}
Modified: trunk/plugins/qtTrilliumPlugin/css/less/patterns.less
==============================================================================
--- trunk/plugins/qtTrilliumPlugin/css/less/patterns.less Thu Aug 25
13:02:33 2011 (r9601)
+++ trunk/plugins/qtTrilliumPlugin/css/less/patterns.less Thu Aug 25
15:02:48 2011 (r9602)
@@ -361,21 +361,218 @@
}
+ &#browse-menu {
+
+ }
+
+ &#main-menu {
+
+ margin-left: 10px;
+ float: right;
+
+ }
+
+ li.add > a {
+
+ padding-left: 22px;
+ background: transparent url(../../images/add.png) no-repeat 8px 50%;
+
+ }
+
li.help > a {
+
padding-left: 22px;
background: transparent url(../../images/help.png) no-repeat 8px 50%;
+
}
li.language > a {
+
padding-left: 22px;
background: transparent url(../../images/world.png) no-repeat 8px 50%;
+
}
li.user > a {
+
padding-left: 28px;
background: transparent url(../../images/user.png) no-repeat 8px 50%;
+
}
} // #header ul
} // #header
+
+.messages {
+
+ margin-bottom: @baseline;
+ padding: 14px;
+ color: @grayDark;
+ color: rgba(0,0,0,.8);
+ *color: @grayDark; /* IE 6-7 */
+ text-shadow: 0 1px 0 rgba(255,255,255,.25);
+ .border-radius(6px);
+
+ p, li {
+
+ color: @grayDark;
+ color: rgba(0,0,0,.8);
+ *color: @grayDark; /* IE 6-7 */
+
+ }
+
+ p {
+
+ margin-right: 30px;
+ margin-bottom: 0;
+
+ }
+
+ ul {
+
+ margin-bottom: 0;
+
+ }
+
+ strong {
+
+ display: block;
+
+ }
+
+ &.error {
+
+ background: lighten(@red, 55%);
+ border: 1px solid lighten(@red, 50%);
+
+ }
+
+ &.warning {
+
+ background: lighten(@yellow, 35%);
+ border: 1px solid lighten(@yellow, 25%)
+
+ }
+
+ &.success {
+
+ background: lighten(@green, 45%);
+ border: 1px solid lighten(@green, 35%)
+
+ }
+
+ &.info {
+
+ background: lighten(@blue, 45%);
+ border: 1px solid lighten(@blue, 40%);
+
+ }
+
+ .close {
+
+ float: right;
+ margin-top: -2px;
+ color: #000;
+ font-size: 20px;
+ font-weight: bold;
+ text-shadow: 0 1px 0 rgba(255,255,255,1);
+ .opacity(20);
+
+ &:hover {
+
+ text-decoration: none;
+ .opacity(40);
+
+ }
+
+ }
+
+}
+
+.actions {
+
+ background-color: #f5f5f5;
+ margin-bottom: 20px;
+ padding: 19px;
+ min-height: 20px;
+ border: 1px solid #eee;
+ border: 1px solid rgba(0,0,0,.05);
+ .border-radius(4px);
+ .box-shadow(inset 0 1px 1px rgba(0,0,0,.05));
+
+ > div {
+
+ .container();
+
+ }
+
+ ul {
+
+ margin: 0;
+
+ }
+
+ li {
+
+ display: inline;
+ list-style-type: none;
+
+ }
+
+ a {
+
+ .btn();
+
+ }
+
+}
+
+.tabs {
+
+ ul {
+
+ margin: 10px 0 20px;
+ padding: 0;
+ .clearfix();
+ width: 100%;
+ border-bottom: 1px solid @grayLight;
+
+ }
+
+ li {
+
+ display: inline;
+
+ a {
+
+ float: left;
+ width: auto;
+ margin-bottom: -1px;
+ margin-right: 2px;
+ padding: 0px 6px;
+ line-height: (@baseline * 2) - 1;
+ .border-radius(3px 3px 0 0);
+
+ &:hover {
+
+ background-color: @grayLighter;
+ border-bottom: 1px solid @grayLight;
+
+ }
+
+ }
+
+ &.active a {
+
+ background-color: #fff;
+ padding: 0px 6px;
+ border: 1px solid #ccc;
+ border-bottom: 0;
+ color: @gray;
+
+ }
+
+ }
+
+}
Modified: trunk/plugins/qtTrilliumPlugin/css/less/preboot.less
==============================================================================
--- trunk/plugins/qtTrilliumPlugin/css/less/preboot.less Thu Aug 25
13:02:33 2011 (r9601)
+++ trunk/plugins/qtTrilliumPlugin/css/less/preboot.less Thu Aug 25
15:02:48 2011 (r9602)
@@ -50,7 +50,6 @@
@analog1: spin(@baseColor, 22); // Analogs colors
@analog2: spin(@baseColor, -22);
-
// MIXINS
// ------
Modified: trunk/plugins/qtTrilliumPlugin/css/less/scaffolding.less
==============================================================================
--- trunk/plugins/qtTrilliumPlugin/css/less/scaffolding.less Thu Aug 25
13:02:33 2011 (r9601)
+++ trunk/plugins/qtTrilliumPlugin/css/less/scaffolding.less Thu Aug 25
15:02:48 2011 (r9602)
@@ -1,5 +1,7 @@
#page-wrapper {
+ margin-top: 40px;
+
#page {
#header {
@@ -8,13 +10,23 @@
#main-wrapper {
+ .container();
+
#main {
#content {
+ .columns(10);
+
}
- #sidebar {
+ #sidebar-first {
+
+ }
+
+ .sidebar {
+
+ .columns(6);
}
@@ -30,65 +42,77 @@
}
-// STRUCTURAL LAYOUT
-// -----------------
-
html, body {
+
background-color: #fff;
+
}
+
body {
+
margin: 0;
#font > .sans-serif(normal,@basefont,@baseline);
color: @gray;
text-rendering: optimizeLegibility;
+
}
-// Container (centered, fixed-width layouts)
div.container {
+
width: 940px;
margin: 0 auto;
+
}
-// Fluid layouts (left aligned, with sidebar, min- & max-width content)
div.container-fluid {
+
padding: 0 20px;
.clearfix();
+
div.sidebar {
+
float: left;
width: 220px;
+
}
+
div.content {
+
min-width: 700px;
max-width: 1180px;
margin-left: 240px;
- }
-}
+ }
-// BASE STYLES
-// -----------
+}
-// Links
a {
+
color: @linkColor;
text-decoration: none;
line-height: inherit;
font-weight: inherit;
+
&:hover {
+
color: @linkColorHover;
text-decoration: underline;
+
}
+
}
-// Buttons
.btnColor(@primaryColor, @secondaryColor) {
+
#gradient > .vertical(@primaryColor, @secondaryColor);
text-shadow: 0 -1px 0 rgba(0,0,0,.25);
border-color: @secondaryColor @secondaryColor darken(@secondaryColor, 15%);
border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) fadein(rgba(0,0,0,.1), 15%);
+
}
.btn {
+
// .button(#1174C6);
cursor: pointer;
display: inline-block;
@@ -103,58 +127,93 @@
.border-radius(4px);
@shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
.box-shadow(@shadow);
+
&:hover {
+
background-position: 0 -15px;
color: #333;
text-decoration: none;
+
}
+
.transition(.1s linear all);
+
&.primary,
&.danger {
+
color: #fff;
+
&:hover {
+
color: #fff;
+
}
+
}
+
&.primary {
+
.btnColor(@blue, @blueDark)
+
}
+
&.danger {
+
.btnColor(lighten(@red, 15%), @red)
+
}
+
&.large {
+
font-size: 16px;
line-height: 28px;
.border-radius(6px);
+
}
+
&.small {
+
padding-right: 9px;
padding-left: 9px;
font-size: 11px;
+
}
+
&.disabled {
+
background-image: none;
.opacity(65);
cursor: default;
+
}
// this can't be included with the .disabled def because IE8 and below will
drop it ;_;
&:disabled {
+
background-image: none;
.opacity(65);
cursor: default;
+
}
+
&:active {
+
@shadow: inset 0 3px 7px rgba(0,0,0,.1), 0 1px 2px rgba(0,0,0,.05);
.box-shadow(@shadow);
+
}
+
}
// Help Firefox not be a jerk about adding extra padding to buttons
button.btn,
input[type=submit].btn {
+
&::-moz-focus-inner {
+
padding: 0;
border: 0;
+
}
+
}
Modified: trunk/plugins/qtTrilliumPlugin/css/less/type.less
==============================================================================
--- trunk/plugins/qtTrilliumPlugin/css/less/type.less Thu Aug 25 13:02:33
2011 (r9601)
+++ trunk/plugins/qtTrilliumPlugin/css/less/type.less Thu Aug 25 15:02:48
2011 (r9602)
@@ -1,177 +1,253 @@
-/* Typography.less
- * Headings, body text, lists, code, and more for a versatile and durable
typography system
- *
----------------------------------------------------------------------------------------
*/
-
-
-// BODY TEXT
-// ---------
-
p {
+
#font > .shorthand(normal,@basefont,@baseline);
+
margin-bottom: @baseline / 2;
+
small {
+
font-size: @basefont - 2;
color: @grayLight;
- }
-}
+ }
-// HEADINGS
-// --------
+}
h1, h2, h3, h4, h5, h6 {
+
font-weight: bold;
color: @grayDark;
+
small {
+
color: @grayLight;
+
}
+
}
+
h1 {
+
margin-bottom: @baseline;
font-size: 30px;
line-height: @baseline * 2;
+
small {
+
font-size: 18px;
+
}
+
}
+
h2 {
+
font-size: 24px;
line-height: @baseline * 2;
+
small {
+
font-size: 14px;
+
}
+
}
+
h3, h4, h5, h6 {
+
line-height: @baseline * 2;
+
}
+
h3 {
+
font-size: 18px;
+
small {
+
font-size: 14px;
+
}
+
}
+
h4 {
+
font-size: 16px;
+
small {
+
font-size: 12px;
+
}
+
}
+
h5 {
+
font-size: 14px;
+
}
+
h6 {
+
font-size: 13px;
color: @grayLight;
text-transform: uppercase;
-}
+}
-// COLORS
-// ------
-
-// Unordered and Ordered lists
ul, ol {
+
margin: 0 0 @baseline 25px;
+
}
+
ul ul,
ul ol,
ol ol,
ol ul {
+
margin-bottom: 0;
+
}
+
ul {
+
list-style: disc;
+
}
+
ol {
+
list-style: decimal;
+
}
+
li {
+
line-height: @baseline;
color: @gray;
+
}
+
ul.unstyled {
+
list-style: none;
margin-left: 0;
+
}
-// Description Lists
dl {
+
margin-bottom: @baseline;
+
dt, dd {
+
line-height: @baseline;
+
}
+
dt {
+
font-weight: bold;
+
}
+
dd {
+
margin-left: @baseline / 2;
+
}
-}
-// MISC
-// ----
+}
-// Horizontal rules
hr {
+
margin: 0 0 19px;
border: 0;
border-bottom: 1px solid #eee;
+
}
-// Emphasis
strong {
+
font-style: inherit;
font-weight: bold;
line-height: inherit;
+
}
+
em {
+
font-style: italic;
font-weight: inherit;
line-height: inherit;
+
}
+
.muted {
+
color: @grayLighter;
+
}
-// Blockquotes
blockquote {
+
margin-bottom: @baseline;
border-left: 5px solid #eee;
padding-left: 15px;
+
p {
+
#font > .shorthand(300,14px,@baseline);
margin-bottom: 0;
+
}
+
small {
+
display: block;
#font > .shorthand(300,12px,@baseline);
color: @grayLight;
+
&:before {
+
content: '\2014 \00A0';
+
}
+
}
+
}
-// Addresses
address {
+
display: block;
line-height: @baseline;
margin-bottom: @baseline;
+
}
-// Inline and block code styles
code, pre {
+
padding: 0 3px 2px;
font-family: Monaco, Andale Mono, Courier New, monospace;
font-size: 12px;
.border-radius(3px);
+
}
+
code {
+
background-color: lighten(@orange, 40%);
color: rgba(0,0,0,.75);
padding: 1px 3px;
+
}
+
pre {
+
background-color: #f5f5f5;
display: block;
padding: @baseline - 1;
@@ -182,4 +258,5 @@
border: 1px solid rgba(0,0,0,.15);
.border-radius(3px);
white-space: pre-wrap;
+
}
Added: trunk/plugins/qtTrilliumPlugin/images/add.png
==============================================================================
Binary file. No diff available.
Added: trunk/plugins/qtTrilliumPlugin/js/trillium.js
==============================================================================
--- /dev/null 00:00:00 1970 (empty, because file is newly added)
+++ trunk/plugins/qtTrilliumPlugin/js/trillium.js Thu Aug 25 15:02:48
2011 (r9602)
@@ -0,0 +1,34 @@
+(function ($)
+ {
+
+ $(document).ready(function()
+ {
+
+ // Open menu
+ $('a.menu').click(function (e)
+ {
+ var $li = $(this).parent("li").toggleClass('open');
+
+ return false;
+ });
+
+ // Close menu
+ $(document.body).bind('click', function (e)
+ {
+ $('a.menu').parent('li').removeClass("open");
+ });
+
+ // Add close button to messages box
+ $('<a class="close" href="#">×</a>')
+ .click(function()
+ {
+ $(this).parent().remove();
+ })
+ .prependTo('.messages');
+
+ // Insert actions box after #header
+ // $('.actions').insertAfter('#header');
+
+ });
+
+ })(jQuery);
Modified: trunk/plugins/qtTrilliumPlugin/modules/menu/templates/_mainMenu.php
==============================================================================
--- trunk/plugins/qtTrilliumPlugin/modules/menu/templates/_mainMenu.php Thu Aug
25 13:02:33 2011 (r9601)
+++ trunk/plugins/qtTrilliumPlugin/modules/menu/templates/_mainMenu.php Thu Aug
25 15:02:48 2011 (r9602)
@@ -1,5 +1,5 @@
-<li class="menu">
- <a href="#" class="menu"><?php echo
$addMenu->getLabel(array('cultureFallback' => true)) ?></a>
+<li class="menu add">
+ <a href="#" class="menu"> </a>
<?php echo QubitMenu::displayHierarchyAsList($addMenu, 0,
array('overrideVisibility' => array('admin' =>
$sf_user->hasCredential('administrator')))) ?>
</li>
Modified: trunk/plugins/qtTrilliumPlugin/templates/_header.php
==============================================================================
--- trunk/plugins/qtTrilliumPlugin/templates/_header.php Thu Aug 25
13:02:33 2011 (r9601)
+++ trunk/plugins/qtTrilliumPlugin/templates/_header.php Thu Aug 25
15:02:48 2011 (r9602)
@@ -1,28 +1,3 @@
-<script>
-(function ($)
- {
- $(document).ready(function()
- {
-
- // Dropdown example for topbar nav
- // ===============================
-
- $(document.body).bind('click', function (e)
- {
- $('a.menu').parent('li').removeClass("open");
- });
-
- $('a.menu').click(function (e)
- {
- var $li = $(this).parent("li").toggleClass('open');
-
- return false;
- });
-
- });
- })(jQuery);
-</script>
-
<div id="header">
<div class="section clearfix">
<div class="container">
--
You received this message because you are subscribed to the Google Groups
"Qubit Toolkit Commits" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/qubit-commits?hl=en.
