---
src/app/stylesheets/_base.scss | 8 +++
src/app/stylesheets/aggregator.scss | 81 +++++++++++++++++++++++++++-------
src/app/views/users/_form.haml | 37 ++++++++--------
src/app/views/users/new.haml | 10 ++--
4 files changed, 95 insertions(+), 41 deletions(-)
diff --git a/src/app/stylesheets/_base.scss b/src/app/stylesheets/_base.scss
index e9cde68..17fb3c1 100644
--- a/src/app/stylesheets/_base.scss
+++ b/src/app/stylesheets/_base.scss
@@ -12,6 +12,8 @@ $formheadfg: #333;
$footerbg: #f3f3f3;
$strokecl: #ddd;
+$errorcl: #cb292b;
+$warningcl: #f6a20a;
$operationbg: #00a5dd;
$administrationbg: #a7b40a;
@@ -40,6 +42,12 @@ $runtimebg: #d83e40;
-webkit-box-shadow: inset $x $y $blur $color;
}
+...@mixin no-box-shadow {
+ box-shadow: none;
+ -moz-box-shadow: none;
+ -webkit-box-shadow: none;
+}
+
@mixin text-shadow($x,$y,$blur,$color) {
text-shadow: $x $y $blur $color;
-moz-text-shadow: $x $y $blur $color;
diff --git a/src/app/stylesheets/aggregator.scss
b/src/app/stylesheets/aggregator.scss
index f4b920d..d7e90cf 100644
--- a/src/app/stylesheets/aggregator.scss
+++ b/src/app/stylesheets/aggregator.scss
@@ -16,9 +16,10 @@ a {
}
}
+/* TEXT ENTRIES */
input,textarea {
@include inset-box-shadow(0,1px,1px,rgba(0, 0, 0, 0.2));
- border: 1px solid #BBBCBA;
+ border: 1px solid darken($strokecl,20%);
background-color: #f0f0f0;
background: #f0f0f0 url(/images/input-bg.png) repeat-x 0 0;
padding: 4px;
@@ -35,23 +36,34 @@ input,textarea {
padding: 4px 30px 4px 10px;
width: 80%;
}
+ /* CHECKBOXES */
+ input[type="checkbox"] {
+ background-color: transparent;
+ border: none;
+ margin: 0;
+ padding: 2px;
+ &:focus {
+ border-width: 1px;
+ padding: 1px;
+ }
+ }
+/* BUTTONS */
input[type='submit'],button,.button {
+ font-family: $screenfont; /* for some reason ff3.6 won't inherit from body */
+ font-size: 10px;
+ display: inline-block;
background: -moz-linear-gradient(top, #f9f9f9, #f0f0f0, #e5e5e5, #e9e9e9);
background: -webkit-gradient(linear, left top, left bottom, from(#f9f9f9),
color-stop(0.9, #e5e5e5), to(#e9e9e9));
- box-shadow: none;
- -moz-box-shadow: none;
- -webkit-box-shadow: none;
+ @include no-box-shadow;
border: 1px solid #555753;
color: #221e1f;
cursor: pointer;
- font-size: 10px;
- margin: 20px 0;
+ margin: 4px;
padding: 4px 12px;
- -webkit-border-radius: 5px;
- -moz-border-radius: 5px;
- text-shadow: 0 1px 0 #fff;
- -webkit-text-shadow: 0 1px 0 #fff;
+ @include border-radius(5px);
+ @include text-shadow(0, 1px, 0, #fff);
+ min-height: 14px;
.nomargin {
margin: 0;
}
@@ -59,6 +71,8 @@ input[type='submit'],button,.button {
background: -moz-linear-gradient(top, #fff, #fff, #cfcfcf);
background: -webkit-gradient(linear, left top, left bottom, from(#fff),
color-stop(0.6, #fff), to(#cfcfcf));
@include box-shadow(0, 1px, 2px, rgba(0,0,0,0.5));
+ text-decoration: none;
+ color: black;
}
&:active {
background: -moz-linear-gradient(top, #c2c3c0, #e4e5e4);
@@ -67,9 +81,18 @@ input[type='submit'],button,.button {
-webkit-box-shadow: none;
-moz-box-shadow: none;
padding: 5px 12px 3px;
+ text-decoration: none;
+ }
+ &:focus {
+ text-decoration: none;
+ color: #000;
+ border-width: 2px;
+ padding: 3px 11px;
}
&.dialogbutton {
float: right;
+ margin-left: 3px;
+ margin: 40px 4px 4px;
}
}
@@ -358,7 +381,8 @@ li.operation>ul, li.administration>ul, li.build>ul,
li.runtime>ul {
padding: 10px;
}
.dcloud_form {
- margin: 20px;
+ margin: 40px;
+ overflow: hidden;
}
.errorExplanation {
h2 {
@@ -372,24 +396,44 @@ li.operation>ul, li.administration>ul, li.build>ul,
li.runtime>ul {
margin-bottom: 60px;
}
+/* FORMS */
+
+/* simple two column label + input pairs */
.dcloud_form {
fieldset {
overflow: hidden;
margin: 10px 0 0;
+ text-align: right;
label {
- width: 140px;
- float: left;
- text-align: right;
+ display: inline-block;
font-weight: bold;
padding: 4px 10px 0 0;
+ max-width: 10em;
}
input {
-
+ display: inline-block;
+ width: 20em;
+ }
+ .fieldWithErrors {
+ display: inline-block;
+ border: 0; margin: 0; padding: 0;
+ input {
+ background-color: lighten($errorcl, 45%);
+ color: $errorcl;
+ }
+ label {
+ color: $errorcl;
+ }
}
}
.indented {
margin: 10px 0 0;
- padding-left: 150px;
+ text-align: right;
+ input[type="text"],label,a,div,p {
+ text-align: left;
+ display: inline-block;
+ width: 20em;
+ }
}
}
@@ -420,5 +464,8 @@ footer {
/* basic image styling for buttons in older browsers */
.no-cssgradients input[type='submit'], .no-cssgradients button,
.no-cssgradients .button {
- background-color: red;
+ /* FIXME image based buttons */
}
+
+/* when modalbox miss dropshadow set some border */
+.no-boxshadow .modalbox { border: 2px solid $strokecl; }
diff --git a/src/app/views/users/_form.haml b/src/app/views/users/_form.haml
index 7c4ee81..8311c16 100644
--- a/src/app/views/users/_form.haml
+++ b/src/app/views/users/_form.haml
@@ -1,19 +1,18 @@
-%ul
- %li
- = form.label :login, "Choose a username"
- = form.text_field :login
- %li
- = form.label :password, form.object.new_record? ? "Choose a password" :
"Change password"
- = form.password_field :password
- %li
- = form.label :password_confirmation, "Confirm password"
- = form.password_field :password_confirmation
- %li
- = form.label :first_name
- = form.text_field :first_name
- %li
- = form.label :last_name
- = form.text_field :last_name
- %li
- = form.label :email
- = form.text_field :email
+%fieldset
+ = form.label :login, "Choose a username:"
+ = form.text_field :login
+%fieldset
+ = form.label :password, form.object.new_record? ? "Choose a password:" :
"Change password:"
+ = form.password_field :password
+%fieldset
+ = form.label :password_confirmation, "Confirm password:"
+ = form.password_field :password_confirmation
+%fieldset
+ = form.label :first_name
+ = form.text_field :first_name
+%fieldset
+ = form.label :last_name
+ = form.text_field :last_name
+%fieldset
+ = form.label :email
+ = form.text_field :email
diff --git a/src/app/views/users/new.haml b/src/app/views/users/new.haml
index e76b47d..4d7319d 100644
--- a/src/app/views/users/new.haml
+++ b/src/app/views/users/new.haml
@@ -1,8 +1,8 @@
-.dcloud_form
- .modalbox
- %h2 New Account
+.modalbox
+ %h2 New Account
+ .dcloud_form
- form_for @user, :url => account_path do |f|
= f.error_messages
= render :partial => "form", :object => f
- = f.submit "Create Account", :class => "submit"
- = link_to "Cancel", root_path, :class => 'actionlink'
+ = f.submit "Create Account", :class => "submit dialogbutton"
+ = link_to "Cancel", root_path, :class => 'actionlink button dialogbutton'
--
1.7.2.3
_______________________________________________
deltacloud-devel mailing list
[email protected]
https://fedorahosted.org/mailman/listinfo/deltacloud-devel
