Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

Add nowrap to buttons to ensure single lines (https://skitch.com/will…

  • Loading branch information...
commit d774cb50f69319497992388de7253082a47e3df6 1 parent 1900842
@wilr wilr authored
View
9 admin/css/screen.css
@@ -192,7 +192,7 @@ form.small .field input.text, form.small .field textarea, form.small .field sele
.cms input.loading, .cms button.loading, .cms input.ui-state-default.loading, .cms .ui-widget-content input.ui-state-default.loading, .cms .ui-widget-header input.ui-state-default.loading { color: #525252; border-color: #d5d3d3; cursor: default; }
.cms input.loading .ui-icon, .cms button.loading .ui-icon, .cms input.ui-state-default.loading .ui-icon, .cms .ui-widget-content input.ui-state-default.loading .ui-icon, .cms .ui-widget-header input.ui-state-default.loading .ui-icon { background: transparent url(../../images/network-save.gif) no-repeat 0 0; }
.cms input.loading.ss-ui-action-constructive .ui-icon, .cms button.loading.ss-ui-action-constructive .ui-icon { background: transparent url(../../images/network-save-constructive.gif) no-repeat 0 0; }
-.cms .ss-ui-button { margin-top: 0px; font-weight: bold; text-decoration: none; line-height: 16px; color: #393939; border: 1px solid #c0c0c2; border-bottom: 1px solid #a6a6a9; cursor: pointer; text-shadow: white 0 1px 1px; background-color: #e6e6e6; background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2Q5ZDlkOSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(100%, #d9d9d9)); background: -webkit-linear-gradient(#ffffff, #d9d9d9); background: -moz-linear-gradient(#ffffff, #d9d9d9); background: -o-linear-gradient(#ffffff, #d9d9d9); background: linear-gradient(#ffffff, #d9d9d9); /* constructive */ /* destructive */ }
+.cms .ss-ui-button { margin-top: 0px; font-weight: bold; text-decoration: none; line-height: 16px; color: #393939; border: 1px solid #c0c0c2; border-bottom: 1px solid #a6a6a9; cursor: pointer; background-color: #e6e6e6; white-space: nowrap; background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2Q5ZDlkOSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(100%, #d9d9d9)); background: -webkit-linear-gradient(#ffffff, #d9d9d9); background: -moz-linear-gradient(#ffffff, #d9d9d9); background: -o-linear-gradient(#ffffff, #d9d9d9); background: linear-gradient(#ffffff, #d9d9d9); text-shadow: white 0 1px 1px; /* constructive */ /* destructive */ }
.cms .ss-ui-button.buttonset { margin: 0 -1px; }
.cms .ss-ui-button.ui-state-hover, .cms .ss-ui-button:hover { text-decoration: none; background-color: white; background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2U2ZTZlNiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(100%, #e6e6e6)); background: -webkit-linear-gradient(#ffffff, #e6e6e6); background: -moz-linear-gradient(#ffffff, #e6e6e6); background: -o-linear-gradient(#ffffff, #e6e6e6); background: linear-gradient(#ffffff, #e6e6e6); -webkit-box-shadow: 0 0 5px #b3b3b3; -moz-box-shadow: 0 0 5px #b3b3b3; box-shadow: 0 0 5px #b3b3b3; }
.cms .ss-ui-button:active, .cms .ss-ui-button:focus, .cms .ss-ui-button.ui-state-active, .cms .ss-ui-button.ui-state-focus { border: 1px solid #b3b3b3; background-color: white; background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2U2ZTZlNiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(100%, #e6e6e6)); background: -webkit-linear-gradient(#ffffff, #e6e6e6); background: -moz-linear-gradient(#ffffff, #e6e6e6); background: -o-linear-gradient(#ffffff, #e6e6e6); background: linear-gradient(#ffffff, #e6e6e6); -webkit-box-shadow: 0 0 5px #b3b3b3 inset; -moz-box-shadow: 0 0 5px #b3b3b3 inset; box-shadow: 0 0 5px #b3b3b3 inset; }
@@ -546,15 +546,12 @@ body.cms-dialog { overflow: auto; background: url("../images/textures/bg_cms_mai
/** -------------------------------------------- "Insert X" forms -------------------------------------------- */
.htmleditorfield-dialog.ui-dialog-content { padding: 0; position: relative; }
-.htmleditorfield-dialog #MediaFormInsertMediaTabs_Fromtheweb .CompositeField:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
-*:first-child .htmleditorfield-dialog #MediaFormInsertMediaTabs_Fromtheweb .CompositeField { zoom: 1; }
+.htmleditorfield-dialog #MediaFormInsertMediaTabs_Fromtheweb .CompositeField { overflow: hidden; *zoom: 1; }
.htmleditorfield-dialog #MediaFormInsertMediaTabs_Fromtheweb #RemoteURL { border: none; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; width: 55%; max-width: 512px; float: left; position: relative; }
.htmleditorfield-dialog #MediaFormInsertMediaTabs_Fromtheweb #RemoteURL label { position: absolute; left: 8px; top: 13px; font-weight: normal; color: #888; }
.htmleditorfield-dialog #MediaFormInsertMediaTabs_Fromtheweb #RemoteURL .middleColumn { margin-left: 0; }
.htmleditorfield-dialog #MediaFormInsertMediaTabs_Fromtheweb #RemoteURL input.remoteurl { padding-left: 40px; }
-.htmleditorfield-dialog #MediaFormInsertMediaTabs_Fromtheweb button.add-url { margin-top: 13px; padding-top: 15px; border: none; background: none; opacity: 0.8; cursor: hand; }
-.htmleditorfield-dialog #MediaFormInsertMediaTabs_Fromtheweb button.add-url:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
-*:first-child .htmleditorfield-dialog #MediaFormInsertMediaTabs_Fromtheweb button.add-url { zoom: 1; }
+.htmleditorfield-dialog #MediaFormInsertMediaTabs_Fromtheweb button.add-url { margin-top: 13px; padding-top: 15px; overflow: hidden; *zoom: 1; border: none; background: none; opacity: 0.8; cursor: hand; }
.htmleditorfield-dialog #MediaFormInsertMediaTabs_Fromtheweb button.add-url .btn-icon-addMedia { width: 20px; height: 20px; }
.htmleditorfield-dialog #MediaFormInsertMediaTabs_Fromtheweb button.add-url:hover, .htmleditorfield-dialog #MediaFormInsertMediaTabs_Fromtheweb button.add-url:active { border: none; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; opacity: 1; }
.htmleditorfield-dialog #MediaFormInsertMediaTabs_Fromtheweb button.add-url.ui-state-disabled, .htmleditorfield-dialog #MediaFormInsertMediaTabs_Fromtheweb button.add-url.ui-state-disabled:hover, .htmleditorfield-dialog #MediaFormInsertMediaTabs_Fromtheweb button.add-url.ui-state-disabled:active { opacity: 0.35; filter: Alpha(Opacity=35); }
View
15 admin/scss/_forms.scss
@@ -300,11 +300,7 @@ form.small .field, .field.small {
}
.ss-ui-button {
- margin-top:0px;
- &.buttonset {
- margin: 0 -1px; // hack to avoid double borders
- }
-
+ margin-top:0px;
font-weight: bold;
text-decoration: none;
line-height: $grid-y * 2;
@@ -312,8 +308,9 @@ form.small .field, .field.small {
border: 1px solid $color-button-generic-border;
border-bottom: 1px solid darken($color-button-generic-border, 10%);
cursor: pointer;
- @include text-shadow(lighten($color-button-generic, 20%) 0 1px 1px);
background-color: $color-button-generic;
+ white-space: nowrap;
+
@include background(
linear-gradient(color-stops(
lighten($color-button-generic, 10%),
@@ -321,6 +318,12 @@ form.small .field, .field.small {
))
);
+ @include text-shadow(lighten($color-button-generic, 20%) 0 1px 1px);
+
+ &.buttonset {
+ margin: 0 -1px; // hack to avoid double borders
+ }
+
&.ui-state-hover, &:hover {
text-decoration: none;
background-color: lighten($color-button-generic, 10%);
View
1  admin/scss/_style.scss
@@ -170,6 +170,7 @@ body.cms {
// Reset to default styles
.ss-ui-button {
line-height: $grid-x*3;
+
.ui-button-text {
line-height: 1.4;
}

2 comments on commit d774cb5

@oetiker

great!

@dd1079

Repostet here for completeness:

The nowrap works great, but the border issue is not fixed. The SCSS results into:

.cms .ss-ui-button.buttonset { margin: 0 -1px; }

but should result into:

.cms .ss-ui-buttonset .ss-ui-button { margin: 0 -1px; }

Additionally the following rule:

.cms .Actions {
    min-height: 30px;
    overflow: auto;
}

needs an overflow: visible, which is the default value, so you can just leave it out.

Please sign in to comment.
Something went wrong with that request. Please try again.