tonyair/silverstripe-framework
1
0
Fork 0
mirror of https://github.com/silverstripe/silverstripe-framework synced 2024-10-22 14:05:37 +02:00
Code Issues Projects Releases Wiki Activity
bfdf14fafa
silverstripe-framework/admin/css/screen.css

1114 lines
162 KiB
CSS
Raw Normal View History

MINOR: #css implemented multiple column support for optionset fields.
2011-08-01 00:54:31 +02:00
/** This file is the central collection of included modules, links to custom SCSS files, and any global SCSS variable definitions. DO NOT ADD stylesheet rules to this file directly! Note: By prefixing files with an underscore, they won't create individual CSS files. Notes: -------------------------------------------------------------- Z-indexes: * Menu bar on the right should always be on top. This is in the 80 range * Top navingation bar must always sit over the content. This is in the 60 range * Footer must sit over the content as well so this in the 40 range */
MINOR: css styles and formatting for left hand side menu bar. Altered the stylesheet structure to allow future admin scss theme files to be included easier
2011-05-20 01:29:40 +02:00
/** ----------------------------- Core Compass Libraries ------------------------------ */
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; font-size: 100%; vertical-align: baseline; }
ENHANCEMENT Implemented new jLayout layout manager, more expressive class names in LeftAndMain.ss
2011-04-14 07:10:50 +02:00
BUG: One too many brackets in _style.scss Caused when merging 3.0 back into master
2012-10-31 23:16:13 +01:00
html { line-height: 1; }
ENHANCEMENT Implemented new jLayout layout manager, more expressive class names in LeftAndMain.ss
2011-04-14 07:10:50 +02:00
ol, ul { list-style: none; }
MINOR CSS styles for tree and misc. form elements
2011-06-25 07:52:33 +02:00
table { border-collapse: collapse; border-spacing: 0; }
ENHANCEMENT Implemented new jLayout layout manager, more expressive class names in LeftAndMain.ss
2011-04-14 07:10:50 +02:00
caption, th, td { text-align: left; font-weight: normal; vertical-align: middle; }
MINOR CSS styles for tree and misc. form elements
2011-06-25 07:52:33 +02:00
q, blockquote { quotes: none; }
q:before, q:after, blockquote:before, blockquote:after { content: ""; content: none; }
ENHANCEMENT Implemented new jLayout layout manager, more expressive class names in LeftAndMain.ss
2011-04-14 07:10:50 +02:00
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
a img { border: none; }
ENHANCEMENT Implemented new jLayout layout manager, more expressive class names in LeftAndMain.ss
2011-04-14 07:10:50 +02:00
ENHANCEMENT New CMSPreviewable interface class to standardize metadata making a record previewable by the CMS. ENHANCEMENT New "preview" and "edit" buttons to toggle between preview and cms views. Reinstated utility links to switch between draft and live preview (based on SilverStripeNavigator) (formerly called "AjaxSwitchView")
2011-07-21 20:14:33 +02:00
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary { display: block; }
MINOR CSS styles for tree and misc. form elements
2011-06-25 07:52:33 +02:00
BUG FIX: Support for gradients in editor in IE9 Signed-off-by: Naomi Guyer <adrexia@gmail.com>
2012-03-09 03:04:26 +01:00
/*$experimental-support-for-svg variable comes from
imported compass/support file and enables svg gradients in IE9.
It was put here because there didn't seem to be a more logical place to put it.
If more variables exist in the future, consider creating a variables file.*/
MINOR: css styles and formatting for left hand side menu bar. Altered the stylesheet structure to allow future admin scss theme files to be included easier
2011-05-20 01:29:40 +02:00
/** ----------------------------- Theme ------------------------------ */
MINOR Cleaned up structure and documentation of SCSS files in sapphire/admin/scss
2011-07-07 07:34:55 +02:00
/** This file contains the default theme definitions for the admin interface. Please put mostly SCSS variable definitions in here, and leave the actual styling to _style.scss and auxilliary files. */
MINOR: css styles and formatting for left hand side menu bar. Altered the stylesheet structure to allow future admin scss theme files to be included easier
2011-05-20 01:29:40 +02:00
/** ----------------------------------------------- Colours ------------------------------------------------ */
Side-by-side preview options fixes. Add extra preview-mode selector to the CMS actions so we can show something when the preview is closed (and with it all options are not visible). Thanks @mateusz, @clarkepaul and @robert-h-curry for contributing.
2012-11-27 06:03:43 +01:00
/* Keep as solid colours transparent borders wont work in ie */
/* Only for use as shadows as they wont work in older browsers */
ENHANCEMENT Message colours updated
2012-11-06 01:23:20 +01:00
/*$color-optional: #a1d2eb !default; */
MINOR: #css added active highlighting to menu for webkit browsers. tidied up grid for content-tools. Crop text that expands over the title fields. polish tweaks to the cms content actions
2011-08-04 02:02:39 +02:00
/** ----------------------------------------------- Textures ----------------------------------------------- */
MINOR: added vertical and horizontal grid helpers
2011-07-29 05:10:14 +02:00
/** ----------------------------------------------- Typography. ------------------------------------------------ */
MINOR Shorter SCSS $grid-* variables to promote wider usage
2012-02-14 11:18:58 +01:00
/** ----------------------------------------------- Grid Units (px) We have a vertical rhythm that the grid is based off both x (=horizontal) and y (=vertical). All internal padding and margins are scaled to this and accounting for paragraphs ------------------------------------------------ */
BUGFIX: fixed CMSMain menu being displayed on CMSPageController pages. MINOR: added icons for main left hand side.
2011-07-28 06:57:41 +02:00
/** ----------------------------------------------- Application Logo (CMS Logo) Must be 24px x 24px ------------------------------------------------ */
MINOR: #css implemented multiple column support for optionset fields.
2011-08-01 00:54:31 +02:00
/** ----------------------------- Custom mixins ------------------------------ */
API Add action tabsets as a interface idiom. Introduces the concept of action tabsets - usage of TabSet and Tabs in between the action buttons to allow richer set of capabilities that can be offered to the user. Goes along with c8d0cdec99c95dbed3b58ebcc098cc9d22c58206 that implements a change to the CMS actions.
2012-11-21 22:01:02 +01:00
/*Mixin used to generate slightly smaller text and forms
Used in side panels and action tabs
*/
ENHANCEMENAT: sprited up cms menu icons via compass
2011-08-05 06:46:03 +02:00
/** ----------------------------- Sprite images ----------------------------- */
ENHANCEMENT Using native jQuery UI buttons and icon styling for a less coupled implementation (e.g. assuming that a "constructive" button always has a specific icon, or one at all). All CMS UI buttons switched to use <button> markup, which allows for inline icons and correctly aligned multi-line button labels.
2012-02-17 00:35:10 +01:00
/** Helper SCSS file for generating sprites for the interface. */
Provide new save icon for the use in the framework.
2012-11-28 23:36:13 +01:00
.btn-icon-sprite, .ui-state-default .btn-icon-accept, .ui-widget-content .btn-icon-accept, .ui-state-default .btn-icon-accept_disabled, .ui-widget-content .btn-icon-accept_disabled, .ui-state-default .btn-icon-add, .ui-widget-content .btn-icon-add, .ui-state-default .btn-icon-addMedia, .ui-widget-content .btn-icon-addMedia, .ui-state-default .btn-icon-add_disabled, .ui-widget-content .btn-icon-add_disabled, .ui-state-default .btn-icon-addpage, .ui-widget-content .btn-icon-addpage, .ui-state-default .btn-icon-addpage_disabled, .ui-widget-content .btn-icon-addpage_disabled, .ui-state-default .btn-icon-arrow-circle-135-left, .ui-widget-content .btn-icon-arrow-circle-135-left, .ui-state-default .btn-icon-arrow-circle-double, .ui-widget-content .btn-icon-arrow-circle-double, .ui-state-default .btn-icon-back, .ui-widget-content .btn-icon-back, .ui-state-default .btn-icon-back_disabled, .ui-widget-content .btn-icon-back_disabled, .ui-state-default .btn-icon-chain--arrow, .ui-widget-content .btn-icon-chain--arrow, .ui-state-default .btn-icon-chain--exclamation, .ui-widget-content .btn-icon-chain--exclamation, .ui-state-default .btn-icon-chain--minus, .ui-widget-content .btn-icon-chain--minus, .ui-state-default .btn-icon-chain--pencil, .ui-widget-content .btn-icon-chain--pencil, .ui-state-default .btn-icon-chain--plus, .ui-widget-content .btn-icon-chain--plus, .ui-state-default .btn-icon-chain-small, .ui-widget-content .btn-icon-chain-small, .ui-state-default .btn-icon-chain-unchain, .ui-widget-content .btn-icon-chain-unchain, .ui-state-default .btn-icon-chain, .ui-widget-content .btn-icon-chain, .ui-state-default .btn-icon-cross-circle, .ui-widget-content .btn-icon-cross-circle, .ui-state-default .btn-icon-cross-circle_disabled, .ui-widget-content .btn-icon-cross-circle_disabled, .ui-state-default .btn-icon-cross, .ui-widget-content .btn-icon-cross, .ui-state-default .btn-icon-decline, .ui-widget-content .btn-icon-decline, .ui-state-default .btn-icon-decline_disabled, .ui-widget-content .btn-icon-decline_disabled, .ui-state-default .btn-icon-delete, .ui-widget-content .btn-icon-delete, .ui-state-default .btn-icon-deleteLight, .ui-widget-content .btn-icon-deleteLight, .ui-state-default .btn-icon-disk, .ui-widget-content .btn-icon-disk, .ui-state-default .btn-icon-document--pencil, .ui-widget-content .btn-icon-document--pencil, .ui-state-default .btn-icon-download-csv, .ui-widget-content .btn-icon-download-csv, .ui-state-default .btn-icon-drive-upload, .ui-widget-content .btn-icon-drive-upload, .ui-state-default .btn-icon-drive-upload_disabled, .ui-widget-content .btn-icon-drive-upload_disabled, .ui-state-default .btn-icon-grid_print, .ui-widget-content .btn-icon-grid_print, .ui-state-default .btn-icon-magnifier, .ui-widget-content .btn-icon-magnifier, .ui-state-default .btn-icon-minus-circle, .ui-widget-content .btn-icon-minus-circle, .ui-state-default .btn-icon-minus-circle_disabled, .ui-widget-content .btn-icon-minus-circle_disabled, .ui-state-default .btn-icon-navigation, .ui-widget-content .btn-icon-navigation, .ui-state-default .btn-icon-navigation_disabled, .ui-widget-content .btn-icon-navigation_disabled, .ui-state-default .btn-icon-network-cloud, .ui-widget-content .btn-icon-network-cloud, .ui-state-default .btn-icon-network-cloud_disabled, .ui-widget-content .btn-icon-network-cloud_disabled, .ui-state-default .btn-icon-pencil, .ui-widget-content .btn-icon-pencil, .ui-state-default .btn-icon-pencil_disabled, .ui-widget-content .btn-icon-pencil_disabled, .ui-state-default .btn-icon-plug-disconnect-prohibition, .ui-widget-content .btn-icon-plug-disconnect-prohibition, .ui-state-default .btn-icon-plug-disconnect-prohibition_disabled, .ui-widget-content .btn-icon-plug-disconnect-prohibition_disabled, .ui-state-default .btn-icon-preview, .ui-widget-content .btn-icon-preview, .ui-state-default .btn-icon-preview_disabled, .ui-widget-content .btn-icon-preview_disabled, .ui-state-default .btn-icon-settings, .ui-widget-content .btn-icon-settings, .ui-state-default .btn-icon-settings_disabled, .ui-widget-content .btn-icon-settings_
MINOR Updating compass sprites with its changed ordering starting with 0.12 release (see http://compass-style.org/blog/2012/02/01/compass-0-12-is-released/)
2012-06-03 23:22:29 +02:00
.ui-state-default .btn-icon-accept, .ui-widget-content .btn-icon-accept { background-position: 0 -96px; }
.ui-state-default .btn-icon-accept_disabled, .ui-widget-content .btn-icon-accept_disabled { background-position: 0 -80px; }
.ui-state-default .btn-icon-add, .ui-widget-content .btn-icon-add { background-position: 0 0; }
ENHANCEMENT: Change media insertion to use button and apply design Conflicts: css/UploadField.css scss/UploadField.scss
2012-06-11 02:55:40 +02:00
.ui-state-default .btn-icon-addMedia, .ui-widget-content .btn-icon-addMedia { background-position: 0 -208px; }
MINOR Updating compass sprites with its changed ordering starting with 0.12 release (see http://compass-style.org/blog/2012/02/01/compass-0-12-is-released/)
2012-06-03 23:22:29 +02:00
.ui-state-default .btn-icon-add_disabled, .ui-widget-content .btn-icon-add_disabled { background-position: 0 -32px; }
.ui-state-default .btn-icon-addpage, .ui-widget-content .btn-icon-addpage { background-position: 0 -144px; }
Provide new save icon for the use in the framework.
2012-11-28 23:36:13 +01:00
.ui-state-default .btn-icon-addpage_disabled, .ui-widget-content .btn-icon-addpage_disabled { background-position: 0 -500px; }
.ui-state-default .btn-icon-arrow-circle-135-left, .ui-widget-content .btn-icon-arrow-circle-135-left { background-position: 0 -356px; }
.ui-state-default .btn-icon-arrow-circle-double, .ui-widget-content .btn-icon-arrow-circle-double { background-position: 0 -340px; }
.ui-state-default .btn-icon-back, .ui-widget-content .btn-icon-back { background-position: 0 -372px; }
MINOR Updating compass sprites with its changed ordering starting with 0.12 release (see http://compass-style.org/blog/2012/02/01/compass-0-12-is-released/)
2012-06-03 23:22:29 +02:00
.ui-state-default .btn-icon-back_disabled, .ui-widget-content .btn-icon-back_disabled { background-position: 0 -16px; }
API Add action tabsets as a interface idiom. Introduces the concept of action tabsets - usage of TabSet and Tabs in between the action buttons to allow richer set of capabilities that can be offered to the user. Goes along with c8d0cdec99c95dbed3b58ebcc098cc9d22c58206 that implements a change to the CMS actions.
2012-11-21 22:01:02 +01:00
.ui-state-default .btn-icon-chain--arrow, .ui-widget-content .btn-icon-chain--arrow { background-position: 0 -724px; }
Provide new save icon for the use in the framework.
2012-11-28 23:36:13 +01:00
.ui-state-default .btn-icon-chain--exclamation, .ui-widget-content .btn-icon-chain--exclamation { background-position: 0 -516px; }
API Add action tabsets as a interface idiom. Introduces the concept of action tabsets - usage of TabSet and Tabs in between the action buttons to allow richer set of capabilities that can be offered to the user. Goes along with c8d0cdec99c95dbed3b58ebcc098cc9d22c58206 that implements a change to the CMS actions.
2012-11-21 22:01:02 +01:00
.ui-state-default .btn-icon-chain--minus, .ui-widget-content .btn-icon-chain--minus { background-position: 0 -740px; }
Provide new save icon for the use in the framework.
2012-11-28 23:36:13 +01:00
.ui-state-default .btn-icon-chain--pencil, .ui-widget-content .btn-icon-chain--pencil { background-position: 0 -676px; }
API Add action tabsets as a interface idiom. Introduces the concept of action tabsets - usage of TabSet and Tabs in between the action buttons to allow richer set of capabilities that can be offered to the user. Goes along with c8d0cdec99c95dbed3b58ebcc098cc9d22c58206 that implements a change to the CMS actions.
2012-11-21 22:01:02 +01:00
.ui-state-default .btn-icon-chain--plus, .ui-widget-content .btn-icon-chain--plus { background-position: 0 -708px; }
.ui-state-default .btn-icon-chain-small, .ui-widget-content .btn-icon-chain-small { background-position: 0 -772px; }
Provide new save icon for the use in the framework.
2012-11-28 23:36:13 +01:00
.ui-state-default .btn-icon-chain-unchain, .ui-widget-content .btn-icon-chain-unchain { background-position: 0 -484px; }
API Add action tabsets as a interface idiom. Introduces the concept of action tabsets - usage of TabSet and Tabs in between the action buttons to allow richer set of capabilities that can be offered to the user. Goes along with c8d0cdec99c95dbed3b58ebcc098cc9d22c58206 that implements a change to the CMS actions.
2012-11-21 22:01:02 +01:00
.ui-state-default .btn-icon-chain, .ui-widget-content .btn-icon-chain { background-position: 0 -756px; }
Provide new save icon for the use in the framework.
2012-11-28 23:36:13 +01:00
.ui-state-default .btn-icon-cross-circle, .ui-widget-content .btn-icon-cross-circle { background-position: 0 -452px; }
.ui-state-default .btn-icon-cross-circle_disabled, .ui-widget-content .btn-icon-cross-circle_disabled { background-position: 0 -564px; }
ENHANCEMENT: Change media insertion to use button and apply design Conflicts: css/UploadField.css scss/UploadField.scss
2012-06-11 02:55:40 +02:00
.ui-state-default .btn-icon-cross, .ui-widget-content .btn-icon-cross { background-position: 0 -276px; }
MINOR Updating compass sprites with its changed ordering starting with 0.12 release (see http://compass-style.org/blog/2012/02/01/compass-0-12-is-released/)
2012-06-03 23:22:29 +02:00
.ui-state-default .btn-icon-decline, .ui-widget-content .btn-icon-decline { background-position: 0 -128px; }
.ui-state-default .btn-icon-decline_disabled, .ui-widget-content .btn-icon-decline_disabled { background-position: 0 -192px; }
Provide new save icon for the use in the framework.
2012-11-28 23:36:13 +01:00
.ui-state-default .btn-icon-delete, .ui-widget-content .btn-icon-delete { background-position: 0 -468px; }
.ui-state-default .btn-icon-deleteLight, .ui-widget-content .btn-icon-deleteLight { background-position: 0 -307px; }
.ui-state-default .btn-icon-disk, .ui-widget-content .btn-icon-disk { background-position: 0 -291px; }
.ui-state-default .btn-icon-document--pencil, .ui-widget-content .btn-icon-document--pencil { background-position: 0 -548px; }
MINOR Updating compass sprites with its changed ordering starting with 0.12 release (see http://compass-style.org/blog/2012/02/01/compass-0-12-is-released/)
2012-06-03 23:22:29 +02:00
.ui-state-default .btn-icon-download-csv, .ui-widget-content .btn-icon-download-csv { background-position: 0 -48px; }
Provide new save icon for the use in the framework.
2012-11-28 23:36:13 +01:00
.ui-state-default .btn-icon-drive-upload, .ui-widget-content .btn-icon-drive-upload { background-position: 0 -420px; }
.ui-state-default .btn-icon-drive-upload_disabled, .ui-widget-content .btn-icon-drive-upload_disabled { background-position: 0 -580px; }
ENHANCEMENT: Change media insertion to use button and apply design Conflicts: css/UploadField.css scss/UploadField.scss
2012-06-11 02:55:40 +02:00
.ui-state-default .btn-icon-grid_print, .ui-widget-content .btn-icon-grid_print { background-position: 0 -260px; }
Provide new save icon for the use in the framework.
2012-11-28 23:36:13 +01:00
.ui-state-default .btn-icon-magnifier, .ui-widget-content .btn-icon-magnifier { background-position: 0 -532px; }
.ui-state-default .btn-icon-minus-circle, .ui-widget-content .btn-icon-minus-circle { background-position: 0 -628px; }
.ui-state-default .btn-icon-minus-circle_disabled, .ui-widget-content .btn-icon-minus-circle_disabled { background-position: 0 -644px; }
.ui-state-default .btn-icon-navigation, .ui-widget-content .btn-icon-navigation { background-position: 0 -388px; }
.ui-state-default .btn-icon-navigation_disabled, .ui-widget-content .btn-icon-navigation_disabled { background-position: 0 -436px; }
.ui-state-default .btn-icon-network-cloud, .ui-widget-content .btn-icon-network-cloud { background-position: 0 -612px; }
API Add action tabsets as a interface idiom. Introduces the concept of action tabsets - usage of TabSet and Tabs in between the action buttons to allow richer set of capabilities that can be offered to the user. Goes along with c8d0cdec99c95dbed3b58ebcc098cc9d22c58206 that implements a change to the CMS actions.
2012-11-21 22:01:02 +01:00
.ui-state-default .btn-icon-network-cloud_disabled, .ui-widget-content .btn-icon-network-cloud_disabled { background-position: 0 -692px; }
ENHANCEMENT: Change media insertion to use button and apply design Conflicts: css/UploadField.css scss/UploadField.scss
2012-06-11 02:55:40 +02:00
.ui-state-default .btn-icon-pencil, .ui-widget-content .btn-icon-pencil { background-position: 0 -228px; }
Provide new save icon for the use in the framework.
2012-11-28 23:36:13 +01:00
.ui-state-default .btn-icon-pencil_disabled, .ui-widget-content .btn-icon-pencil_disabled { background-position: 0 -596px; }
ENHANCEMENT: Change media insertion to use button and apply design Conflicts: css/UploadField.css scss/UploadField.scss
2012-06-11 02:55:40 +02:00
.ui-state-default .btn-icon-plug-disconnect-prohibition, .ui-widget-content .btn-icon-plug-disconnect-prohibition { background-position: 0 -244px; }
Provide new save icon for the use in the framework.
2012-11-28 23:36:13 +01:00
.ui-state-default .btn-icon-plug-disconnect-prohibition_disabled, .ui-widget-content .btn-icon-plug-disconnect-prohibition_disabled { background-position: 0 -660px; }
MINOR Updating compass sprites with its changed ordering starting with 0.12 release (see http://compass-style.org/blog/2012/02/01/compass-0-12-is-released/)
2012-06-03 23:22:29 +02:00
.ui-state-default .btn-icon-preview, .ui-widget-content .btn-icon-preview { background-position: 0 -64px; }
.ui-state-default .btn-icon-preview_disabled, .ui-widget-content .btn-icon-preview_disabled { background-position: 0 -160px; }
Provide new save icon for the use in the framework.
2012-11-28 23:36:13 +01:00
.ui-state-default .btn-icon-settings, .ui-widget-content .btn-icon-settings { background-position: 0 -324px; }
.ui-state-default .btn-icon-settings_disabled, .ui-widget-content .btn-icon-settings_disabled { background-position: 0 -404px; }
MINOR Updating compass sprites with its changed ordering starting with 0.12 release (see http://compass-style.org/blog/2012/02/01/compass-0-12-is-released/)
2012-06-03 23:22:29 +02:00
.ui-state-default .btn-icon-unpublish, .ui-widget-content .btn-icon-unpublish { background-position: 0 -112px; }
.ui-state-default .btn-icon-unpublish_disabled, .ui-widget-content .btn-icon-unpublish_disabled { background-position: 0 -176px; }
ENHANCEMENT Using native jQuery UI buttons and icon styling for a less coupled implementation (e.g. assuming that a "constructive" button always has a specific icon, or one at all). All CMS UI buttons switched to use <button> markup, which allows for inline icons and correctly aligned multi-line button labels.
2012-02-17 00:35:10 +01:00
MINOR: changed icon size for lefthand menu down to 16x16 rather than 24x24
2011-08-09 01:39:12 +02:00
.icon { text-indent: -9999px; border: none; outline: none; }
Better default icon for ModelAdmin Cogwheels doesn't really communicate its meaning well... New icon is from http://thenounproject.com/noun/database/#icon-No6001, doesn't require permanent attribution (CC0)
2013-04-09 13:37:05 +02:00
.icon.icon-24 { width: 24px; height: 24px; background: url('../images/menu-icons/24x24-s391afdd013.png'); }
BUGFIXES: File Uploads * Add arrows back to edit-all toggle button * Don't show dimensions if the item being inserted doesn't have them. * Set pop-up windows to be a percentage of the window height for better use of space * Fix broken fieldholdersmall styling within files edit * Add placeholder if no preview *Take out minFileSize so upload will work on Android phones
2012-06-08 06:42:14 +02:00
.icon.icon-24.icon-assetadmin { background-position: 0 -120px; }
.icon.icon-24.icon-cmsmain { background-position: 0 -48px; }
Better default icon for ModelAdmin Cogwheels doesn't really communicate its meaning well... New icon is from http://thenounproject.com/noun/database/#icon-No6001, doesn't require permanent attribution (CC0)
2013-04-09 13:37:05 +02:00
.icon.icon-24.icon-cmspagescontroller { background-position: 0 -216px; }
BUGFIXES: File Uploads * Add arrows back to edit-all toggle button * Don't show dimensions if the item being inserted doesn't have them. * Set pop-up windows to be a percentage of the window height for better use of space * Fix broken fieldholdersmall styling within files edit * Add placeholder if no preview *Take out minFileSize so upload will work on Android phones
2012-06-08 06:42:14 +02:00
.icon.icon-24.icon-cmssettingscontroller { background-position: 0 0; }
.icon.icon-24.icon-securityadmin { background-position: 0 -24px; }
.icon.icon-24.icon-reportadmin { background-position: 0 -72px; }
Better default icon for ModelAdmin Cogwheels doesn't really communicate its meaning well... New icon is from http://thenounproject.com/noun/database/#icon-No6001, doesn't require permanent attribution (CC0)
2013-04-09 13:37:05 +02:00
.icon.icon-24.icon-commentadmin { background-position: 0 -192px; }
BUGFIXES: File Uploads * Add arrows back to edit-all toggle button * Don't show dimensions if the item being inserted doesn't have them. * Set pop-up windows to be a percentage of the window height for better use of space * Fix broken fieldholdersmall styling within files edit * Add placeholder if no preview *Take out minFileSize so upload will work on Android phones
2012-06-08 06:42:14 +02:00
.icon.icon-24.icon-help { background-position: 0 -96px; }
Better default icon for ModelAdmin Cogwheels doesn't really communicate its meaning well... New icon is from http://thenounproject.com/noun/database/#icon-No6001, doesn't require permanent attribution (CC0)
2013-04-09 13:37:05 +02:00
.icon.icon-16 { width: 16px; height: 16px; background: url('../images/menu-icons/16x16-sf5b94bb49b.png'); }
MINOR Updating compass sprites with its changed ordering starting with 0.12 release (see http://compass-style.org/blog/2012/02/01/compass-0-12-is-released/)
2012-06-03 23:22:29 +02:00
.icon.icon-16.icon-assetadmin { background-position: 0 -80px; }
.icon.icon-16.icon-cmsmain { background-position: 0 -16px; }
.icon.icon-16.icon-cmspagescontroller { background-position: 0 -112px; }
.icon.icon-16.icon-cmssettingscontroller { background-position: 0 0; }
.icon.icon-16.icon-securityadmin { background-position: 0 -48px; }
.icon.icon-16.icon-reportadmin { background-position: 0 -32px; }
Better default icon for ModelAdmin Cogwheels doesn't really communicate its meaning well... New icon is from http://thenounproject.com/noun/database/#icon-No6001, doesn't require permanent attribution (CC0)
2013-04-09 13:37:05 +02:00
.icon.icon-16.icon-commentadmin { background-position: 0 -144px; }
MINOR Updating compass sprites with its changed ordering starting with 0.12 release (see http://compass-style.org/blog/2012/02/01/compass-0-12-is-released/)
2012-06-03 23:22:29 +02:00
.icon.icon-16.icon-help { background-position: 0 -64px; }
ENHANCEMENAT: sprited up cms menu icons via compass
2011-08-05 06:46:03 +02:00
MINOR: css styles and formatting for left hand side menu bar. Altered the stylesheet structure to allow future admin scss theme files to be included easier
2011-05-20 01:29:40 +02:00
/** ----------------------------- CMS Components ------------------------------ */
ENHANCEMENT: stripped out typography styles from the cms into its own file. Included styling for ins and del
2011-08-26 04:09:25 +02:00
/** File: typography.scss Contains the basic typography related styles for the admin interface. */
MINOR Styling and structural fixes for File/Image->getCMSFields() and relates usage in UploadField/HTMLEditorField.
2012-02-28 18:07:55 +01:00
body, html { font-size: 12px; line-height: 16px; font-family: Arial, sans-serif; color: #444444; }
ENHANCEMENT: stripped out typography styles from the cms into its own file. Included styling for ins and del
2011-08-26 04:09:25 +02:00
.cms h2, .cms h3, .cms h4, .cms h5 { font-weight: bold; margin: 16px 0 16px 0; line-height: 16px; }
.cms h2 { font-size: 18px; line-height: 24px; }
.cms h3 { font-size: 16px; }
.cms h4 { font-size: 14px; }
.cms h5 { font-size: 12px; }
.cms p { line-height: 16px; margin-bottom: 16px; }
ENHANCEMENT Adding missing MemberImportForm to SecurityAdmin, putting each importer into Users and Groups tab for context instead of Import tab, and fixing styling to be close to how it was in SS 2.4.
2012-03-24 01:20:19 +01:00
.cms em { font-style: italic; }
Put back cog icon for multi-select batch actions (was removed in f4b080e)
2013-05-15 11:09:19 +02:00
.cms code { font-family: 'Bitstream Vera Sans Mono','Courier', monospace; }
ENHANCEMENT: stripped out typography styles from the cms into its own file. Included styling for ins and del
2011-08-26 04:09:25 +02:00
ENHANCEMENT Tab style consolidation and design consistency
2012-11-06 10:53:20 +01:00
/** This file defines CMS-specific customizations to the jQuery UI theme. Every rule should contain ONLY overwritten jQuery UI rules (with 'ui-' prefix). This file should be fairly short, as we're using our own custom jQuery UI theme already. TODO Add theme reference Use _style.scss to add more generic style information, and read the jQuery UI theming API: http://jqueryui.com/docs/Theming/API */
.ui-widget-content, .ui-widget { color: #444444; font-size: 12px; font-family: Arial, sans-serif; border: 0; }
.ui-widget-header { background-color: #b0bec7; padding: 8px 8px 6px 8px; border-bottom: 2px solid #8399a7; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2RkZTNlNyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzkyYTViMiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #dde3e7), color-stop(100%, #92a5b2)); background-image: -webkit-linear-gradient(#dde3e7, #92a5b2); background-image: -moz-linear-gradient(#dde3e7, #92a5b2); background-image: -o-linear-gradient(#dde3e7, #92a5b2); background-image: linear-gradient(#dde3e7, #92a5b2); border-bottom: 3px solid #5c7382; padding: 8px; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; }
.ui-widget-header .ui-dialog-title { padding: 6px 0; text-shadow: #ced7dc 1px 1px 0; }
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.ui-widget-header a.ui-dialog-titlebar-close { position: absolute; top: -8px; right: -15px; width: 30px; height: 30px; z-index: 100000; }
.ui-widget-header a.ui-state-hover { border-color: transparent; background: transparent; }
Replace logout button with a more commonly used symbol * Power icon swapped for door icon * Minor hover/focus opacity effect added to button
2013-05-25 06:45:49 +02:00
.ui-widget-header a.ui-state-hover .ui-icon-closethick { background: url('../images/sprites-32x32-s972e408b05.png') 0 -216px no-repeat; }
.ui-widget-header .ui-icon-closethick { background: url('../images/sprites-32x32-s972e408b05.png') 0 -292px no-repeat; width: 30px; height: 30px; }
ENHANCEMENT Tab style consolidation and design consistency
2012-11-06 10:53:20 +01:00
.ui-state-hover { cursor: pointer; }
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { color: #444444; font-size: 12px; font-family: Arial, sans-serif; }
.ui-accordion .ui-accordion-header { border-color: #c0c0c2; margin-bottom: 0; }
.ui-accordion .ui-accordion-content { border: 1px solid #c0c0c2; border-top: none; }
.ui-autocomplete { max-height: 240px; overflow-x: hidden; overflow-y: auto; }
ENHANCEMENT Started styles for new CMS
2011-04-15 01:27:23 +02:00
ENHANCEMENT:fixed issues with overflow between tabs and breadcrumbs in cms-content-header
2012-04-16 06:29:53 +02:00
/** This file defines common styles for form elements used throughout the CMS interface. It is an addition to the base styles defined in framework/css/Form.css. @package framework @subpackage admin */
MINOR Cleaned up structure and documentation of SCSS files in sapphire/admin/scss
2011-07-07 07:34:55 +02:00
/** ---------------------------------------------------- Basic form fields ---------------------------------------------------- */
MINOR: #css styles to clean up vertical alignment in content tools
2011-08-16 04:57:30 +02:00
form.nostyle .field { padding: 0; border: 0; }
MINOR Moving _layout.scss include from screen.css into its own file, in order to selectively block layout options like body {overflow: none;} while retaining all other cms styles (useful in a dialog context)
2011-04-30 05:11:10 +02:00
form.nostyle label { float: none; width: auto; }
MINOR Fixed form reset styles
2012-05-15 22:15:36 +02:00
form.nostyle label.left { float: none; display: inherit; width: auto; padding: 0; line-height: inherit; }
MINOR Moving _layout.scss include from screen.css into its own file, in order to selectively block layout options like body {overflow: none;} while retaining all other cms styles (useful in a dialog context)
2011-04-30 05:11:10 +02:00
form.nostyle .middleColumn { margin-left: 0; }
MINOR Fixed form reset styles
2012-05-15 22:15:36 +02:00
form.nostyle input.text, form.nostyle textarea, form.nostyle select, form.nostyle .TreeDropdownField { width: auto; max-width: auto; }
MINOR Moving _layout.scss include from screen.css into its own file, in order to selectively block layout options like body {overflow: none;} while retaining all other cms styles (useful in a dialog context)
2011-04-30 05:11:10 +02:00
Filter notice styling and panel adjustments * Based on @clarkepaul's commit here: https://github.com/silverstripe-droptables/sapphire/commit/e5de6c06489f3 449ee8131bf4ee2a4e1b2380bee * Kept margin adjustments, but avoided implementing tab changes, as tabs have chnaged a lot since original commit
2013-06-04 02:11:05 +02:00
.field { display: block; border-bottom: 1px solid #d0d3d5; -webkit-box-shadow: 0 1px 0 rgba(245, 245, 245, 0.8); -moz-box-shadow: 0 1px 0 rgba(245, 245, 245, 0.8); box-shadow: 0 1px 0 rgba(245, 245, 245, 0.8); padding: 0 0 7px 0; margin: 8px 0; *zoom: 1; }
.field.noborder style, use it in "Insert Media" dialog
2013-06-14 13:51:28 +02:00
.field.noborder, .field:last-child { padding-bottom: 0; border-bottom: none; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; }
ENHANCEMENT New CMSPreviewable interface class to standardize metadata making a record previewable by the CMS. ENHANCEMENT New "preview" and "edit" buttons to toggle between preview and cms views. Reinstated utility links to switch between draft and live preview (based on SilverStripeNavigator) (formerly called "AjaxSwitchView")
2011-07-21 20:14:33 +02:00
.field:after { content: "\0020"; display: block; height: 0; clear: both; overflow: hidden; visibility: hidden; }
MINOR Cleaned up CMS dialog styling (now works with/without tabs, in iframe and inline markup), removed superfluous SCSS variable declarations
2012-01-03 17:38:11 +01:00
.field.nolabel .middleColumn { margin-left: 0; }
NEW Tooltip and inline help text support for CMS form fields
2012-12-13 16:33:58 +01:00
.field.nolabel .description { margin-left: 0; }
BUG: No indent on rightTitle (fixes #7950) Added margin and made non checkbox right title's match similar labels used elsewhere.
2012-10-18 05:23:49 +02:00
.field.checkbox label.right { margin: 4px 0 0 0; display: inline; font-style: normal; color: #444444; clear: none; }
MINOR Simpler field alignment of OptionsetField (and some specifics for member-profile-form)
2012-01-06 20:44:34 +01:00
.field label.left { float: left; display: block; width: 176px; padding: 8px 8px 8px 0; line-height: 16px; font-weight: bold; text-shadow: 1px 1px 0 white; }
BUG: No indent on rightTitle (fixes #7950) Added margin and made non checkbox right title's match similar labels used elsewhere.
2012-10-18 05:23:49 +02:00
.field label.right { cursor: pointer; clear: both; color: #777777; display: block; font-style: italic; margin: 4px 0 0 184px; }
ENHANCEMENT: implemented CMSPageHistoryController with comparsion view, single version view into new CMSMain interface
2011-08-22 06:44:41 +02:00
.field .middleColumn { margin-left: 184px; }
.field span.readonly { padding-top: 8px; line-height: 16px; display: block; }
Clean up the side-by-side code.
2012-12-06 04:01:33 +01:00
.field .fieldgroup .fieldgroup-field.last { /* This is used on page/settings/visibility */ padding-bottom: 8px; /* replicates li item spacing */ }
Reduced line height for form field help text
2013-06-15 10:01:06 +02:00
.field .description { clear: both; color: #777777; display: block; font-style: italic; line-height: 16px; margin: 4px 0 0 184px; }
NEW Tooltip and inline help text support for CMS form fields
2012-12-13 16:33:58 +01:00
.field.checkbox .description, .field.ss-gridfield .description { margin-left: 0; }
.field input.text, .field textarea, .field select, .field .TreeDropdownField { margin-left: 10px; width: 100%; max-width: 512px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.field input.text.description, .field textarea.description, .field select.description, .field .TreeDropdownField.description { margin: 0; }
.field input.text .description, .field textarea .description, .field select .description, .field .TreeDropdownField .description { max-width: 512px; }
NEW Side by side editing functionality - first cut (os#7412) Introduces a preview window that appears when the screen is wide enough, removes old preview button, adds a draft-public switch, adds variety of preview options which are not hooked up yet. Goes along with cms commit fa3738a9f4c5181eabf18a77ca89792d31592250
2012-11-22 02:14:11 +01:00
.field input.text, .field textarea, .field .TreeDropdownField { background: #fff; border: 1px solid #b3b3b3; padding: 7px 7px; line-height: 16px; margin: 0; outline: none; -moz-transition: 0.2s box-shadow ease-in; -webkit-transition: 0.2s box-shadow ease-in; -o-transition: 0.2s box-shadow ease-in; transition: 0.2s box-shadow ease-in; -moz-transition: 0.2s border ease-in; -webkit-transition: 0.2s border ease-in; -o-transition: 0.2s border ease-in; transition: 0.2s border ease-in; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2VhZWFlYSIvPjxzdG9wIG9mZnNldD0iMTAlIiBzdG9wLWNvbG9yPSIjZmZmZmZmIi8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0idXJsKCNncmFkKSIgLz48L3N2Zz4g'); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #eaeaea), color-stop(10%, #ffffff)); background-image: -webkit-linear-gradient(#eaeaea, #ffffff 10%); background-image: -moz-linear-gradient(#eaeaea, #ffffff 10%); background-image: -o-linear-gradient(#eaeaea, #ffffff 10%); background-image: linear-gradient(#eaeaea, #ffffff 10%); }
MINOR Updating compass sprites with its changed ordering starting with 0.12 release (see http://compass-style.org/blog/2012/02/01/compass-0-12-is-released/)
2012-06-03 23:22:29 +02:00
.field input.text:focus, .field textarea:focus, .field .TreeDropdownField:focus { border: 1px solid #9a9a9a; border-top-color: gray; -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) inset; -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) inset; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) inset; }
BUG: One too many brackets in _style.scss Caused when merging 3.0 back into master
2012-10-31 23:16:13 +01:00
.field input[disabled], .field input.disabled, .field textarea[disabled], .field textarea.disabled, .field select[disabled], .field select.disabled { color: #777777; background: #efefef; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2JjYmNiYyIvPjxzdG9wIG9mZnNldD0iMTAlIiBzdG9wLWNvbG9yPSIjZWZlZmVmIi8+PHN0b3Agb2Zmc2V0PSI5MCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNiY2JjYmMiLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSJ1cmwoI2dyYWQpIiAvPjwvc3ZnPiA='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #bcbcbc), color-stop(10%, #efefef), color-stop(90%, #ffffff), color-stop(100%, #bcbcbc)); background-image: -webkit-linear-gradient(#bcbcbc, #efefef 10%, #ffffff 90%, #bcbcbc); background-image: -moz-linear-gradient(#bcbcbc, #efefef 10%, #ffffff 90%, #bcbcbc); background-image: -o-linear-gradient(#bcbcbc, #efefef 10%, #ffffff 90%, #bcbcbc); background-image: linear-gradient(#bcbcbc, #efefef 10%, #ffffff 90%, #bcbcbc); border: 1px solid #b3b3b3; }
ENHANCEMENT Basic css spacing issues Ticket #7446 Minor css spacing fixs: padding on grid filter, filter panel, page actions box-shadow to remove
2012-06-11 06:02:33 +02:00
.field#Action { box-shadow: none; }
MINOR Using box-sizing to lay out form fields rather than relying on hacky 90% widths + pixel-based paddings, which makes it impossible to align anything outside of the field container the these elements. Using conditional CSS to disable field padding if box-sizing is not available. Generalized "stacked" form pattern in _form.scss, fixed CMS actions padding to align with fields.
2012-01-03 14:49:35 +01:00
form.stacked .field label, .field.stacked label { display: block; float: none; padding-bottom: 10px; }
form.stacked .field .middleColumn, .field.stacked .middleColumn { margin-left: 0px; clear: left; }
FIX: Remove left margin on stacked form field descriptions (fixes #1958)
2013-05-21 10:52:45 +02:00
form.stacked .field .description, .field.stacked .description { margin-left: 0px; }
MINOR Using box-sizing to lay out form fields rather than relying on hacky 90% widths + pixel-based paddings, which makes it impossible to align anything outside of the field container the these elements. Using conditional CSS to disable field padding if box-sizing is not available. Generalized "stacked" form pattern in _form.scss, fixed CMS actions padding to align with fields.
2012-01-03 14:49:35 +01:00
MINOR Merge errors
2012-02-13 18:14:29 +01:00
form.small .field label.left, .field.small label.left { width: 112px; }
form.small .field .middleColumn, .field.small .middleColumn { margin-left: 120px; }
form.small .field input.text, form.small .field textarea, form.small .field select, form.small .field .TreeDropdownField, .field.small input.text, .field.small textarea, .field.small select, .field.small .TreeDropdownField { width: auto; }
BUGFIX: #6853 Necessary styles required to complement work on same-indexed commit in cms project
2012-03-09 01:20:27 +01:00
.field { /* TreeDropdowns */ /* dropdowns */ /* chzn override */ /* Date Fields */ /* Hides borders in settings/access. Activated from JS */ }
MINOR Using box-sizing to lay out form fields rather than relying on hacky 90% widths + pixel-based paddings, which makes it impossible to align anything outside of the field container the these elements. Using conditional CSS to disable field padding if box-sizing is not available. Generalized "stacked" form pattern in _form.scss, fixed CMS actions padding to align with fields.
2012-01-03 14:49:35 +01:00
.field .TreeDropdownField { padding: 0; }
BUG: One too many brackets in _style.scss Caused when merging 3.0 back into master
2012-10-31 23:16:13 +01:00
.field .TreeDropdownField .treedropdownfield-panel { border: 1px solid #b3b3b3; border-top: none; -moz-border-radius-bottomleft: 4px; -webkit-border-bottom-left-radius: 4px; border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -webkit-border-bottom-right-radius: 4px; border-bottom-right-radius: 4px; }
.field .TreeDropdownField.treedropdownfield-open-tree { -moz-border-radius-bottomleft: 0; -webkit-border-bottom-left-radius: 0; border-bottom-left-radius: 0; -moz-border-radius-bottomright: 0; -webkit-border-bottom-right-radius: 0; border-bottom-right-radius: 0; }
MINOR Hiding CMS-specific badges in TreeDropdownField (fixes #7456)
2012-06-14 20:43:29 +02:00
.field .TreeDropdownField .badge { display: none; }
ENHANCEMENT New CMSPreviewable interface class to standardize metadata making a record previewable by the CMS. ENHANCEMENT New "preview" and "edit" buttons to toggle between preview and cms views. Reinstated utility links to switch between draft and live preview (based on SilverStripeNavigator) (formerly called "AjaxSwitchView")
2011-07-21 20:14:33 +02:00
.field .dropdown select { margin-top: 8px; }
Side-by-side preview options styling. Thanks @adrexia for contributing.
2012-11-22 04:30:50 +01:00
.field .chzn-container { max-width: 416px; }
ENHANCEMENT New CMSPreviewable interface class to standardize metadata making a record previewable by the CMS. ENHANCEMENT New "preview" and "edit" buttons to toggle between preview and cms views. Reinstated utility links to switch between draft and live preview (based on SilverStripeNavigator) (formerly called "AjaxSwitchView")
2011-07-21 20:14:33 +02:00
.field .chzn-container .chzn-results li { font-size: 11px; line-height: 16px; padding: 4px 4px; }
.field .chzn-container-active .chzn-single { border: 1px solid #9a9a9a; }
BUG: One too many brackets in _style.scss Caused when merging 3.0 back into master
2012-10-31 23:16:13 +01:00
.field .chzn-container-single .chzn-single { height: 26px; line-height: 26px; /* not relative, as then we'd had to redo most of chzn */ font-size: 12px; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2VmZWZlZiIvPjxzdG9wIG9mZnNldD0iMTAlIiBzdG9wLWNvbG9yPSIjZmZmZmZmIi8+PHN0b3Agb2Zmc2V0PSI5MCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlZmVmZWYiLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSJ1cmwoI2dyYWQpIiAvPjwvc3ZnPiA='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #efefef), color-stop(10%, #ffffff), color-stop(90%, #ffffff), color-stop(100%, #efefef)); background-image: -webkit-linear-gradient(#efefef, #ffffff 10%, #ffffff 90%, #efefef); background-image: -moz-linear-gradient(#efefef, #ffffff 10%, #ffffff 90%, #efefef); background-image: -o-linear-gradient(#efefef, #ffffff 10%, #ffffff 90%, #efefef); background-image: linear-gradient(#efefef, #ffffff 10%, #ffffff 90%, #efefef); }
Accessibility: Visible focus rings
2013-06-15 11:52:02 +02:00
.field .chzn-container-single .chzn-single:hover, .field .chzn-container-single .chzn-single:focus, .field .chzn-container-single .chzn-single:active { text-decoration: none; }
ENHANCEMENT New CMSPreviewable interface class to standardize metadata making a record previewable by the CMS. ENHANCEMENT New "preview" and "edit" buttons to toggle between preview and cms views. Reinstated utility links to switch between draft and live preview (based on SilverStripeNavigator) (formerly called "AjaxSwitchView")
2011-07-21 20:14:33 +02:00
.field .chzn-container-single .chzn-single div { width: 24px; }
MINOR Merge errors
2012-02-13 18:14:29 +01:00
.field .chzn-container-single .chzn-single div b { background-position: 4px 0px; }
ENHANCEMENT general css enhancements Remove arrow from sitetree next to site name #7972 Remove 1px gap from above main tabs and enhance css Replace loading logo Adjust main link colour to have more contrast Add more contrast to main edit panel - made bg slightly lighter
2012-11-05 05:51:38 +01:00
.field .chzn-choices { -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; }
Fixed width of DateField with dmyfields=true
2012-06-26 18:45:54 +02:00
.field input.month, .field input.day, .field input.year { width: 56px; }
BUG TimeField respects user choice (fixes #8260) Regression from c969e04731a6443a4efbdcc6304edd4e88003e83. Also fixes width to accommodate for widest common format: "11:11:11 AM"
2013-02-17 20:57:53 +01:00
.field input.time { width: 88px; }
BUGFIX: #6853 Necessary styles required to complement work on same-indexed commit in cms project
2012-03-09 01:20:27 +01:00
.field.remove-splitter { border-bottom: none; box-shadow: none; }
MINOR Moving _layout.scss include from screen.css into its own file, in order to selectively block layout options like body {overflow: none;} while retaining all other cms styles (useful in a dialog context)
2011-04-30 05:11:10 +02:00
MINOR Cleaned up structure and documentation of SCSS files in sapphire/admin/scss
2011-07-07 07:34:55 +02:00
/** ---------------------------------------------------- Buttons ---------------------------------------------------- */
More CSS fixes for the ActionTabSets. Thanks for contributing @clarkepaul.
2012-11-30 03:29:53 +01:00
.cms .button-no-style button, .cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel button { -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; background: none; border: none; color: #0073c1; display: block; font-weight: normal; margin: 0; outline: none; padding-left: 10px; padding-right: 10px; text-align: left; text-shadow: none; white-space: normal; }
.cms .button-no-style button.ss-ui-action-destructive, .cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel button.ss-ui-action-destructive { color: #c22730; }
.cms .button-no-style button span, .cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel button span { padding-left: 0; padding-right: 0; }
.cms .button-no-style button:hover, .cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel button:hover, .cms .button-no-style button:focus, .cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel button:focus, .cms .button-no-style button:active, .cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel button:active { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; outline: none; background: none; border: none; }
Loading indicator for "more options" buttons
2012-12-13 22:03:43 +01:00
.cms .button-no-style button.loading, .cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel button.loading { background: transparent url(../../images/network-save.gif) no-repeat 8px center; }
.cms .button-no-style button.loading .ui-button-text, .cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel button.loading .ui-button-text { padding-left: 20px; }
ENHANCEMENT Using native jQuery UI buttons and icon styling for a less coupled implementation (e.g. assuming that a "constructive" button always has a specific icon, or one at all). All CMS UI buttons switched to use <button> markup, which allows for inline icons and correctly aligned multi-line button labels.
2012-02-17 00:35:10 +01:00
.cms .Actions > *, .cms .cms-actions-row > * { display: block; float: left; margin-right: 8px; }
.cms .Actions > *:last-child, .cms .cms-actions-row > *:last-child { margin-right: 0; }
API Add action tabsets as a interface idiom. Introduces the concept of action tabsets - usage of TabSet and Tabs in between the action buttons to allow richer set of capabilities that can be offered to the user. Goes along with c8d0cdec99c95dbed3b58ebcc098cc9d22c58206 that implements a change to the CMS actions.
2012-11-21 22:01:02 +01:00
.cms .Actions { min-height: 30px; overflow: auto; padding: 8px 12px; }
Side-by-side preview options styling. Thanks @adrexia for contributing.
2012-11-22 04:30:50 +01:00
.cms .south .Actions, .cms .ui-tabs-panel .Actions, .cms .ui-tabs-panel iframe .Actions { padding: 0; }
MINOR Fixed button loading indicator (fixes #6876)
2012-03-09 22:05:06 +01:00
.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; }
MINOR Added custom save indicator for constructive buttons (green background on animated gif)
2012-03-12 11:10:25 +01:00
.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; }
Revert CMS button style (regression from fe08236) Was originally added for CMS grouped actions, but can't see any effect. Probably related to the unreleased changes around the new "batch actions" and "add page" panel styling. It breaks button height in the top toolbar, by shifting from jQuery UI's (well tested) mode of applying padding to the container, to applying padding to the contained text instead. This conflicts with the line-height set on many buttons.
2012-12-17 10:55:27 +01:00
.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 */ }
BUG: One too many brackets in _style.scss Caused when merging 3.0 back into master
2012-10-31 23:16:13 +01:00
.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; }
Smaller styling for minor actions in CMS
2013-02-04 12:10:34 +01:00
.cms .ss-ui-button.ss-ui-action-minor span { padding-left: 0; padding-right: 0; }
BUG: One too many brackets in _style.scss Caused when merging 3.0 back into master
2012-10-31 23:16:13 +01:00
.cms .ss-ui-button.ss-ui-action-constructive { text-shadow: none; font-weight: bold; color: white; border-color: #1f9433; border-bottom-color: #166a24; background-color: #1f9433; background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzkzYmU0MiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzFmOTQzMyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #93be42), color-stop(100%, #1f9433)); background: -webkit-linear-gradient(#93be42, #1f9433); background: -moz-linear-gradient(#93be42, #1f9433); background: -o-linear-gradient(#93be42, #1f9433); background: linear-gradient(#93be42, #1f9433); text-shadow: #1c872f 0 -1px -1px; }
.cms .ss-ui-button.ss-ui-action-constructive.ui-state-hover, .cms .ss-ui-button.ss-ui-action-constructive:hover { border-color: #166a24; background-color: #1f9433; background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2E0Y2EzYSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzIzYTkzYSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #a4ca3a), color-stop(100%, #23a93a)); background: -webkit-linear-gradient(#a4ca3a, #23a93a); background: -moz-linear-gradient(#a4ca3a, #23a93a); background: -o-linear-gradient(#a4ca3a, #23a93a); background: linear-gradient(#a4ca3a, #23a93a); }
MINOR Updating compass sprites with its changed ordering starting with 0.12 release (see http://compass-style.org/blog/2012/02/01/compass-0-12-is-released/)
2012-06-03 23:22:29 +02:00
.cms .ss-ui-button.ss-ui-action-constructive:active, .cms .ss-ui-button.ss-ui-action-constructive:focus, .cms .ss-ui-button.ss-ui-action-constructive.ui-state-active, .cms .ss-ui-button.ss-ui-action-constructive.ui-state-focus { background-color: #1d8c30; -webkit-box-shadow: inset 0 1px 3px #17181a, 0 1px 0 rgba(255, 255, 255, 0.6); -moz-box-shadow: inset 0 1px 3px #17181a, 0 1px 0 rgba(255, 255, 255, 0.6); box-shadow: inset 0 1px 3px #17181a, 0 1px 0 rgba(255, 255, 255, 0.6); }
MINOR Cleaned up CMS dialog styling (now works with/without tabs, in iframe and inline markup), removed superfluous SCSS variable declarations
2012-01-03 17:38:11 +01:00
.cms .ss-ui-button.ss-ui-action-destructive { color: red; background-color: #e6e6e6; }
API Add action tabsets as a interface idiom. Introduces the concept of action tabsets - usage of TabSet and Tabs in between the action buttons to allow richer set of capabilities that can be offered to the user. Goes along with c8d0cdec99c95dbed3b58ebcc098cc9d22c58206 that implements a change to the CMS actions.
2012-11-21 22:01:02 +01:00
.cms .ss-ui-button.ss-ui-button-small .ui-button-text { font-size: 10px; }
MINOR Cleaned up CMS dialog styling (now works with/without tabs, in iframe and inline markup), removed superfluous SCSS variable declarations
2012-01-03 17:38:11 +01:00
.cms .ss-ui-button.ui-state-highlight { background-color: #e6e6e6; border: 1px solid #708284; }
MINOR Updating compass sprites with its changed ordering starting with 0.12 release (see http://compass-style.org/blog/2012/02/01/compass-0-12-is-released/)
2012-06-03 23:22:29 +02:00
.cms .ss-ui-button.ss-ui-action-minor { background: none; border: 0; color: #393939; text-decoration: underline; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; }
MINOR Cleaned up CMS dialog styling (now works with/without tabs, in iframe and inline markup), removed superfluous SCSS variable declarations
2012-01-03 17:38:11 +01:00
.cms .ss-ui-button.ss-ui-action-minor:hover { text-decoration: none; color: #1f1f1f; }
.cms .ss-ui-button.ss-ui-action-minor:focus, .cms .ss-ui-button.ss-ui-action-minor:active { text-decoration: none; color: #525252; }
BUGFIX: #7036 refresh CMS panel when adding a new file
2012-03-24 02:20:33 +01:00
.cms .ss-ui-button.ss-ui-button-loading { opacity: 0.8; }
FIX: Proper buttonset styling
2012-08-07 18:05:45 +02:00
.cms .ss-ui-buttonset .ui-button { margin-left: -1px; }
.cms .ss-ui-buttonset { margin-left: 1px; }
BUGFIX: #7036 refresh CMS panel when adding a new file
2012-03-24 02:20:33 +01:00
.cms .ss-ui-loading-icon { background: url(../../images/network-save.gif) no-repeat; display: block; width: 16px; height: 16px; }
ENHANCEMENT New CMSPreviewable interface class to standardize metadata making a record previewable by the CMS. ENHANCEMENT New "preview" and "edit" buttons to toggle between preview and cms views. Reinstated utility links to switch between draft and live preview (based on SilverStripeNavigator) (formerly called "AjaxSwitchView")
2011-07-21 20:14:33 +02:00
/** ---------------------------------------------------- Grouped form fields ---------------------------------------------------- */
Restored inlined styling of .fieldgroup (same UI as in 2.x)
2013-01-14 01:38:09 +01:00
.fieldgroup .fieldgroup-field { float: left; display: block; padding: 8px 8px 0 0; }
ENHANCEMENT New CMSPreviewable interface class to standardize metadata making a record previewable by the CMS. ENHANCEMENT New "preview" and "edit" buttons to toggle between preview and cms views. Reinstated utility links to switch between draft and live preview (based on SilverStripeNavigator) (formerly called "AjaxSwitchView")
2011-07-21 20:14:33 +02:00
.fieldgroup .fieldgroup-field .field { border: none; padding-bottom: 0; }
Restored inlined styling of .fieldgroup (same UI as in 2.x)
2013-01-14 01:38:09 +01:00
.fieldgroup .fieldgroup-field label { margin-left: 0; margin-right: 1em; width: auto; }
Removed arbitrary width restrictions on field group children Let the fields handle their dimensions themselves (for example the "from" and "to" date fields in the CMS pages search form)
2012-08-27 15:50:21 +02:00
.fieldgroup.stacked .fieldgroup-field { float: none; }
ENHANCEMENT New CMSPreviewable interface class to standardize metadata making a record previewable by the CMS. ENHANCEMENT New "preview" and "edit" buttons to toggle between preview and cms views. Reinstated utility links to switch between draft and live preview (based on SilverStripeNavigator) (formerly called "AjaxSwitchView")
2011-07-21 20:14:33 +02:00
Side-by-side preview options styling. Thanks @adrexia for contributing.
2012-11-22 04:30:50 +01:00
.ss-toggle { margin: 8px 0; }
.ss-toggle .ui-accordion-header { font-weight: bold; font-size: 12px; }
BUG: One too many brackets in _style.scss Caused when merging 3.0 back into master
2012-10-31 23:16:13 +01:00
.ss-toggle .ui-accordion-header.ui-state-default { background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0icmdiYSgyNDEsIDI0MiwgMjQyLCAwLjgpIi8+PHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSJyZ2JhKDIwMSwgMjA1LCAyMDYsIDAuOCkiLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSJ1cmwoI2dyYWQpIiAvPjwvc3ZnPiA='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(241, 242, 242, 0.8)), color-stop(100%, rgba(201, 205, 206, 0.8))); background-image: -webkit-linear-gradient(rgba(241, 242, 242, 0.8), rgba(201, 205, 206, 0.8)); background-image: -moz-linear-gradient(rgba(241, 242, 242, 0.8), rgba(201, 205, 206, 0.8)); background-image: -o-linear-gradient(rgba(241, 242, 242, 0.8), rgba(201, 205, 206, 0.8)); background-image: linear-gradient(rgba(241, 242, 242, 0.8), rgba(201, 205, 206, 0.8)); text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5); }
Side-by-side preview options styling. Thanks @adrexia for contributing.
2012-11-22 04:30:50 +01:00
.ss-toggle .ui-accordion-header .ui-accordion-header-icon { margin-top: -9px; }
.ss-toggle .ui-accordion-content { padding: 8px 0 12px; }
.ss-toggle .ui-accordion-content .field { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; padding-left: 12px; padding-right: 12px; }
ENHANCEMENT: Refactored ToggleCompositeField. * Use jquery ui accordion for the field, and implemented an admin theme. * Made the setting of configuration consistent with other form fields. * ToggleComposteField->startClosed() has been deprecated in favour of setStartClosed(). * Removed public access to the heading level, instead use getHeadingLevel() or setHeadingLevel().
2012-06-13 06:20:07 +02:00
.ss-toggle .ui-accordion-content .field:last-child { margin-bottom: 0; }
Side-by-side preview options styling. Thanks @adrexia for contributing.
2012-11-22 04:30:50 +01:00
.ss-toggle .ui-accordion-content .field .middleColumn { margin-left: 0; }
.ss-toggle .ui-accordion-content .field label { float: none; margin-left: 0; }
NEW Tooltip and inline help text support for CMS form fields
2012-12-13 16:33:58 +01:00
.ss-toggle .ui-accordion-content .field .description { margin-left: 0; }
ENHANCEMENT: Refactored ToggleCompositeField. * Use jquery ui accordion for the field, and implemented an admin theme. * Made the setting of configuration consistent with other form fields. * ToggleComposteField->startClosed() has been deprecated in favour of setStartClosed(). * Removed public access to the heading level, instead use getHeadingLevel() or setHeadingLevel().
2012-06-13 06:20:07 +02:00
ENHANCEMENT New CMSPreviewable interface class to standardize metadata making a record previewable by the CMS. ENHANCEMENT New "preview" and "edit" buttons to toggle between preview and cms views. Reinstated utility links to switch between draft and live preview (based on SilverStripeNavigator) (formerly called "AjaxSwitchView")
2011-07-21 20:14:33 +02:00
/** ---------------------------------------------------- Checkbox Field ---------------------------------------------------- */
MINOR Using box-sizing to lay out form fields rather than relying on hacky 90% widths + pixel-based paddings, which makes it impossible to align anything outside of the field container the these elements. Using conditional CSS to disable field padding if box-sizing is not available. Generalized "stacked" form pattern in _form.scss, fixed CMS actions padding to align with fields.
2012-01-03 14:49:35 +01:00
.field.checkbox { padding-left: 184px; margin-bottom: 8px; }
.field.checkbox input { margin-left: 0; }
ENHANCEMENT New CMSPreviewable interface class to standardize metadata making a record previewable by the CMS. ENHANCEMENT New "preview" and "edit" buttons to toggle between preview and cms views. Reinstated utility links to switch between draft and live preview (based on SilverStripeNavigator) (formerly called "AjaxSwitchView")
2011-07-21 20:14:33 +02:00
MINOR Simpler field alignment of OptionsetField (and some specifics for member-profile-form)
2012-01-06 20:44:34 +01:00
input.checkbox { margin-left: 0; }
/** ---------------------------------------------------- Radiobutton Field ---------------------------------------------------- */
.field.radio { padding-left: 184px; margin-bottom: 8px; }
.field.radio input { margin-left: 0; }
input.radio { margin-left: 0; }
ENHANCEMENT New CMSPreviewable interface class to standardize metadata making a record previewable by the CMS. ENHANCEMENT New "preview" and "edit" buttons to toggle between preview and cms views. Reinstated utility links to switch between draft and live preview (based on SilverStripeNavigator) (formerly called "AjaxSwitchView")
2011-07-21 20:14:33 +02:00
/** ---------------------------------------------------- Optionsets and Checkboxsets ---------------------------------------------------- */
Side-by-side preview options styling. Thanks @adrexia for contributing.
2012-11-22 04:30:50 +01:00
.optionset { padding-bottom: 8px; padding-top: 8px; }
.optionset li { float: left; display: block; width: 216px; padding-bottom: 8px; padding-top: 0; line-height: 16px; list-style: none; }
MINOR Simpler field alignment of OptionsetField (and some specifics for member-profile-form)
2012-01-06 20:44:34 +01:00
.optionset li input { display: inline-block; padding-right: 0; margin-right: 0; }
.optionset li label { display: inline; cursor: pointer; padding-left: 8px; }
Side-by-side preview options styling. Thanks @adrexia for contributing.
2012-11-22 04:30:50 +01:00
.optionset.field { padding-top: 0; }
ENHANCEMENT New CMSPreviewable interface class to standardize metadata making a record previewable by the CMS. ENHANCEMENT New "preview" and "edit" buttons to toggle between preview and cms views. Reinstated utility links to switch between draft and live preview (based on SilverStripeNavigator) (formerly called "AjaxSwitchView")
2011-07-21 20:14:33 +02:00
/** ---------------------------------------------------- HTML Text ---------------------------------------------------- */
API Full-width HTMLEditorField by default
2013-05-22 16:15:16 +02:00
.htmleditor label { display: block; float: none; padding-bottom: 10px; }
.htmleditor .middleColumn { margin-left: 0px; clear: left; }
.htmleditor .description { margin-left: 0px; }
MINOR Improved perceived UI feedback by hiding various elements until they're styled properly (TinyMCE, tree)
2011-12-14 16:54:52 +01:00
.htmleditor textarea { visibility: hidden; }
MINOR Using box-sizing to lay out form fields rather than relying on hacky 90% widths + pixel-based paddings, which makes it impossible to align anything outside of the field container the these elements. Using conditional CSS to disable field padding if box-sizing is not available. Generalized "stacked" form pattern in _form.scss, fixed CMS actions padding to align with fields.
2012-01-03 14:49:35 +01:00
.htmleditor .mceEditor input, .htmleditor .mceEditor select { width: auto; }
ENHANCEMENT Basic css spacing issues Ticket #7446 Minor css spacing fixs: padding on grid filter, filter panel, page actions box-shadow to remove
2012-06-11 06:02:33 +02:00
.htmleditor label.left { padding-bottom: 4px; }
MINOR Cleaned up structure and documentation of SCSS files in sapphire/admin/scss
2011-07-07 07:34:55 +02:00
MINOR CSS styles for admin buttons. Color defintions set into _default.scss
2011-06-10 04:56:55 +02:00
.action-hidden { display: none; }
Side-by-side preview options styling. Thanks @adrexia for contributing.
2012-11-22 04:30:50 +01:00
/***************************************************************
* On/Off Switch.
Replace the state selector switch to support more than 2 states.
2012-12-03 03:17:16 +01:00
* Supports switching between up to 5 values (used for Draft/Published)
Side-by-side preview options styling. Thanks @adrexia for contributing.
2012-11-22 04:30:50 +01:00
* Example html set-up:
Replace the state selector switch to support more than 2 states.
2012-12-03 03:17:16 +01:00
* <fieldset class="switch-states size_2">
* <div class="switch">
* <input id="Draft" class="first" name="view" type="radio" checked>
Side-by-side preview browser compatibility fixes.
2012-12-04 06:10:20 +01:00
* <label for="Draft">Draft</label>
Replace the state selector switch to support more than 2 states.
2012-12-03 03:17:16 +01:00
* <input id="Published" class="last" name="view" type="radio">
Side-by-side preview browser compatibility fixes.
2012-12-04 06:10:20 +01:00
* <label for="Published">Published</label>
Replace the state selector switch to support more than 2 states.
2012-12-03 03:17:16 +01:00
* <span class="slide-button"></span>
* </div>
* </fieldset>
Side-by-side preview options styling. Thanks @adrexia for contributing.
2012-11-22 04:30:50 +01:00
****************************************************************/
Clean up the side-by-side code.
2012-12-06 04:01:33 +01:00
fieldset.switch-states { padding: 0 20px 0 0; margin-right: 5px; /*
Replace the state selector switch to support more than 2 states.
2012-12-03 03:17:16 +01:00
Produce css for up to 5 states.
Note: with a little adjustment the switch can take more than 5 items,
but a dropdown would probably be more appropriate
*/ }
Side-by-side preview browser compatibility fixes.
2012-12-04 06:10:20 +01:00
fieldset.switch-states .switch { -webkit-box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.1), 0 1px 0px rgba(255, 255, 255, 0.1); -moz-box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.1), 0 1px 0px rgba(255, 255, 255, 0.1); box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.1), 0 1px 0px rgba(255, 255, 255, 0.1); -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; -webkit-animation: bugfix infinite 1s; background: #dee0e3; display: block; height: 25px; margin-top: 3px; padding: 0 10px; position: relative; width: 100%; z-index: 5; }
fieldset.switch-states .switch label { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; -o-text-overflow: ellipsis; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5); color: #858585; color: rgba(31, 31, 31, 0.5); cursor: pointer; float: left; font-weight: bold; height: 100%; line-height: 25px; position: relative; z-index: 2; /* Make text unselectable in browsers that support that */ -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
fieldset.switch-states .switch label:hover { color: #6c6c6c; color: rgba(31, 31, 31, 0.7); }
fieldset.switch-states .switch label span { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; -o-text-overflow: ellipsis; display: inline-block; padding: 0 10px; }
fieldset.switch-states .switch input { opacity: 0; filter: alpha(opacity=0); visibility: none; position: absolute; }
Replace the state selector switch to support more than 2 states.
2012-12-03 03:17:16 +01:00
fieldset.switch-states .switch input:checked + label { -moz-transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; color: #fff; text-shadow: 0 -1px 0 #287099; }
Side-by-side preview browser compatibility fixes.
2012-12-04 06:10:20 +01:00
fieldset.switch-states .switch .slide-button { background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzJiOWMzMiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzY0YWIzNiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #2b9c32), color-stop(100%, #64ab36)); background-image: -webkit-linear-gradient(#2b9c32, #64ab36); background-image: -moz-linear-gradient(#2b9c32, #64ab36); background-image: -o-linear-gradient(#2b9c32, #64ab36); background-image: linear-gradient(#2b9c32, #64ab36); -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; -webkit-box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.3), 0 1px 0px rgba(255, 255, 255, 0.2); -moz-box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.3), 0 1px 0px rgba(255, 255, 255, 0.2); box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.3), 0 1px 0px rgba(255, 255, 255, 0.2); text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5); -moz-transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; background-color: #2b9c32; display: block; height: 100%; left: 0; padding: 0; position: absolute; top: 0; z-index: 1; }
Clean up the side-by-side code.
2012-12-06 04:01:33 +01:00
fieldset.switch-states.size_1 label, fieldset.switch-states.size_1 .slide-button { width: 100%; }
fieldset.switch-states.size_1 label span { padding-right: 0; }
Replace the state selector switch to support more than 2 states.
2012-12-03 03:17:16 +01:00
fieldset.switch-states.size_1 input:checked:nth-of-type(2) ~ .slide-button { left: 100%; }
fieldset.switch-states.size_1 input:checked:nth-of-type(3) ~ .slide-button { left: 200%; }
fieldset.switch-states.size_1 input:checked:nth-of-type(4) ~ .slide-button { left: 300%; }
fieldset.switch-states.size_1 input:checked:nth-of-type(5) ~ .slide-button { left: 400%; }
Clean up the side-by-side code.
2012-12-06 04:01:33 +01:00
fieldset.switch-states.size_2 label, fieldset.switch-states.size_2 .slide-button { width: 50%; }
Replace the state selector switch to support more than 2 states.
2012-12-03 03:17:16 +01:00
fieldset.switch-states.size_2 input:checked:nth-of-type(2) ~ .slide-button { left: 50%; }
fieldset.switch-states.size_2 input:checked:nth-of-type(3) ~ .slide-button { left: 100%; }
fieldset.switch-states.size_2 input:checked:nth-of-type(4) ~ .slide-button { left: 150%; }
fieldset.switch-states.size_2 input:checked:nth-of-type(5) ~ .slide-button { left: 200%; }
Clean up the side-by-side code.
2012-12-06 04:01:33 +01:00
fieldset.switch-states.size_3 label, fieldset.switch-states.size_3 .slide-button { width: 33.33333%; }
Replace the state selector switch to support more than 2 states.
2012-12-03 03:17:16 +01:00
fieldset.switch-states.size_3 input:checked:nth-of-type(2) ~ .slide-button { left: 33.33333%; }
fieldset.switch-states.size_3 input:checked:nth-of-type(3) ~ .slide-button { left: 66.66667%; }
fieldset.switch-states.size_3 input:checked:nth-of-type(4) ~ .slide-button { left: 100%; }
fieldset.switch-states.size_3 input:checked:nth-of-type(5) ~ .slide-button { left: 133.33333%; }
Clean up the side-by-side code.
2012-12-06 04:01:33 +01:00
fieldset.switch-states.size_4 label, fieldset.switch-states.size_4 .slide-button { width: 25%; }
Replace the state selector switch to support more than 2 states.
2012-12-03 03:17:16 +01:00
fieldset.switch-states.size_4 input:checked:nth-of-type(2) ~ .slide-button { left: 25%; }
fieldset.switch-states.size_4 input:checked:nth-of-type(3) ~ .slide-button { left: 50%; }
fieldset.switch-states.size_4 input:checked:nth-of-type(4) ~ .slide-button { left: 75%; }
fieldset.switch-states.size_4 input:checked:nth-of-type(5) ~ .slide-button { left: 100%; }
Clean up the side-by-side code.
2012-12-06 04:01:33 +01:00
fieldset.switch-states.size_5 label, fieldset.switch-states.size_5 .slide-button { width: 20%; }
Replace the state selector switch to support more than 2 states.
2012-12-03 03:17:16 +01:00
fieldset.switch-states.size_5 input:checked:nth-of-type(2) ~ .slide-button { left: 20%; }
fieldset.switch-states.size_5 input:checked:nth-of-type(3) ~ .slide-button { left: 40%; }
fieldset.switch-states.size_5 input:checked:nth-of-type(4) ~ .slide-button { left: 60%; }
fieldset.switch-states.size_5 input:checked:nth-of-type(5) ~ .slide-button { left: 80%; }
@-webkit-keyframes bugfix { from { position: relative; }
to { position: relative; } }
Side-by-side preview options styling. Thanks @adrexia for contributing.
2012-11-22 04:30:50 +01:00
MINOR Tree and content toolbar styling fixes (SSF-138, SSF-71)
2012-02-07 23:24:42 +01:00
/**
* This file defines most styles of the CMS: Colors, fonts, backgrounds,
* alignments, dimensions.
*
* Use SCSS variable definitions in screen.css to avoid repeating styles
* like background colours or padding dimensions. See themes/_default.scss
* to get started.
*
* To avoid this file getting too large and complicated, it is encouraged to
* create new SCSS files for larger components like the CMS menu or tree
* (see _tree.scss and _menu.scss).
*/
ENHANCEMENT New CMSPreviewable interface class to standardize metadata making a record previewable by the CMS. ENHANCEMENT New "preview" and "edit" buttons to toggle between preview and cms views. Reinstated utility links to switch between draft and live preview (based on SilverStripeNavigator) (formerly called "AjaxSwitchView")
2011-07-21 20:14:33 +02:00
/** ---------------------------------------------------- Core Styles. ---------------------------------------------------- */
BUGFIX: Remove stray scrolling and zooming glitches on iPad.
2012-03-15 02:13:30 +01:00
html, body { width: 100%; height: 100%; /* Removes RHS whitespace on iPad */ overflow-x: hidden; }
MINOR: css styles and formatting for left hand side menu bar. Altered the stylesheet structure to allow future admin scss theme files to be included easier
2011-05-20 01:29:40 +02:00
MINOR Cleaned up CMS dialog styling (now works with/without tabs, in iframe and inline markup), removed superfluous SCSS variable declarations
2012-01-03 17:38:11 +01:00
body.cms { overflow: hidden; }
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.cms a { color: #0073c1; text-decoration: none; }
.cms a:hover, .cms a:focus { text-decoration: underline; }
ENHANCEMENT New CMSPreviewable interface class to standardize metadata making a record previewable by the CMS. ENHANCEMENT New "preview" and "edit" buttons to toggle between preview and cms views. Reinstated utility links to switch between draft and live preview (based on SilverStripeNavigator) (formerly called "AjaxSwitchView")
2011-07-21 20:14:33 +02:00
.cms body .ui-widget { font-family: Arial, sans-serif; font-size: 12px; }
.cms strong { font-weight: bold; }
MINOR Added sapphire/admin/scss folder and started SCSS file architecture
2011-03-31 06:43:20 +02:00
ENHANCEMENT: implemented CMSPageHistoryController with comparsion view, single version view into new CMSMain interface
2011-08-22 06:44:41 +02:00
/** -------------------------------------------- Helpers -------------------------------------------- */
API Add action tabsets as a interface idiom. Introduces the concept of action tabsets - usage of TabSet and Tabs in between the action buttons to allow richer set of capabilities that can be offered to the user. Goes along with c8d0cdec99c95dbed3b58ebcc098cc9d22c58206 that implements a change to the CMS actions.
2012-11-21 22:01:02 +01:00
.hide, .cms-helper-hide-actions .Actions { display: none; }
BUGFIX: SSF-168 fixing Webkit rendering issue that would display elements outside of an absolute positioned layout, breaking the layout in the reportadmin section. The fix is to hide to container that breaks the layout and use js to move the required elements out of the container when the CMS needs them.
2012-04-10 02:41:19 +02:00
ENHANCEMENT New CMSPreviewable interface class to standardize metadata making a record previewable by the CMS. ENHANCEMENT New "preview" and "edit" buttons to toggle between preview and cms views. Reinstated utility links to switch between draft and live preview (based on SilverStripeNavigator) (formerly called "AjaxSwitchView")
2011-07-21 20:14:33 +02:00
/** -------------------------------------------- Panels Styles -------------------------------------------- */
NEW Side by side editing functionality - first cut (os#7412) Introduces a preview window that appears when the screen is wide enough, removes old preview button, adds a draft-public switch, adds variety of preview options which are not hooked up yet. Goes along with cms commit fa3738a9f4c5181eabf18a77ca89792d31592250
2012-11-22 02:14:11 +01:00
.cms-container { height: 100%; /*background: $tab-panel-texture-background;*/ background: #eceff1; }
MINOR Setting base font size for CMS
2011-04-05 11:06:56 +02:00
BUG: One too many brackets in _style.scss Caused when merging 3.0 back into master
2012-10-31 23:16:13 +01:00
.cms-preview, .cms-menu, .cms-content, .cms-content-header, .cms-content-tools, .cms-content-fields, .cms-edit-form, .cms-preview, .cms-preview iframe, .cms-preview-controls { display: -moz-inline-stack; display: inline-block; vertical-align: middle; *vertical-align: auto; zoom: 1; *display: inline; }
MINOR Removed debug comments from generated screen.css
2011-07-21 11:52:17 +02:00
Fixed Tab floating in CMS (fixes #1778) Removed inline-block from header elements which seems to cause the issues of tabs stacking on top of each other. Replaced header background to work on multiline scenarios Added bottom margin to breadcrumbs so they don't look cramped when tabs are floated below them. See https://github.com/silverstripe/silverstripe-framework/pull/1863, https://github.com/silverstripe/silverstripe-framework/issues/1943, https://groups.google.com/forum/?fromgroups#!topic/silverstripe-dev/c-W-ZxDlDuA, http://open.silverstripe.org/ticket/6882
2013-06-13 00:04:56 +02:00
.cms-content-header { padding-left: 16px; z-index: 60; min-height: 40px; background-image: url(../images/textures/cms_content_header.png); background-repeat: repeat; background-position: left bottom; background-color: #d4d6d8; }
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.cms-content-header a { color: #0073c1; }
MINOR:replaced back button icon with correct icon.
2012-03-14 23:09:14 +01:00
.cms-content-header .backlink span.btn-icon-back { height: 16px; }
Fixed Tab floating in CMS (fixes #1778) Removed inline-block from header elements which seems to cause the issues of tabs stacking on top of each other. Replaced header background to work on multiline scenarios Added bottom margin to breadcrumbs so they don't look cramped when tabs are floated below them. See https://github.com/silverstripe/silverstripe-framework/pull/1863, https://github.com/silverstripe/silverstripe-framework/issues/1943, https://groups.google.com/forum/?fromgroups#!topic/silverstripe-dev/c-W-ZxDlDuA, http://open.silverstripe.org/ticket/6882
2013-06-13 00:04:56 +02:00
.cms-content-header h2 { font-size: 14px; font-weight: bold; margin: 0; margin-bottom: 8px; }
.cms-content-header h2 * { vertical-align: middle; }
Ability to rotate the mobile preview in side-by-side preview.
2012-12-06 03:22:45 +01:00
.cms-content-header .cms-content-header-info { float: left; padding-top: 6px; }
Tab breadcrumbs floating (regression from #1778)
2013-06-17 01:26:04 +02:00
.cms-content-header .cms-content-header-info > * { display: inline-block; }
BUGFIX CMS Breadcrumbs and tabs as inline blocks which can span multiple lines, rather than being cropped off (fixes #6882)
2012-06-06 14:35:07 +02:00
.cms-content-header .ss-ui-button { line-height: 24px; }
.cms-content-header .ss-ui-button .ui-button-text { line-height: 1.4; }
MINOR:fixed bug with tabs - created more specific styling for the page view tabs so that they do not affect the tabs sitewide.
2012-02-17 00:40:19 +01:00
Side-by-side preview options styling. Thanks @adrexia for contributing.
2012-11-22 04:30:50 +01:00
.cms-edit-form.CMSMain { padding: 0; }
NEW Side by side editing functionality - first cut (os#7412) Introduces a preview window that appears when the screen is wide enough, removes old preview button, adds a draft-public switch, adds variety of preview options which are not hooked up yet. Goes along with cms commit fa3738a9f4c5181eabf18a77ca89792d31592250
2012-11-22 02:14:11 +01:00
API Refactor the CMS layouting to provide access to options. It is now possible to change the threeColumnLayout width options for the columns via entwine property LayoutOptions and accessor methods. Thanks @robert-h-curry, @clarkepaul for contributing!
2012-11-26 05:26:06 +01:00
.cms-container .column-hidden { display: none; }
MINOR Fixed button styling in CMS content header (tab styles not specific enough)
2012-02-28 15:57:39 +01:00
/** -------------------------------------------- Tabs -------------------------------------------- */
ENHANCEMENT Tab style consolidation and design consistency
2012-11-06 10:53:20 +01:00
.ui-tabs { padding: 0; background: none; }
.ui-tabs .ui-tabs { position: static; }
CMS CSS Minor Polishing Tweaks Fixed what I believe to be a few very minor CSS regressions, that appeared after the CSS restructure for the side-by-side preview. - Reverted background of the right panel (and tab active state) to the slightly darker shade (as per 3.0) to keep each of the 3 panels visually separate. - Slightly increased padding on ui-tabs-panel as felt a but too close for comfort. Had decreased since 3.0. - Decreased padding for logged in user name in menu, felt too excessive. (3.0 was neater) - Evened out padding above buttons in site tree sidebar Screenshots showing changes: 3.0: http://spdr.me/xauh 3.1 before commit: http://spdr.me/jkIe 3.1 after commit: http://spdr.me/IxtB
2013-03-12 23:43:33 +01:00
.ui-tabs .ui-tabs-panel { padding: 24px; background: transparent; border: 0; }
Side-by-side preview options styling. Thanks @adrexia for contributing.
2012-11-22 04:30:50 +01:00
.ui-tabs .ui-tabs-panel.cms-edit-form { padding: 0; }
Include padding on padded edit form panels inside a tabset
2013-03-28 16:23:43 +01:00
.ui-tabs .ui-tabs-panel.cms-panel-padded { padding: 16px 16px; }
ENHANCEMENT Tab style consolidation and design consistency
2012-11-06 10:53:20 +01:00
.ui-tabs .ui-widget-header { border: 0; background: none; }
Fixed panel spacing regressions from 544d2eb6 Specifically, the change removed the "add page" panel padding, because it moved padding from .cms-panel-padded into commonly contained elements, like .ui-tabs-panel. Apart from breaking layouts, it makes the class meaningless, since its only padded depending on which elements it contains. In order to rectify some introduced inconsistencies, much too complex were required, e.g. .ui-tabs .cms-edit-form, .ui-tabs .cms-content-fields {...}.
2012-12-17 15:13:43 +01:00
.ui-tabs .ui-tabs-nav { float: right; margin: 16px 0 -1px 0; padding: 0 12px 0 0; border-bottom: none; }
ENHANCEMENT Tab style consolidation and design consistency
2012-11-06 10:53:20 +01:00
.ui-tabs .ui-tabs-nav ~ .ui-tabs-panel { border-top: 1px solid #c0c0c2; clear: both; }
.ui-tabs .ui-tabs-nav li { top: 0; float: left; border-bottom: 0 !important; }
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.ui-tabs .ui-tabs-nav li a { display: -moz-inline-stack; display: inline-block; vertical-align: middle; *vertical-align: auto; zoom: 1; *display: inline; float: none; font-weight: bold; color: #444444; line-height: 32px; padding: 0 16px 0; }
Fixed tab alignment and padding See discussion at https://github.com/silverstripe/sapphire/pull/934#issuecomment-10136236
2012-11-07 12:41:01 +01:00
.ui-tabs .ui-tabs-nav li:last-child { margin-right: 0; }
ENHANCEMENT Tab style consolidation and design consistency
2012-11-06 10:53:20 +01:00
.ui-tabs .ui-tabs-nav .ui-state-default { border: 1px solid #c0c0c2; background: #ced7dc; }
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.ui-tabs .ui-tabs-nav .ui-state-default a { color: #5e5e5e; text-shadow: #e6e6e6 0 1px 0; }
Side-by-side preview options fixes. Add extra preview-mode selector to the CMS actions so we can show something when the preview is closed (and with it all options are not visible). Thanks @mateusz, @clarkepaul and @robert-h-curry for contributing.
2012-11-27 06:03:43 +01:00
.ui-tabs .ui-tabs-nav .ui-state-active { padding-bottom: 1px; border: 1px solid #c0c0c2; background-color: #eceff1; }
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.ui-tabs .ui-tabs-nav .ui-state-active a { color: #444444; }
ENHANCEMENT Tab style consolidation and design consistency
2012-11-06 10:53:20 +01:00
.ui-tabs .ui-tabs-nav.ui-state-active { border-color: gray; }
.ui-tabs .ui-tabs-nav li.cms-tabset-icon { text-indent: -9999em; }
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.ui-tabs .ui-tabs-nav li.cms-tabset-icon a { display: block; padding-left: 40px; padding-right: 0; }
Wider side panel to fit "add" and "edit" button Moved "edit tree" button into same DOM structure so we can layout them more easily through inline-block.
2012-12-17 11:27:24 +01:00
.ui-tabs .ui-tabs-nav li.cms-tabset-icon.list a { background: url('../images/sprites-64x64-s88957ee578.png') 0 -504px no-repeat; }
.ui-tabs .ui-tabs-nav li.cms-tabset-icon.tree a { background: url('../images/sprites-64x64-s88957ee578.png') 0 -354px no-repeat; }
.ui-tabs .ui-tabs-nav li.cms-tabset-icon.gallery a { background: url('../images/sprites-64x64-s88957ee578.png') 0 -454px no-repeat; }
.ui-tabs .ui-tabs-nav li.cms-tabset-icon.edit a { background: url('../images/sprites-64x64-s88957ee578.png') 0 -304px no-repeat; }
.ui-tabs .ui-tabs-nav li.cms-tabset-icon.search a { background: url('../images/sprites-64x64-s88957ee578.png') 0 -154px no-repeat; }
.ui-tabs .ui-tabs-nav li.cms-tabset-icon.list.ui-state-active a { background: url('../images/sprites-64x64-s88957ee578.png') 0 -204px no-repeat; }
.ui-tabs .ui-tabs-nav li.cms-tabset-icon.tree.ui-state-active a { background: url('../images/sprites-64x64-s88957ee578.png') 0 -254px no-repeat; }
.ui-tabs .ui-tabs-nav li.cms-tabset-icon.gallery.ui-state-active a { background: url('../images/sprites-64x64-s88957ee578.png') 0 -54px no-repeat; }
.ui-tabs .ui-tabs-nav li.cms-tabset-icon.edit.ui-state-active a { background: url('../images/sprites-64x64-s88957ee578.png') 0 -404px no-repeat; }
.ui-tabs .ui-tabs-nav li.cms-tabset-icon.search.ui-state-active a { background: url('../images/sprites-64x64-s88957ee578.png') 0 -104px no-repeat; }
Fixed panel spacing regressions from 544d2eb6 Specifically, the change removed the "add page" panel padding, because it moved padding from .cms-panel-padded into commonly contained elements, like .ui-tabs-panel. Apart from breaking layouts, it makes the class meaningless, since its only padded depending on which elements it contains. In order to rectify some introduced inconsistencies, much too complex were required, e.g. .ui-tabs .cms-edit-form, .ui-tabs .cms-content-fields {...}.
2012-12-17 15:13:43 +01:00
.ui-tabs .cms-panel-padded .ui-tabs-panel { padding: 0; }
Fixed tab alignment and padding See discussion at https://github.com/silverstripe/sapphire/pull/934#issuecomment-10136236
2012-11-07 12:41:01 +01:00
.ui-tabs .cms-panel-padded .ui-tabs-panel .ui-tabs-panel { padding: 8px 0 0 0; }
Fixed panel spacing regressions from 544d2eb6 Specifically, the change removed the "add page" panel padding, because it moved padding from .cms-panel-padded into commonly contained elements, like .ui-tabs-panel. Apart from breaking layouts, it makes the class meaningless, since its only padded depending on which elements it contains. In order to rectify some introduced inconsistencies, much too complex were required, e.g. .ui-tabs .cms-edit-form, .ui-tabs .cms-content-fields {...}.
2012-12-17 15:13:43 +01:00
.ui-tabs .cms-panel-padded .Actions { padding: 0; }
ENHANCEMENT Tab style consolidation and design consistency
2012-11-06 10:53:20 +01:00
.ui-tabs.ss-tabset-tabshidden .ui-tabs-panel { border-top: none; }
/** Primary styles which sit on top of screen, with different tab colors. TODO Only use one "primary" selector and fix HTMLEditorField TabSet addExtraClass() */
Fixed panel spacing regressions from 544d2eb6 Specifically, the change removed the "add page" panel padding, because it moved padding from .cms-panel-padded into commonly contained elements, like .ui-tabs-panel. Apart from breaking layouts, it makes the class meaningless, since its only padded depending on which elements it contains. In order to rectify some introduced inconsistencies, much too complex were required, e.g. .ui-tabs .cms-edit-form, .ui-tabs .cms-content-fields {...}.
2012-12-17 15:13:43 +01:00
.ui-tabs.cms-tabset-primary .ui-tabs-nav, .ui-tabs .ui-tabs-nav.cms-tabset-nav-primary, .ui-tabs .cms-content-header-tabs .ui-tabs-nav { margin-top: 0; border-left: 1px solid #b3b3b3; float: none; }
Side-by-side preview options styling. Thanks @adrexia for contributing.
2012-11-22 04:30:50 +01:00
.ui-tabs.cms-tabset-primary .ui-tabs-nav li, .ui-tabs .ui-tabs-nav.cms-tabset-nav-primary li, .ui-tabs .cms-content-header-tabs .ui-tabs-nav li { margin-right: 0; margin-top: 0; }
Side-by-side preview options fixes. Add extra preview-mode selector to the CMS actions so we can show something when the preview is closed (and with it all options are not visible). Thanks @mateusz, @clarkepaul and @robert-h-curry for contributing.
2012-11-27 06:03:43 +01:00
.ui-tabs.cms-tabset-primary .ui-tabs-nav li a, .ui-tabs .ui-tabs-nav.cms-tabset-nav-primary li a, .ui-tabs .cms-content-header-tabs .ui-tabs-nav li a { margin: 0; line-height: 39px; }
Side-by-side preview options styling. Thanks @adrexia for contributing.
2012-11-22 04:30:50 +01:00
.ui-tabs.cms-tabset-primary .ui-tabs-nav .ui-corner-all, .ui-tabs.cms-tabset-primary .ui-tabs-nav .ui-corner-top, .ui-tabs.cms-tabset-primary .ui-tabs-nav .ui-corner-right, .ui-tabs.cms-tabset-primary .ui-tabs-nav .ui-corner-tr, .ui-tabs.cms-tabset-primary .ui-tabs-nav .ui-corner-tl, .ui-tabs .ui-tabs-nav.cms-tabset-nav-primary .ui-corner-all, .ui-tabs .ui-tabs-nav.cms-tabset-nav-primary .ui-corner-top, .ui-tabs .ui-tabs-nav.cms-tabset-nav-primary .ui-corner-right, .ui-tabs .ui-tabs-nav.cms-tabset-nav-primary .ui-corner-tr, .ui-tabs .ui-tabs-nav.cms-tabset-nav-primary .ui-corner-tl, .ui-tabs .cms-content-header-tabs .ui-tabs-nav .ui-corner-all, .ui-tabs .cms-content-header-tabs .ui-tabs-nav .ui-corner-top, .ui-tabs .cms-content-header-tabs .ui-tabs-nav .ui-corner-right, .ui-tabs .cms-content-header-tabs .ui-tabs-nav .ui-corner-tr, .ui-tabs .cms-content-header-tabs .ui-tabs-nav .ui-corner-tl { border-radius: 0; }
.ui-tabs.cms-tabset-primary .ui-tabs-nav .ui-state-default, .ui-tabs .ui-tabs-nav.cms-tabset-nav-primary .ui-state-default, .ui-tabs .cms-content-header-tabs .ui-tabs-nav .ui-state-default { -webkit-box-shadow: rgba(201, 205, 206, 0.8) 0 0 2px; -moz-box-shadow: rgba(201, 205, 206, 0.8) 0 0 2px; box-shadow: rgba(201, 205, 206, 0.8) 0 0 2px; background-color: #b0bec7; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2Q0ZGJlMCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2IwYmVjNyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d4dbe0), color-stop(100%, #b0bec7)); background-image: -webkit-linear-gradient(#d4dbe0, #b0bec7); background-image: -moz-linear-gradient(#d4dbe0, #b0bec7); background-image: -o-linear-gradient(#d4dbe0, #b0bec7); background-image: linear-gradient(#d4dbe0, #b0bec7); border-top: none; border-right-color: #8399a7; border-left-color: #ced7dc; }
CMS CSS Minor Polishing Tweaks Fixed what I believe to be a few very minor CSS regressions, that appeared after the CSS restructure for the side-by-side preview. - Reverted background of the right panel (and tab active state) to the slightly darker shade (as per 3.0) to keep each of the 3 panels visually separate. - Slightly increased padding on ui-tabs-panel as felt a but too close for comfort. Had decreased since 3.0. - Decreased padding for logged in user name in menu, felt too excessive. (3.0 was neater) - Evened out padding above buttons in site tree sidebar Screenshots showing changes: 3.0: http://spdr.me/xauh 3.1 before commit: http://spdr.me/jkIe 3.1 after commit: http://spdr.me/IxtB
2013-03-12 23:43:33 +01:00
.ui-tabs.cms-tabset-primary .ui-tabs-nav .ui-state-active, .ui-tabs .ui-tabs-nav.cms-tabset-nav-primary .ui-state-active, .ui-tabs .cms-content-header-tabs .ui-tabs-nav .ui-state-active { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; background: #e6eaed; border-top: none; border-right-color: #b3b3b3; border-left-color: #eceff1; z-index: 2; }
Side-by-side preview options fixes. Add extra preview-mode selector to the CMS actions so we can show something when the preview is closed (and with it all options are not visible). Thanks @mateusz, @clarkepaul and @robert-h-curry for contributing.
2012-11-27 06:03:43 +01:00
.ui-tabs.cms-tabset-primary .ui-tabs-nav .ui-state-active a, .ui-tabs .ui-tabs-nav.cms-tabset-nav-primary .ui-state-active a, .ui-tabs .cms-content-header-tabs .ui-tabs-nav .ui-state-active a { border-bottom: none; }
ENHANCEMENT Tab style consolidation and design consistency
2012-11-06 10:53:20 +01:00
Fixed tab alignment and padding See discussion at https://github.com/silverstripe/sapphire/pull/934#issuecomment-10136236
2012-11-07 12:41:01 +01:00
.cms-content-header-tabs { float: right; }
MINOR: Tweaked the main tab styling to fix the background and make text more readable.
2012-05-12 07:38:37 +02:00
ENHANCEMENT: implemented CMSPageHistoryController with comparsion view, single version view into new CMSMain interface
2011-08-22 06:44:41 +02:00
/** ------------------------------------------------------- Loading Interface ------------------------------------------------------- */
MINOR Improved CMS loading spinner visibility by enforcing a higher z-index in its own element
2011-12-14 17:13:33 +01:00
.cms-content-loading-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 9998; }
ENHANCEMENT Consistently wrapping CMS forms in <div class="cms-content">, added LeftAndMain.Content.js to reload panels via ajax, hooking into preview logic
2011-05-20 01:38:36 +02:00
MINOR Improved CMS loading spinner visibility by enforcing a higher z-index in its own element
2011-12-14 17:13:33 +01:00
.cms-content-loading-spinner { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 9999; background: url(../images/spinner.gif) no-repeat 50% 50%; }
MINOR Fixed content loading overlay in CMS
2011-10-29 12:31:56 +02:00
MINOR: styles for the top tabs in the main cms. #css
2011-06-10 03:37:54 +02:00
/** ----------------------------------------------- Loading Screen ------------------------------------------------ */
MINOR Fixed IE6 compat note styling
2011-12-15 16:54:33 +01:00
.ss-loading-screen { width: 100%; height: 100%; overflow: hidden; position: absolute; z-index: 100000; background: #fff; background: -moz-radial-gradient(50% 50% 180deg, circle cover, white, #efefef, #c7c7c7 100%); background: -webkit-gradient(radial, 50% 50%, 350, 50% 50%, 0, from(#e3e3e3), to(white)); }
ENHANCEMENT general css enhancements Remove arrow from sitetree next to site name #7972 Remove 1px gap from above main tabs and enhance css Replace loading logo Adjust main link colour to have more contrast Add more contrast to main edit panel - made bg slightly lighter
2012-11-05 05:51:38 +01:00
.ss-loading-screen .loading-logo { width: 100%; height: 100%; overflow: hidden; position: absolute; background: transparent url(../images/silverstripe_logo.png) no-repeat 50% 50%; }
MINOR Fixed IE6 compat note styling
2011-12-15 16:54:33 +01:00
.ss-loading-screen p { width: 100%; text-align: center; position: absolute; bottom: 80px; z-index: 100001; }
MINOR Updating compass sprites with its changed ordering starting with 0.12 release (see http://compass-style.org/blog/2012/02/01/compass-0-12-is-released/)
2012-06-03 23:22:29 +02:00
.ss-loading-screen p span.notice { width: 300px; font-size: 14px; padding: 10px 20px; color: #dc7f00; border: none; background: none; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; display: inline-block; zoom: 1; *display: inline; }
MINOR Added sapphire/admin/scss folder and started SCSS file architecture
2011-03-31 06:43:20 +02:00
.ss-loading-screen .loading-animation { display: none; position: absolute; left: 49%; top: 75%; }
ENHANCEMENT Using SCSS variables for colour definitions in CMS, setting to greyscale theme for now in order to communicate the early status of the UI work
2011-04-19 06:34:30 +02:00
MINOR Cleaned up structure and documentation of SCSS files in sapphire/admin/scss
2011-07-07 07:34:55 +02:00
/** -------------------------------------------- Actions -------------------------------------------- */
Ability to rotate the mobile preview in side-by-side preview.
2012-12-06 03:22:45 +01:00
.cms-content-actions, .cms-preview-controls { margin: 0; padding: 12px 12px; z-index: 0; border-top: 1px solid #cacacc; -webkit-box-shadow: 1px 0 0 #eceff1, rgba(248, 248, 248, 0.9) 0 1px 0px inset, rgba(201, 205, 206, 0.8) 0 0 1px; -moz-box-shadow: 1px 0 0 #eceff1, rgba(248, 248, 248, 0.9) 0 1px 0px inset, rgba(201, 205, 206, 0.8) 0 0 1px; box-shadow: 1px 0 0 #eceff1, rgba(248, 248, 248, 0.9) 0 1px 0px inset, rgba(201, 205, 206, 0.8) 0 0 1px; height: 28px; background-color: #eceff1; }
MINOR: css styles and formatting for left hand side menu bar. Altered the stylesheet structure to allow future admin scss theme files to be included easier
2011-05-20 01:29:40 +02:00
MINOR Cleaned up structure and documentation of SCSS files in sapphire/admin/scss
2011-07-07 07:34:55 +02:00
/** -------------------------------------------- Messages -------------------------------------------- */
Filter notice styling and panel adjustments * Based on @clarkepaul's commit here: https://github.com/silverstripe-droptables/sapphire/commit/e5de6c06489f3 449ee8131bf4ee2a4e1b2380bee * Kept margin adjustments, but avoided implementing tab changes, as tabs have chnaged a lot since original commit
2013-06-04 02:11:05 +02:00
.message { display: block; clear: both; margin: 0 0 8px; padding: 10px 12px; font-weight: normal; border: 1px #ccc solid; background: #fff; background: rgba(255, 255, 255, 0.5); text-shadow: none; -webkit-border-radius: 3px 3px 3px 3px; -moz-border-radius: 3px 3px 3px 3px; -ms-border-radius: 3px 3px 3px 3px; -o-border-radius: 3px 3px 3px 3px; border-radius: 3px 3px 3px 3px; }
ENHANCEMENT Message colours updated
2012-11-06 01:23:20 +01:00
.message.notice { background-color: #f0f8fc; border-color: #93cde8; }
.message.warning { background-color: #fefbde; border-color: #e9d104; }
.message.error, .message.bad, .message.required, .message.validation { background-color: #fae8e9; border-color: #e68288; }
.message.good { background-color: #eaf6e4; border-color: #72c34b; }
MINOR Fixed merge errors from 'history-panel' branch
2011-09-19 21:01:17 +02:00
.message p { margin: 0; }
ENHANCEMENT Using SCSS variables for colour definitions in CMS, setting to greyscale theme for now in order to communicate the early status of the UI work
2011-04-19 06:34:30 +02:00
Fixed panel spacing regressions from 544d2eb6 Specifically, the change removed the "add page" panel padding, because it moved padding from .cms-panel-padded into commonly contained elements, like .ui-tabs-panel. Apart from breaking layouts, it makes the class meaningless, since its only padded depending on which elements it contains. In order to rectify some introduced inconsistencies, much too complex were required, e.g. .ui-tabs .cms-edit-form, .ui-tabs .cms-content-fields {...}.
2012-12-17 15:13:43 +01:00
.cms-edit-form .message { margin: 16px; }
BUG CMS messages touch the bottom of the inputs making spacing even: http://screencast.com/t/oYHnG1Bj
2013-02-20 10:48:40 +01:00
.cms-edit-form .ui-tabs-panel .message { margin: 16px 0; }
Side-by-side preview options styling. Thanks @adrexia for contributing.
2012-11-22 04:30:50 +01:00
BUGFIX: Consistently style custom defined page icons. * Apply page icon styling to .page-icon, rather than specific elements.
2012-06-13 09:46:22 +02:00
/** -------------------------------------------- Page icons -------------------------------------------- */
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.page-icon, a .jstree-pageicon { display: block; width: 16px; height: 16px; background: transparent url(../images/sitetree_ss_pageclass_icons_default.png) no-repeat; }
BUGFIX: Consistently style custom defined page icons. * Apply page icon styling to .page-icon, rather than specific elements.
2012-06-13 09:46:22 +02:00
.page-icon.class-HomePage { background-position: 0 -48px; }
.page-icon.class-RedirectorPage { background-position: 0 -16px; }
.page-icon.class-VirtualPage { background-position: 0 -32px; }
.page-icon.class-ErrorPage { background-position: 0 -112px; }
MINOR Cleaned up structure and documentation of SCSS files in sapphire/admin/scss
2011-07-07 07:34:55 +02:00
/** -------------------------------------------- "Add page" dialog -------------------------------------------- */
MINOR Improved perceived UI feedback by hiding various elements until they're styled properly (TinyMCE, tree)
2011-12-14 16:54:52 +01:00
.cms-page-add-form-dialog { display: none; }
MINOR Improved .cms-add-form styling
2012-01-05 12:30:29 +01:00
BUGFIX: colour Adjustments Change the constructive button colour to match the colour used in the designs, and fixed up calculations to produce the correct button colour.
2012-05-08 04:15:09 +02:00
.cms-add-form .step-label { opacity: 0.9; }
BUGFIX:adjusted padding so that content aligns properly on the add page panel Trac #6990
2012-03-27 16:54:25 +02:00
.cms-add-form .step-label .flyout { height: 17px; padding-top: 5px; }
.cms-add-form .step-label .title { padding-top: 5px; font-weight: bold; text-shadow: 1px 1px 0 white; }
FIX make sure select dropdowns in add page dialog aren't cut off due to .parent-mode class having overflow:auto
2013-06-19 01:27:22 +02:00
.cms-add-form ul.SelectionGroup { padding-left: 28px; overflow: visible; *zoom: 1; }
.cms-add-form ul.SelectionGroup:after { content: "\0020"; display: block; height: 0; clear: both; overflow: hidden; visibility: hidden; }
MINOR Padding for "parent mode" radio buttons on "add page" panel
2012-03-12 10:53:51 +01:00
.cms-add-form .parent-mode { padding: 8px; overflow: auto; }
NEW Side by side editing functionality - first cut (os#7412) Introduces a preview window that appears when the screen is wide enough, removes old preview button, adds a draft-public switch, adds variety of preview options which are not hooked up yet. Goes along with cms commit fa3738a9f4c5181eabf18a77ca89792d31592250
2012-11-22 02:14:11 +01:00
FIX: Update references to ID values from 79c9433
2013-05-26 01:11:05 +02:00
#Form_AddForm_PageType_Holder ul { padding-left: 20px; }
#Form_AddForm_PageType_Holder ul li { float: none; width: 100%; padding: 9px 0 9px 15px; overflow: hidden; border-bottom-width: 2px; border-bottom: 2px groove rgba(255, 255, 255, 0.8); -webkit-border-image: url(../images/textures/bg_fieldset_elements_border.png) 2 stretch stretch; border-image: url(../images/textures/bg_fieldset_elements_border.png) 2 stretch stretch; }
#Form_AddForm_PageType_Holder ul li:last-child { border-bottom: none; }
#Form_AddForm_PageType_Holder ul li:hover, #Form_AddForm_PageType_Holder ul li.selected { background-color: rgba(255, 255, 102, 0.3); }
#Form_AddForm_PageType_Holder ul li.disabled { color: #aaaaaa; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50); opacity: 0.5; }
#Form_AddForm_PageType_Holder ul li.disabled:hover { background: none; }
#Form_AddForm_PageType_Holder ul li input { margin: inherit; }
#Form_AddForm_PageType_Holder ul li label { padding-left: 0; padding-bottom: 0; }
#Form_AddForm_PageType_Holder ul li input, #Form_AddForm_PageType_Holder ul li label, #Form_AddForm_PageType_Holder ul li .page-icon, #Form_AddForm_PageType_Holder ul li .title { float: left; line-height: 1.3em; }
#Form_AddForm_PageType_Holder ul li .page-icon { margin: 0 4px; }
#Form_AddForm_PageType_Holder ul li .title { width: 120px; font-weight: bold; padding-right: 10px; }
#Form_AddForm_PageType_Holder ul li .description { font-style: italic; display: inline; clear: none; margin: 0; }
MINOR Misc style improvements around batch actions and content tools display
2011-04-24 01:05:59 +02:00
MINOR Cleaned up structure and documentation of SCSS files in sapphire/admin/scss
2011-07-07 07:34:55 +02:00
/** -------------------------------------------- Content toolbar -------------------------------------------- */
Filter notice styling and panel adjustments * Based on @clarkepaul's commit here: https://github.com/silverstripe-droptables/sapphire/commit/e5de6c06489f3 449ee8131bf4ee2a4e1b2380bee * Kept margin adjustments, but avoided implementing tab changes, as tabs have chnaged a lot since original commit
2013-06-04 02:11:05 +02:00
.cms-content-toolbar { min-height: 29px; display: block; margin: 0 0 12px 0; padding-bottom: 0; border-bottom: 1px solid #d0d3d5; -webkit-box-shadow: 0 1px 0 rgba(248, 248, 248, 0.9); -moz-box-shadow: 0 1px 0 rgba(248, 248, 248, 0.9); -o-box-shadow: 0 1px 0 rgba(248, 248, 248, 0.9); box-shadow: 0 1px 0 rgba(248, 248, 248, 0.9); *zoom: 1; /* smaller treedropdown */ }
ENHANCEMENT New CMSPreviewable interface class to standardize metadata making a record previewable by the CMS. ENHANCEMENT New "preview" and "edit" buttons to toggle between preview and cms views. Reinstated utility links to switch between draft and live preview (based on SilverStripeNavigator) (formerly called "AjaxSwitchView")
2011-07-21 20:14:33 +02:00
.cms-content-toolbar:after { content: "\0020"; display: block; height: 0; clear: both; overflow: hidden; visibility: hidden; }
MINOR:fixed the positioning of the viewmode (drag and drop, mulitiselect) on the pages treeview
2012-02-28 21:44:11 +01:00
.cms-content-toolbar .cms-tree-view-modes { float: right; padding-top: 5px; }
MINOR Misc style improvements around batch actions and content tools display
2011-04-24 01:05:59 +02:00
.cms-content-toolbar .cms-tree-view-modes * { display: inline-block; }
ENHANCEMENT general css enhancements Remove arrow from sitetree next to site name #7972 Remove 1px gap from above main tabs and enhance css Replace loading logo Adjust main link colour to have more contrast Add more contrast to main edit panel - made bg slightly lighter
2012-11-05 05:51:38 +01:00
.cms-content-toolbar .cms-tree-view-modes * label { color: #0073c1; }
BUG: One too many brackets in _style.scss Caused when merging 3.0 back into master
2012-10-31 23:16:13 +01:00
.cms-content-toolbar .chzn-container-single .chzn-single { height: 26px; line-height: 26px; padding-left: 25px; color: #576468; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2U2ZTZlNiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2NkY2RjZCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e6e6e6), color-stop(100%, #cdcdcd)); background-image: -webkit-linear-gradient(#e6e6e6, #cdcdcd); background-image: -moz-linear-gradient(#e6e6e6, #cdcdcd); background-image: -o-linear-gradient(#e6e6e6, #cdcdcd); background-image: linear-gradient(#e6e6e6, #cdcdcd); font-size: 13px; font-weight: bold; text-shadow: #e6e6e6 0 -1px 1px; box-shadow: none; }
.cms-content-toolbar .chzn-container-single .chzn-single:hover { -webkit-box-shadow: 0 0 5px #b3b3b3; -moz-box-shadow: 0 0 5px #b3b3b3; box-shadow: 0 0 5px #b3b3b3; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ViZWJlYiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2QyZDJkMiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ebebeb), color-stop(100%, #d2d2d2)); background-image: -webkit-linear-gradient(#ebebeb, #d2d2d2); background-image: -moz-linear-gradient(#ebebeb, #d2d2d2); background-image: -o-linear-gradient(#ebebeb, #d2d2d2); background-image: linear-gradient(#ebebeb, #d2d2d2); }
MINOR Updating compass sprites with its changed ordering starting with 0.12 release (see http://compass-style.org/blog/2012/02/01/compass-0-12-is-released/)
2012-06-03 23:22:29 +02:00
.cms-content-toolbar .chzn-container-single .chzn-single:active { -webkit-box-shadow: inset 0 1px 3px #4d4d4d; -moz-box-shadow: inset 0 1px 3px #4d4d4d; box-shadow: inset 0 1px 3px #4d4d4d; }
MINOR Tree and content toolbar styling fixes (SSF-138, SSF-71)
2012-02-07 23:24:42 +01:00
.cms-content-toolbar .chzn-container-single .chzn-single span { padding-top: 1px; }
Batch actions styling * Removed cog icon (usually associated with settings), and tidied up padding (based on @clarkepaul's commit: https://github.com/silverstripe-droptables/sapphire/commit/b09cd5f7f8e73 4df1f7ca0d387a5b97a03a3b604)
2013-06-04 02:48:51 +02:00
.cms-content-toolbar .chzn-container-single .chzn-single div { border-left: none; width: 100%; }
ENHANCEMENT Using native jQuery UI buttons and icon styling for a less coupled implementation (e.g. assuming that a "constructive" button always has a specific icon, or one at all). All CMS UI buttons switched to use <button> markup, which allows for inline icons and correctly aligned multi-line button labels.
2012-02-17 00:35:10 +01:00
.cms-content-toolbar .chzn-container-single .chzn-single div b { background: url(../images/sprites-32x32/menu-arrow-deselected-down.png) no-repeat 9px 11px; float: right; width: 24px; }
Side-by-side preview options styling. Thanks @adrexia for contributing.
2012-11-22 04:30:50 +01:00
.cms-content-toolbar .ss-ui-button { margin-bottom: 8px; }
MINOR Added temporary 'preview' header
2011-04-24 01:41:21 +02:00
ENHANCEMENT New CMSPreviewable interface class to standardize metadata making a record previewable by the CMS. ENHANCEMENT New "preview" and "edit" buttons to toggle between preview and cms views. Reinstated utility links to switch between draft and live preview (based on SilverStripeNavigator) (formerly called "AjaxSwitchView")
2011-07-21 20:14:33 +02:00
/* -------------------------------------------------------- Content Tools is the sidebar on the left of the main content panel */
Wider side panel to fit "add" and "edit" button Moved "edit tree" button into same DOM structure so we can layout them more easily through inline-block.
2012-12-17 11:27:24 +01:00
.cms-content-tools { background: #eceff1; width: 200px; overflow-y: auto; overflow-x: hidden; z-index: 70; border-right: 1px solid #c0c0c2; -webkit-box-shadow: rgba(248, 248, 248, 0.9) -1px 0 0 inset, 0 0 1px rgba(201, 205, 206, 0.8); -moz-box-shadow: rgba(248, 248, 248, 0.9) -1px 0 0 inset, 0 0 1px rgba(201, 205, 206, 0.8); box-shadow: rgba(248, 248, 248, 0.9) -1px 0 0 inset, 0 0 1px rgba(201, 205, 206, 0.8); float: left; position: relative; }
MINOR Fixed style sprites broken by pull request #402
2012-05-08 00:43:25 +02:00
.cms-content-tools.filter { padding: 0 !important; }
Filter notice styling and panel adjustments * Based on @clarkepaul's commit here: https://github.com/silverstripe-droptables/sapphire/commit/e5de6c06489f3 449ee8131bf4ee2a4e1b2380bee * Kept margin adjustments, but avoided implementing tab changes, as tabs have chnaged a lot since original commit
2013-06-04 02:11:05 +02:00
.cms-content-tools .cms-panel-header { clear: both; margin: 10px 0 7px; padding-bottom: 2px; line-height: 24px; border-bottom: 1px solid #d0d3d5; -webkit-box-shadow: 0 1px 0 rgba(248, 248, 248, 0.9); -moz-box-shadow: 0 1px 0 rgba(248, 248, 248, 0.9); -o-box-shadow: 0 1px 0 rgba(248, 248, 248, 0.9); box-shadow: 0 1px 0 rgba(248, 248, 248, 0.9); }
CMS CSS Minor Polishing Tweaks Fixed what I believe to be a few very minor CSS regressions, that appeared after the CSS restructure for the side-by-side preview. - Reverted background of the right panel (and tab active state) to the slightly darker shade (as per 3.0) to keep each of the 3 panels visually separate. - Slightly increased padding on ui-tabs-panel as felt a but too close for comfort. Had decreased since 3.0. - Decreased padding for logged in user name in menu, felt too excessive. (3.0 was neater) - Evened out padding above buttons in site tree sidebar Screenshots showing changes: 3.0: http://spdr.me/xauh 3.1 before commit: http://spdr.me/jkIe 3.1 after commit: http://spdr.me/IxtB
2013-03-12 23:43:33 +01:00
.cms-content-tools .cms-panel-content { width: 184px; padding: 8.8px 8px 0; overflow: auto; height: 100%; }
MINOR Install screen visual tweaks, more visible disabled state on install button, conditional version number (to avoid it showing without a version), referencing new theme in install screen, using new layout in install progress screen as well
2012-04-11 16:49:31 +02:00
.cms-content-tools .cms-panel-content .Actions .ss-ui-action-constructive { margin-right: 5px; }
BUG: One too many brackets in _style.scss Caused when merging 3.0 back into master
2012-10-31 23:16:13 +01:00
.cms-content-tools .cms-content-header { background-color: #748d9d; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2IwYmVjNyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzc0OGQ5ZCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #b0bec7), color-stop(100%, #748d9d)); background-image: -webkit-linear-gradient(#b0bec7, #748d9d); background-image: -moz-linear-gradient(#b0bec7, #748d9d); background-image: -o-linear-gradient(#b0bec7, #748d9d); background-image: linear-gradient(#b0bec7, #748d9d); }
BUGFIXES: File Uploads * Add arrows back to edit-all toggle button * Don't show dimensions if the item being inserted doesn't have them. * Set pop-up windows to be a percentage of the window height for better use of space * Fix broken fieldholdersmall styling within files edit * Add placeholder if no preview *Take out minFileSize so upload will work on Android phones
2012-06-08 06:42:14 +02:00
.cms-content-tools .cms-content-header h2 { text-shadow: #5c7382 -1px -1px 0; width: 176px; color: white; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; -o-text-overflow: ellipsis; }
ENHANCEMENT New CMSPreviewable interface class to standardize metadata making a record previewable by the CMS. ENHANCEMENT New "preview" and "edit" buttons to toggle between preview and cms views. Reinstated utility links to switch between draft and live preview (based on SilverStripeNavigator) (formerly called "AjaxSwitchView")
2011-07-21 20:14:33 +02:00
.cms-content-tools h3, .cms-content-tools h4, .cms-content-tools h5 { font-weight: bold; line-height: 16px; }
.cms-content-tools h3 { font-size: 13px; }
BUGFIX:Trac #6854 / #7115 - fixed styling issues with filter panel across CMS - fixed the issue with the width of the date fields - aligned action buttons in filter panel with the designs.
2012-04-11 06:00:56 +02:00
.cms-content-tools h4 { font-size: 12px; margin: 5px 0; }
MINOR: #css styles to clean up vertical alignment in content tools
2011-08-16 04:57:30 +02:00
.cms-content-tools .ui-widget-content { background: none; }
MINOR Tree and content toolbar styling fixes (SSF-138, SSF-71)
2012-02-07 23:24:42 +01:00
.cms-content-tools .field { /* Fields are more compressed in the sidebar compared to the main content editing window so the below alters the internal spacing of the fields so we can move that spacing to between the form fields rather than padding */ }
MINOR: #css styles to clean up vertical alignment in content tools
2011-08-16 04:57:30 +02:00
.cms-content-tools .field label { float: none; width: auto; font-size: 11px; padding: 0 8px 4px 0; }
.cms-content-tools .field .middleColumn { margin: 0; }
ENHANCEMENT: implemented CMSPageHistoryController with comparsion view, single version view into new CMSMain interface
2011-08-22 06:44:41 +02:00
.cms-content-tools .field input.text, .cms-content-tools .field select, .cms-content-tools .field textarea { padding: 5px; font-size: 11px; }
Side-by-side preview options fixes. Add extra preview-mode selector to the CMS actions so we can show something when the preview is closed (and with it all options are not visible). Thanks @mateusz, @clarkepaul and @robert-h-curry for contributing.
2012-11-27 06:03:43 +01:00
.cms-content-tools .field.checkbox { padding: 0 0 8px; }
ENHANCEMENT: implemented CMSPageHistoryController with comparsion view, single version view into new CMSMain interface
2011-08-22 06:44:41 +02:00
.cms-content-tools .field.checkbox input { margin: 2px 0; }
Removed arbitrary width restrictions on field group children Let the fields handle their dimensions themselves (for example the "from" and "to" date fields in the CMS pages search form)
2012-08-27 15:50:21 +02:00
.cms-content-tools .fieldgroup .fieldgroup-field { padding: 0; }
ENHANCEMENT New CMSPreviewable interface class to standardize metadata making a record previewable by the CMS. ENHANCEMENT New "preview" and "edit" buttons to toggle between preview and cms views. Reinstated utility links to switch between draft and live preview (based on SilverStripeNavigator) (formerly called "AjaxSwitchView")
2011-07-21 20:14:33 +02:00
.cms-content-tools .fieldgroup .fieldgroup-field .field { margin: 0; padding: 0; }
ENHANCEMENT: implemented CMSPageHistoryController with comparsion view, single version view into new CMSMain interface
2011-08-22 06:44:41 +02:00
.cms-content-tools table { margin: 8px -4px; }
.cms-content-tools table thead th { color: #1f1f1f; font-weight: bold; line-height: 16px; font-size: 11px; padding: 4px; }
.cms-content-tools table tr.active { background-color: #338dc1; color: white; }
MINOR Updating compass sprites with its changed ordering starting with 0.12 release (see http://compass-style.org/blog/2012/02/01/compass-0-12-is-released/)
2012-06-03 23:22:29 +02:00
.cms-content-tools table tr.active td.first-column { -webkit-border-radius: 6px 0 0 6px; -moz-border-radius: 6px 0 0 6px; -ms-border-radius: 6px 0 0 6px; -o-border-radius: 6px 0 0 6px; border-radius: 6px 0 0 6px; }
.cms-content-tools table tr.active td.last-column { -webkit-border-radius: 0 6px 6px 0; -moz-border-radius: 0 6px 6px 0; -ms-border-radius: 0 6px 6px 0; -o-border-radius: 0 6px 6px 0; border-radius: 0 6px 6px 0; }
ENHANCEMENT: implemented CMSPageHistoryController with comparsion view, single version view into new CMSMain interface
2011-08-22 06:44:41 +02:00
.cms-content-tools table td { padding: 4px; line-height: 16px; vertical-align: top; }
.cms-content-tools td { border-bottom: 1px solid #ced7dc; padding: 7px 2px; font-size: 11px; }
MINOR IE compatibility fixes in new admin CSS
2011-07-07 08:01:25 +02:00
Filter notice styling and panel adjustments * Based on @clarkepaul's commit here: https://github.com/silverstripe-droptables/sapphire/commit/e5de6c06489f3 449ee8131bf4ee2a4e1b2380bee * Kept margin adjustments, but avoided implementing tab changes, as tabs have chnaged a lot since original commit
2013-06-04 02:11:05 +02:00
/** ------------------------------------------------------------------
* CMS notice, used for filter messages, but generic enough to use elsewhere
* ----------------------------------------------------------------- */
.cms-notice { display: block; margin: 0 0 8px; padding: 10px 12px; font-weight: normal; border: 1px #d0d3d5 solid; background: #fff; background: rgba(255, 255, 255, 0.5); text-shadow: none; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; }
MINOR: #css styles to clean up vertical alignment in content tools
2011-08-16 04:57:30 +02:00
/** CMS Batch actions */
Wider side panel to fit "add" and "edit" button Moved "edit tree" button into same DOM structure so we can layout them more easily through inline-block.
2012-12-17 11:27:24 +01:00
.cms-content-batchactions { float: left; position: relative; display: block; }
Batch actions styling * Removed cog icon (usually associated with settings), and tidied up padding (based on @clarkepaul's commit: https://github.com/silverstripe-droptables/sapphire/commit/b09cd5f7f8e73 4df1f7ca0d387a5b97a03a3b604)
2013-06-04 02:48:51 +02:00
.cms-content-batchactions .view-mode-batchactions-wrapper { height: 18px; float: left; padding: 4px 6px; border: 1px solid #aaa; margin-bottom: 8px; margin-right: -1px; background-color: #D9D9D9; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2Q5ZDlkOSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(100%, #d9d9d9)); background-image: -webkit-linear-gradient(top, #ffffff, #d9d9d9); background-image: -moz-linear-gradient(top, #ffffff, #d9d9d9); background-image: -o-linear-gradient(top, #ffffff, #d9d9d9); background-image: linear-gradient(top, #ffffff, #d9d9d9); border-top-left-radius: 4px; border-bottom-left-radius: 4px; }
CSS fixes for Batchactions. On some browsers Batchactions block looked OK, but on others (e.t. Opera on Linux) every element in Batchactions block had different height. The height of these elements was related to font size which is a little bit different on every OS'es and browsers. See https://github.com/silverstripe/sapphire/pull/1132
2013-01-25 16:41:02 +01:00
.cms-content-batchactions .view-mode-batchactions-wrapper input { vertical-align: middle; }
.cms-content-batchactions .view-mode-batchactions-wrapper label { vertical-align: middle; display: none; }
Batch actions UI enhancement (#7878)
2012-10-12 05:02:04 +02:00
.cms-content-batchactions .view-mode-batchactions-wrapper fieldset, .cms-content-batchactions .view-mode-batchactions-wrapper .Actions { display: inline-block; }
Filter notice styling and panel adjustments * Based on @clarkepaul's commit here: https://github.com/silverstripe-droptables/sapphire/commit/e5de6c06489f3 449ee8131bf4ee2a4e1b2380bee * Kept margin adjustments, but avoided implementing tab changes, as tabs have chnaged a lot since original commit
2013-06-04 02:11:05 +02:00
.cms-content-batchactions .view-mode-batchactions-wrapper #view-mode-batchactions { margin-top: 2px; }
Batch actions UI enhancement (#7878)
2012-10-12 05:02:04 +02:00
.cms-content-batchactions.inactive .view-mode-batchactions-wrapper { border-radius: 4px; }
.cms-content-batchactions.inactive .view-mode-batchactions-wrapper label { display: inline; }
MINOR: #css styles to clean up vertical alignment in content tools
2011-08-16 04:57:30 +02:00
.cms-content-batchactions form > * { display: block; float: left; }
.cms-content-batchactions form.cms-batch-actions { float: left; }
Batch actions UI enhancement (#7878)
2012-10-12 05:02:04 +02:00
.cms-content-batchactions.inactive form { display: none; }
CSS fixes for Batchactions. On some browsers Batchactions block looked OK, but on others (e.t. Opera on Linux) every element in Batchactions block had different height. The height of these elements was related to font size which is a little bit different on every OS'es and browsers. See https://github.com/silverstripe/sapphire/pull/1132
2013-01-25 16:41:02 +01:00
.cms-content-batchactions .chzn-container-single { display: block; }
Batch actions styling * Removed cog icon (usually associated with settings), and tidied up padding (based on @clarkepaul's commit: https://github.com/silverstripe-droptables/sapphire/commit/b09cd5f7f8e73 4df1f7ca0d387a5b97a03a3b604)
2013-06-04 02:48:51 +02:00
.cms-content-batchactions .chzn-container-single .chzn-single { border-radius: 0; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2Q5ZDlkOSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(100%, #d9d9d9)); background-image: -webkit-linear-gradient(top, #ffffff, #d9d9d9); background-image: -moz-linear-gradient(top, #ffffff, #d9d9d9); background-image: -o-linear-gradient(top, #ffffff, #d9d9d9); background-image: linear-gradient(top, #ffffff, #d9d9d9); }
CSS fixes for Batchactions. On some browsers Batchactions block looked OK, but on others (e.t. Opera on Linux) every element in Batchactions block had different height. The height of these elements was related to font size which is a little bit different on every OS'es and browsers. See https://github.com/silverstripe/sapphire/pull/1132
2013-01-25 16:41:02 +01:00
.cms-content-batchactions .chzn-container-single .chzn-single span { padding-top: 0; }
Batch actions styling * Removed cog icon (usually associated with settings), and tidied up padding (based on @clarkepaul's commit: https://github.com/silverstripe-droptables/sapphire/commit/b09cd5f7f8e73 4df1f7ca0d387a5b97a03a3b604)
2013-06-04 02:48:51 +02:00
.cms-content-batchactions .cms-batch-actions .dropdown { margin: 0; }
.cms-content-batchactions .cms-batch-actions .dropdown .chzn-single { padding-left: 8px; /* use default size without icon */ }
CSS fixes for Batchactions. On some browsers Batchactions block looked OK, but on others (e.t. Opera on Linux) every element in Batchactions block had different height. The height of these elements was related to font size which is a little bit different on every OS'es and browsers. See https://github.com/silverstripe/sapphire/pull/1132
2013-01-25 16:41:02 +01:00
.cms-content-batchactions .cms-batch-actions .Actions .ss-ui-button { padding-top: 4px; padding-bottom: 4px; height: 28px; margin-left: -1px; border-top-left-radius: 0; border-bottom-left-radius: 0; }
Batch actions UI enhancement (#7878)
2012-10-12 05:02:04 +02:00
.cms-content-batchactions .cms-batch-actions .Actions .ss-ui-button.ui-state-disabled { opacity: 1; color: #ccc; }
MINOR IE compatibility fixes in new admin CSS
2011-07-07 08:01:25 +02:00
MINOR Fixed batch action drop down width in CMS (somehow chosen.js interprets it as only 60px wide)
2011-10-29 12:59:42 +02:00
#Form_BatchActionsForm select { width: 200px; }
MINOR Cleaned up CMS dialog styling (now works with/without tabs, in iframe and inline markup), removed superfluous SCSS variable declarations
2012-01-03 17:38:11 +01:00
/** -------------------------------------------- Preview -------------------------------------------- */
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.cms-switch-view a { padding-right: 1em; }
MINOR Cleaned up CMS dialog styling (now works with/without tabs, in iframe and inline markup), removed superfluous SCSS variable declarations
2012-01-03 17:38:11 +01:00
MINOR Cleaned up structure and documentation of SCSS files in sapphire/admin/scss
2011-07-07 07:34:55 +02:00
/** -------------------------------------------- Member Profile -------------------------------------------- */
BUGFIX:fixed styling issues on edit profile dialog popup - Trac #6819
2012-03-16 03:59:58 +01:00
form.member-profile-form { padding: 0 16px 0 0; }
BUGFIX:removed header from edit profile popup and restyled broken tabs - still needs a proper fix after beta II.
2012-04-03 04:34:42 +02:00
form.member-profile-form #Root_Permissions { clear: both; border-top: 1px solid #a6a6a6; }
Fixed panel spacing regressions from 544d2eb6 Specifically, the change removed the "add page" panel padding, because it moved padding from .cms-panel-padded into commonly contained elements, like .ui-tabs-panel. Apart from breaking layouts, it makes the class meaningless, since its only padded depending on which elements it contains. In order to rectify some introduced inconsistencies, much too complex were required, e.g. .ui-tabs .cms-edit-form, .ui-tabs .cms-content-fields {...}.
2012-12-17 15:13:43 +01:00
form.member-profile-form #Root_Main { clear: both; border-top: 1px solid #a6a6a6; }
ENHANCEMENT:replaced text "Toggle Formatting Help" with a ? icon on edit profile Popup - Trac #6904
2012-03-16 04:30:35 +01:00
form.member-profile-form #Root_Main .cms-help-toggle { text-indent: -9999em; display: inline-block; width: 20px; background: url(../images/question.png) no-repeat 0px 0px; }
BUGFIX:fixed styling issues on edit profile dialog popup - Trac #6819
2012-03-16 03:59:58 +01:00
form.member-profile-form #FavouritePageID { margin-top: 8px; }
MINOR Moving _layout.scss include from screen.css into its own file, in order to selectively block layout options like body {overflow: none;} while retaining all other cms styles (useful in a dialog context)
2011-04-30 05:11:10 +02:00
form.member-profile-form #CsvFile .middleColumn { background: none !important; }
form.member-profile-form .advanced h4 { margin-bottom: .5em; }
form.member-profile-form .Actions { text-align: left; border: 0; }
Put back cog icon for multi-select batch actions (was removed in f4b080e)
2013-05-15 11:09:19 +02:00
form.member-profile-form input.customFormat { width: 80px; border: 1px solid #ccc !important; padding: 3px; display: inline-block; margin-left: 1em; }
MINOR Simpler field alignment of OptionsetField (and some specifics for member-profile-form)
2012-01-06 20:44:34 +01:00
form.member-profile-form .formattingHelpToggle { display: block; font-size: 11px; }
Put back cog icon for multi-select batch actions (was removed in f4b080e)
2013-05-15 11:09:19 +02:00
form.member-profile-form .formattingHelpText { margin: 5px 0 0 -5px; color: #333; padding: 5px 10px; background: #fff; border: 1px solid #ccc; }
MINOR Moving _layout.scss include from screen.css into its own file, in order to selectively block layout options like body {overflow: none;} while retaining all other cms styles (useful in a dialog context)
2011-04-30 05:11:10 +02:00
form.member-profile-form .formattingHelpText ul { padding: 0; }
MINOR Simpler field alignment of OptionsetField (and some specifics for member-profile-form)
2012-01-06 20:44:34 +01:00
form.member-profile-form .formattingHelpText li { font-size: 11px; color: #333; margin-bottom: 2px; padding-bottom: 0; float: none; width: auto; }
MINOR: Added Member Profile Popup Styling MINOR: Better button styles MINOR: Now compass for button sprites
2011-12-21 19:45:20 +01:00
form.member-profile-form #Groups .middleColumn { margin-left: 0; width: 100%; }
form.member-profile-form #Groups .middleColumn .TreeDropdownField { width: 90%; max-width: 90%; }
MINOR Simpler field alignment of OptionsetField (and some specifics for member-profile-form)
2012-01-06 20:44:34 +01:00
form.member-profile-form #Permissions .optionset li { float: none; width: auto; }
MINOR Moving _layout.scss include from screen.css into its own file, in order to selectively block layout options like body {overflow: none;} while retaining all other cms styles (useful in a dialog context)
2011-04-30 05:11:10 +02:00
Using new description style in MemberDateTimeOptionSetField
2012-11-30 12:27:38 +01:00
.memberdatetimeoptionset .description { font-style: normal; }
.memberdatetimeoptionset .toggle { font-size: 11px; }
Put back cog icon for multi-select batch actions (was removed in f4b080e)
2013-05-15 11:09:19 +02:00
.cms .cms-content { border-right: 1px solid #BBB; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; background: #eceff1; width: 800px; z-index: 40; }
CMS CSS Minor Polishing Tweaks Fixed what I believe to be a few very minor CSS regressions, that appeared after the CSS restructure for the side-by-side preview. - Reverted background of the right panel (and tab active state) to the slightly darker shade (as per 3.0) to keep each of the 3 panels visually separate. - Slightly increased padding on ui-tabs-panel as felt a but too close for comfort. Had decreased since 3.0. - Decreased padding for logged in user name in menu, felt too excessive. (3.0 was neater) - Evened out padding above buttons in site tree sidebar Screenshots showing changes: 3.0: http://spdr.me/xauh 3.1 before commit: http://spdr.me/jkIe 3.1 after commit: http://spdr.me/IxtB
2013-03-12 23:43:33 +01:00
.cms .cms-content-fields { overflow-y: auto; overflow-x: auto; background: #e6eaed; width: 100%; }
BUGFIX:removed unnecessary horizontal line from new members page and replaced cms-help-toggle text with ?icon Trac #6956
2012-03-19 04:39:10 +01:00
.cms .cms-content-fields #Root_Main .confirmedpassword { border-bottom: none; box-shadow: none; }
.cms .cms-content-fields #Root_Main .customFormat { max-width: 80px; }
.cms .cms-content-fields #Root_Main .cms-help-toggle { text-indent: -9999em; display: inline-block; width: 20px; background: url(../images/question.png) no-repeat 0px 0px; }
BUGFIX:removed the float from the li (checkboxes) in members permissions... fixed layout issues Trac #6958
2012-03-19 04:57:16 +01:00
.cms .cms-content-fields #Root_Permissions ul.optionset li { float: none; }
CMS member profile now is no longer in a popup (#7880)
2012-10-08 04:02:01 +02:00
.cms form.member-profile-form #Root .ui-tabs-nav { display: none; }
.cms form.member-profile-form #Root_Main, .cms form.member-profile-form #Root_Permissions { border: none; }
MINOR Recompiled CSS from SCSS
2011-07-06 15:21:46 +02:00
MINOR Show all "can view" options in page settings in their own line, as it makes it easier to scan available options
2012-03-04 21:57:05 +01:00
/** -------------------------------------------- "Settings" Form -------------------------------------------- */
BUGFIX: #6853 Necessary styles required to complement work on same-indexed commit in cms project
2012-03-09 01:20:27 +01:00
#CanViewType .optionset li, #CanEditType .optionset li, #CanCreateTopLevelType .optionset li { float: none; width: auto; white-space: nowrap; }
MINOR Show all "can view" options in page settings in their own line, as it makes it easier to scan available options
2012-03-04 21:57:05 +01:00
MINOR Fixed viewer/editor groups field widths to work with chosen.js UI component
2012-03-04 22:07:36 +01:00
#ViewerGroups select, #EditorGroups select, #CreateTopLevelGroups select { width: 512px; }
MINOR Cleaned up structure and documentation of SCSS files in sapphire/admin/scss
2011-07-07 07:34:55 +02:00
/** -------------------------------------------- Panels -------------------------------------------- */
ENHANCEMENT Toggleable panels in CMS
2011-05-13 03:30:49 +02:00
.cms-panel { overflow: hidden; }
Side-by-side preview options fixes. Add extra preview-mode selector to the CMS actions so we can show something when the preview is closed (and with it all options are not visible). Thanks @mateusz, @clarkepaul and @robert-h-curry for contributing.
2012-11-27 06:03:43 +01:00
.cms-panel .cms-panel-toggle { -webkit-box-shadow: 0 0 1px rgba(248, 248, 248, 0.9); -moz-box-shadow: 0 0 1px rgba(248, 248, 248, 0.9); box-shadow: 0 0 1px rgba(248, 248, 248, 0.9); }
.cms-panel .cms-panel-toggle.south { border-top: 1px solid #9eafba; -webkit-box-shadow: #bcc8cf 0 1px 0px inset; -moz-box-shadow: #bcc8cf 0 1px 0px inset; box-shadow: #bcc8cf 0 1px 0px inset; position: absolute; bottom: 0; width: 100%; }
.cms-panel .cms-panel-toggle a { display: block; text-align: right; padding: 4px 0; width: 100%; text-decoration: none; }
.cms-panel .cms-panel-toggle a span { display: inline-block; margin: 0 5px; color: #1f1f1f; font-size: 16px; }
.cms-panel .cms-panel-toggle a.toggle-expand { width: 40px; display: none; }
.cms-panel.cms-content-tools .cms-panel-toggle.south { border-top: 1px solid #cfd6db; -webkit-box-shadow: rgba(248, 248, 248, 0.9) 0 1px 0px inset; -moz-box-shadow: rgba(248, 248, 248, 0.9) 0 1px 0px inset; box-shadow: rgba(248, 248, 248, 0.9) 0 1px 0px inset; }
MINOR Improved collapsed panel view by auto-hiding panel headers and avoid ugly cropped overflow effect
2012-02-15 14:18:13 +01:00
.cms-panel.collapsed { cursor: pointer; }
Side-by-side preview options fixes. Add extra preview-mode selector to the CMS actions so we can show something when the preview is closed (and with it all options are not visible). Thanks @mateusz, @clarkepaul and @robert-h-curry for contributing.
2012-11-27 06:03:43 +01:00
.cms-panel.collapsed .cms-panel-header *, .cms-panel.collapsed .cms-panel-content, .cms-panel.collapsed .cms-panel-toggle a.toggle-collapse { display: none; }
.cms-panel.collapsed .cms-panel-toggle a.toggle-expand { display: block; }
MINOR Improved collapsed panel view by auto-hiding panel headers and avoid ugly cropped overflow effect
2012-02-15 14:18:13 +01:00
.cms-panel .cms-panel-header { width: 100%; }
BUGFIX:fixed various styling issues in cms (raised in SSF-188)
2012-02-17 05:00:29 +01:00
.cms-panel#cms-content-tools-CMSPageEditController .cms-panel-content-collapsed { width: 40px; display: none; }
MINOR Updating compass sprites with its changed ordering starting with 0.12 release (see http://compass-style.org/blog/2012/02/01/compass-0-12-is-released/)
2012-06-03 23:22:29 +02:00
.cms-panel#cms-content-tools-CMSPageEditController .cms-panel-content-collapsed h2, .cms-panel#cms-content-tools-CMSPageEditController .cms-panel-content-collapsed h3 { border-bottom: 0; margin-left: 8px; -webkit-transform-origin: bottom right; -moz-transform-origin: bottom right; -ms-transform-origin: bottom right; -o-transform-origin: bottom right; transform-origin: bottom right; -webkit-transform: rotate(270deg); -moz-transform: rotate(270deg); -ms-transform: rotate(270deg); -o-transform: rotate(270deg); transform: rotate(270deg); }
BUGFIX:fixed various styling issues in cms (raised in SSF-188)
2012-02-17 05:00:29 +01:00
.cms-panel#cms-content-tools-CMSPageEditController .cms-panel-content-collapsed .cms-panel-header { width: 600px; position: relative; top: 24px; right: 577px; text-align: right; }
MINOR Hiding collapsed panel views by CSS to avoid FOUC, and initialising component without triggering events to avoid redrawing the whole CMS layout twice due to it listening for panel changes
2012-02-16 11:45:07 +01:00
.cms-panel .cms-panel-content-collapsed { width: 40px; display: none; }
MINOR Updating compass sprites with its changed ordering starting with 0.12 release (see http://compass-style.org/blog/2012/02/01/compass-0-12-is-released/)
2012-06-03 23:22:29 +02:00
.cms-panel .cms-panel-content-collapsed h2, .cms-panel .cms-panel-content-collapsed h3 { border-bottom: 0; margin-left: 8px; -webkit-transform-origin: bottom right; -moz-transform-origin: bottom right; -ms-transform-origin: bottom right; -o-transform-origin: bottom right; transform-origin: bottom right; -webkit-transform: rotate(270deg); -moz-transform: rotate(270deg); -ms-transform: rotate(270deg); -o-transform: rotate(270deg); transform: rotate(270deg); }
BUGFIX:fixed unwanted box shadow on cms-panel-header when side panel is collapsed
2012-04-18 03:59:00 +02:00
.cms-panel .cms-panel-content-collapsed .cms-panel-header { width: 600px; position: relative; right: 577px; text-align: right; border-bottom: none; box-shadow: none; }
BUGFIX: renaming "triangle" to "flyout-indicator" and fixing bug when switching between pages in the CMS after collapsing left-hand side menu
2011-10-10 02:24:27 +02:00
.cms-panel .child-flyout-indicator { width: 0; height: 0; border-right: 3px dashed #1f1f1f; border-top: 3px solid transparent; border-left: 3px solid transparent; border-bottom: 3px dashed #1f1f1f; position: absolute; right: 1px; margin-top: -8px; display: none; /* To be shown by javascript, see LeftAndMain.Panel.js */ }
ENHANCEMENT: Collapsed main menu view (SSO-7)
2011-10-07 06:48:53 +02:00
.cms-panel .collapsed-flyout { display: block !important; left: 41px; margin-top: -40px; position: fixed; width: 191px; }
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.cms-panel .collapsed-flyout li a span { display: block !important; }
ENHANCEMENT Toggleable panels in CMS
2011-05-13 03:30:49 +02:00
Fixed panel spacing regressions from 544d2eb6 Specifically, the change removed the "add page" panel padding, because it moved padding from .cms-panel-padded into commonly contained elements, like .ui-tabs-panel. Apart from breaking layouts, it makes the class meaningless, since its only padded depending on which elements it contains. In order to rectify some introduced inconsistencies, much too complex were required, e.g. .ui-tabs .cms-edit-form, .ui-tabs .cms-content-fields {...}.
2012-12-17 15:13:43 +01:00
.cms .cms-panel-padded { padding: 16px 16px; margin: 0; }
ENHANCEMENT: styling of popup with Ed Knight's changes and moving them from CMS to sapphire, because that is where all the image assets live (SSO-12)
2011-09-29 05:25:31 +02:00
/** ------------------------------------------------------------------
MINOR Cleaned up CMS dialog styling (now works with/without tabs, in iframe and inline markup), removed superfluous SCSS variable declarations
2012-01-03 17:38:11 +01:00
* Dialog
*
* Contained in a jQuery UI dialog ('.ui-dialog'), with either inline
* markup (for the "insert" dialogs), or an iframe (for member profile).
ENHANCEMENT: styling of popup with Ed Knight's changes and moving them from CMS to sapphire, because that is where all the image assets live (SSO-12)
2011-09-29 05:25:31 +02:00
* ----------------------------------------------------------------- */
ENHANCEMENT: adding an additional overlay-light div that is used when switching between pages by ajax. The dialog pop-up uses the default "ui-widget-overlay", but that overlay is darker than "ui-widget-overlay-light". Having two overlays prevents weird graphic effects when switching pages using the darker overlay (SSO-12)
2011-09-29 06:09:36 +02:00
.cms .ui-widget-overlay-light { background: #aaaaaa url(../../thirdparty/jquery-ui-themes/smoothness/images/ui-bg_flat_0_aaaaaa_40x100.png) 50% 50% repeat-x; opacity: 0.3; }
ENHANCEMENT: styling of popup with Ed Knight's changes and moving them from CMS to sapphire, because that is where all the image assets live (SSO-12)
2011-09-29 05:25:31 +02:00
.cms .ui-widget-overlay { background-color: #000; background-image: none; }
BUGFIX:fixed styling issues on edit profile dialog popup - Trac #6819
2012-03-16 03:59:58 +01:00
.cms .ui-dialog .ss-ui-dialog.ui-dialog-content { padding-top: 0px; }
Put back cog icon for multi-select batch actions (was removed in f4b080e)
2013-05-15 11:09:19 +02:00
.ui-dialog { background: url("../images/textures/bg_cms_main_content.png") repeat left top #f0f3f4; border: 3px solid #000 !important; border-radius: 8px; overflow: visible; padding: 0; }
MINOR Updating compass sprites with its changed ordering starting with 0.12 release (see http://compass-style.org/blog/2012/02/01/compass-0-12-is-released/)
2012-06-03 23:22:29 +02:00
.ui-dialog .ui-dialog-titlebar.ui-widget-header { font-size: 14px; padding: 0; border: none; background-color: transparent; background-image: url(../images/textures/cms_content_header.png); background-repeat: repeat; -webkit-box-shadow: rgba(107, 120, 123, 0.5) 0 0 4px inset; -moz-box-shadow: rgba(107, 120, 123, 0.5) 0 0 4px inset; box-shadow: rgba(107, 120, 123, 0.5) 0 0 4px inset; }
BUGFIX:SSF-38 - fixed the issue with the size of the popup being to large on-load - added overflow scroll. Altered the header and tabs to match the style of edit profile.
2012-04-05 03:23:45 +02:00
.ui-dialog .ui-dialog-titlebar.ui-widget-header .ui-dialog-title { position: absolute; }
Min/max constraints for CMS dialog
2013-06-13 19:57:18 +02:00
.ui-dialog .ui-dialog-content { overflow: auto; }
.ui-dialog .ui-dialog-content.loading { background-image: url(../images/spinner.gif); background-position: 50% 50%; background-repeat: no-repeat; }
BUGFIX:SSF-38 - fixed the issue with the size of the popup being to large on-load - added overflow scroll. Altered the header and tabs to match the style of edit profile.
2012-04-05 03:23:45 +02:00
.ui-dialog .cms-dialog-content { background: url("../images/textures/bg_cms_main_content.png") repeat left top #f0f3f4; padding-bottom: 8px; padding-top: 0px; }
ENHANCEMENT:SSF-38 - Styled in-content file upload dialog box. Also added fixes for cms-content-header box-shadow.
2012-03-30 03:33:20 +02:00
.ui-dialog .cms-dialog-content .Actions { overflow: auto; margin: 8px 0; padding-bottom: 8px; float: right; }
ENHANCEMENT Tab style consolidation and design consistency
2012-11-06 10:53:20 +01:00
.ui-dialog .cms-dialog-content .ui-tabs { position: static; }
.ui-dialog .cms-dialog-content .ui-tabs .ui-tabs-nav { position: absolute; top: 0; right: 40px; }
.ui-dialog .cms-dialog-content .ui-tabs .ui-tabs-panel { border: 0; }
ENHANCEMENT:SSF-38 - Styled in-content file upload dialog box. Also added fixes for cms-content-header box-shadow.
2012-03-30 03:33:20 +02:00
.ui-dialog .cms-dialog-content .clear { clear: both; }
MINOR Merge errors
2012-02-13 18:14:29 +01:00
.ui-dialog.loading { background-image: url(../images/spinner.gif); background-position: 50% 50%; background-repeat: no-repeat; }
ENHANCEMENT: styling of popup with Ed Knight's changes and moving them from CMS to sapphire, because that is where all the image assets live (SSO-12)
2011-09-29 05:25:31 +02:00
BUGFIX: Pop-up scrolling IE7 Added position relative to the body of the iframe to fix scrolling bug
2012-04-23 07:01:38 +02:00
body.cms-dialog { overflow: auto; background: url("../images/textures/bg_cms_main_content.png") repeat left top #f0f3f4; position: relative; }
MINOR Cleaned up CMS dialog styling (now works with/without tabs, in iframe and inline markup), removed superfluous SCSS variable declarations
2012-01-03 17:38:11 +01:00
MINOR Adding step indicators to "insert link" dialog
2012-01-03 22:30:24 +01:00
/** -------------------------------------------- "Insert X" forms -------------------------------------------- */
MINOR Moved "insert x" dialog styling from generic UploadField.scss to CMS-specific _style.scss
2012-06-11 10:51:47 +02:00
.htmleditorfield-dialog.ui-dialog-content { padding: 0; position: relative; }
Localization-resilient SCSS selector (fixes #1590)
2013-06-14 23:55:43 +02:00
.htmleditorfield-dialog .htmleditorfield-from-web .CompositeField { overflow: hidden; *zoom: 1; }
.htmleditorfield-dialog .htmleditorfield-from-web #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 .htmleditorfield-from-web #RemoteURL label { position: absolute; left: 8px; top: 13px; font-weight: normal; color: #888; }
.htmleditorfield-dialog .htmleditorfield-from-web #RemoteURL .middleColumn { margin-left: 0; }
.htmleditorfield-dialog .htmleditorfield-from-web #RemoteURL input.remoteurl { padding-left: 40px; }
.htmleditorfield-dialog .htmleditorfield-from-web button.add-url { margin-top: 5px; padding-top: 15px; overflow: hidden; *zoom: 1; border: none; background: none; opacity: 0.8; cursor: hand; }
.htmleditorfield-dialog .htmleditorfield-from-web button.add-url .btn-icon-addMedia { width: 20px; height: 20px; }
.htmleditorfield-dialog .htmleditorfield-from-web button.add-url .ui-button-text { margin-left: 10px; margin-top: -5px; line-height: 20px; float: left; }
.htmleditorfield-dialog .htmleditorfield-from-web button.add-url:hover, .htmleditorfield-dialog .htmleditorfield-from-web button.add-url:active { border: none; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; opacity: 1; }
.htmleditorfield-dialog .htmleditorfield-from-web button.add-url.ui-state-disabled, .htmleditorfield-dialog .htmleditorfield-from-web button.add-url.ui-state-disabled:hover, .htmleditorfield-dialog .htmleditorfield-from-web button.add-url.ui-state-disabled:active { opacity: 0.35; filter: Alpha(Opacity=35); }
.htmleditorfield-dialog .htmleditorfield-from-web .loading button.add-url .ui-icon { background-image: url(../images/throbber.gif); background-position: 50% 50%; background-repeat: no-repeat; }
MINOR Moved "insert x" dialog styling from generic UploadField.scss to CMS-specific _style.scss
2012-06-11 10:51:47 +02:00
.htmleditorfield-dialog .cms-content-header { padding: 0; width: 100%; height: 40px; }
.htmleditorfield-dialog .cms-content-header h3 { padding: 0 8px; margin: 10px; }
BUGFIX: Insert link styling broken, and inconsistent with Insert media (fixes #7528)
2012-06-25 05:31:39 +02:00
.htmleditorfield-dialog .ss-insert-media, .htmleditorfield-dialog .Actions, .htmleditorfield-dialog .ss-insert-link { padding: 8px 16px; }
Tighten "Insert Media" dialog layout Reduce space usage to fit into typical dialog dimensions without scrolling
2013-06-14 22:05:04 +02:00
.htmleditorfield-dialog .ss-insert-media .ui-tabs-panel, .htmleditorfield-dialog .Actions .ui-tabs-panel, .htmleditorfield-dialog .ss-insert-link .ui-tabs-panel { padding: 0; }
Reduced URL field width in "Insert Media" to avoid wrap 450px width are often not available to the dialog (with all margins/paddings subtracted from the window). Ensure the URL doesn't cause an unnecessary wrap. Ideally we can size this to the dialog width automatically of course.
2013-06-14 13:54:33 +02:00
.htmleditorfield-dialog .details .file-url { display: block; width: 300px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; -o-text-overflow: ellipsis; }
MINOR Moved "insert x" dialog styling from generic UploadField.scss to CMS-specific _style.scss
2012-06-11 10:51:47 +02:00
.htmleditorfield-dialog .details .cms-file-info .field { border: none; -webkit-box-shadow: 0 0 0 rgba(0, 0, 0, 0); -moz-box-shadow: 0 0 0 rgba(0, 0, 0, 0); box-shadow: 0 0 0 rgba(0, 0, 0, 0); }
.htmleditorfield-dialog .details .field { border-bottom: 1px solid rgba(201, 205, 206, 0.8); -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); }
.htmleditorfield-dialog .details .field.last { border-bottom: none; -webkit-box-shadow: 0 0 0 rgba(0, 0, 0, 0); -moz-box-shadow: 0 0 0 rgba(0, 0, 0, 0); box-shadow: 0 0 0 rgba(0, 0, 0, 0); margin-bottom: 0; }
Formatting tweaks, fixes silverstripe/silverstripe-cms#641
2013-05-25 05:52:20 +02:00
.htmleditorfield-dialog .CompositeField .text select { margin: 5px 0 0 0; }
MINOR Moved "insert x" dialog styling from generic UploadField.scss to CMS-specific _style.scss
2012-06-11 10:51:47 +02:00
MINOR Adding step indicators to "insert link" dialog
2012-01-03 22:30:24 +01:00
.htmleditorfield-linkform .step2 { margin-bottom: 16px; }
Hide "delete" button in "Insert Media" dialog
2013-06-14 13:53:09 +02:00
.htmleditorfield-mediaform .ss-gridfield .gridfield-button-delete { display: none; }
Tighten "Insert Media" dialog layout Reduce space usage to fit into typical dialog dimensions without scrolling
2013-06-14 22:05:04 +02:00
.htmleditorfield-mediaform .ss-gridfield table.ss-gridfield-table tbody td:first-child { padding: 0; text-align: center; }
.htmleditorfield-mediaform .ss-gridfield table.ss-gridfield-table tbody td:first-child img { max-height: 30px; }
.htmleditorfield-mediaform .ss-gridfield table.ss-gridfield-table tr td { padding: 4px; }
Localization-resilient SCSS selector (fixes #1590)
2013-06-14 23:55:43 +02:00
.htmleditorfield-mediaform .htmleditorfield-from-web .ss-uploadfield .middleColumn, .htmleditorfield-mediaform .htmleditorfield-from-cms .ss-uploadfield .middleColumn { width: auto; background: none; border: none; margin-top: 13px; }
.htmleditorfield-mediaform .htmleditorfield-from-cms .ss-uploadfield h4 { float: left; margin-top: 4px; margin-bottom: 0; }
.htmleditorfield-mediaform .htmleditorfield-from-cms .ss-uploadfield .middleColumn { margin-top: 16px; margin-left: 184px; }
.htmleditorfield-mediaform .htmleditorfield-from-cms .ss-uploadfield .field.treedropdown { border-bottom: 0; padding: 0; }
BUG Fixed issue where file upload via the HTML Editor media dialogue would not prompt users to overwrite existing files
2013-06-20 05:21:18 +02:00
.htmleditorfield-mediaform .ss-assetuploadfield .ss-uploadfield-editandorganize .ss-uploadfield-files .ss-uploadfield-item-info { background-color: #9e9e9e; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzllOWU5ZSIvPjxzdG9wIG9mZnNldD0iOCUiIHN0b3AtY29sb3I9IiM5ZDlkOWQiLz48c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iIzg3ODc4NyIvPjxzdG9wIG9mZnNldD0iNTQlIiBzdG9wLWNvbG9yPSIjODY4Njg2Ii8+PHN0b3Agb2Zmc2V0PSI5NiUiIHN0b3AtY29sb3I9IiM2YjZiNmIiLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM2YzZjNmMiLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSJ1cmwoI2dyYWQpIiAvPjwvc3ZnPiA='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #9e9e9e), color-stop(8%, #9d9d9d), color-stop(50%, #878787), color-stop(54%, #868686), color-stop(96%, #6b6b6b), color-stop(100%, #6c6c6c)); background-image: -webkit-linear-gradient(top, #9e9e9e 0%, #9d9d9d 8%, #878787 50%, #868686 54%, #6b6b6b 96%, #6c6c6c 100%); background-image: -moz-linear-gradient(top, #9e9e9e 0%, #9d9d9d 8%, #878787 50%, #868686 54%, #6b6b6b 96%, #6c6c6c 100%); background-image: -o-linear-gradient(top, #9e9e9e 0%, #9d9d9d 8%, #878787 50%, #868686 54%, #6b6b6b 96%, #6c6c6c 100%); background-image: linear-gradient(top, #9e9e9e 0%, #9d9d9d 8%, #878787 50%, #868686 54%, #6b6b6b 96%, #6c6c6c 100%); }
ENHANCEMENT Inserting image via new dialog with ajax field retrieval and GridField file selection. Rewritten to jQuery.entwine and using the new HTML editor abstraction layer.
2012-02-09 17:17:39 +01:00
API CHANGE ModelAdmin uses GridField, DataList and new layout. Removed ModelAdmin_CollectionController, ModelAdmin_RecordController and related functionality. API CHANGE Removed ModelAdmin->ResultColumns()/ColumnSelectionField, selection of own fields no longer possible through the UI, to be replaced by a more generic GridField component
2012-03-09 09:52:03 +01:00
/** -------------------------------------------- Search forms (used in AssetAdmin, ModelAdmin, etc) -------------------------------------------- */
BUGFIX: 7117 Fixes Includes: * Changes to chosen to include a custom function that will let the drop-down rise-up if there is room and it would otherwise drop beneath the size of the window (changes in coffeescript, jquery output, and chosen css) * Changes in SCSS to stop the automatic addition of scrollbars, and to limit the extra space at the bottom of the filter div Issues remaining: * jLayout is calculating the height of the filter div incorrectly. It is assuming the div is around 70px longer than it is. This height assumption is linked somehow to chosen, as initiating the select box results in a correct height calculation.
2012-05-01 07:14:16 +02:00
.cms-search-form { margin-bottom: 16px; }
.filter .cms-search-form { margin-bottom: 0; }
Side-by-side preview options fixes. Add extra preview-mode selector to the CMS actions so we can show something when the preview is closed (and with it all options are not visible). Thanks @mateusz, @clarkepaul and @robert-h-curry for contributing.
2012-11-27 06:03:43 +01:00
.cms-search-form .Actions { padding: 0; }
API CHANGE ModelAdmin uses GridField, DataList and new layout. Removed ModelAdmin_CollectionController, ModelAdmin_RecordController and related functionality. API CHANGE Removed ModelAdmin->ResultColumns()/ColumnSelectionField, selection of own fields no longer possible through the UI, to be replaced by a more generic GridField component
2012-03-09 09:52:03 +01:00
MINOR Adding step indicators to "insert link" dialog
2012-01-03 22:30:24 +01:00
/** -------------------------------------------- Step labels -------------------------------------------- */
MINOR More robust way to style "triangle"/"flyout"/"step indicator" in forms, via background image rather than CSS3 with hard-to-maintain dimension and positioning tweaks. Use inline-block to have it working within other elements (+titles) rather than standalone
2012-01-03 22:17:28 +01:00
.step-label > * { display: inline-block; vertical-align: top; }
BUG: One too many brackets in _style.scss Caused when merging 3.0 back into master
2012-10-31 23:16:13 +01:00
.step-label .flyout { height: 18px; font-size: 14px; font-weight: bold; -moz-border-radius-topleft: 3px; -webkit-border-top-left-radius: 3px; border-top-left-radius: 3px; -moz-border-radius-bottomleft: 3px; -webkit-border-bottom-left-radius: 3px; border-bottom-left-radius: 3px; background-color: #667980; padding: 4px 3px 4px 6px; text-align: center; text-shadow: none; color: #fff; }
Replace logout button with a more commonly used symbol * Power icon swapped for door icon * Minor hover/focus opacity effect added to button
2013-05-25 06:45:49 +02:00
.step-label .arrow { height: 26px; width: 10px; background: url('../images/sprites-32x32-s972e408b05.png') 0 -256px no-repeat; margin-right: 4px; }
MINOR More robust way to style "triangle"/"flyout"/"step indicator" in forms, via background image rather than CSS3 with hard-to-maintain dimension and positioning tweaks. Use inline-block to have it working within other elements (+titles) rather than standalone
2012-01-03 22:17:28 +01:00
.step-label .title { height: 18px; padding: 4px; }
ENHANCEMENT: scale cms dialog popups based on browser. BUGFIX: #6760 ensure scrolling is supported in cms dialogs
2011-12-17 00:51:32 +01:00
ENHANCEMENT: File and Image CMSFields styling
2012-02-23 22:43:37 +01:00
/** -------------------------------------------- Item Edit Form -------------------------------------------- */
MINOR Updating compass sprites with its changed ordering starting with 0.12 release (see http://compass-style.org/blog/2012/02/01/compass-0-12-is-released/)
2012-06-03 23:22:29 +02:00
.cms-file-info { overflow: auto; border-bottom: 1px solid rgba(201, 205, 206, 0.8); -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); margin-bottom: 8px; }
MINOR Styling and structural fixes for File/Image->getCMSFields() and relates usage in UploadField/HTMLEditorField.
2012-02-28 18:07:55 +01:00
.cms-file-info .cms-file-info-preview { float: left; width: 176px; margin-right: 8px; }
Compressed layout in "Insert Media" detail screen - Same font size as other CMS UI - Smaller thumbnail height - Less label width and padding for file info
2013-06-15 10:02:11 +02:00
.cms-file-info .cms-file-info-preview img { max-width: 176px; max-height: 128px; }
MINOR Styling and structural fixes for File/Image->getCMSFields() and relates usage in UploadField/HTMLEditorField.
2012-02-28 18:07:55 +01:00
.cms-file-info .cms-file-info-data { float: left; }
Compressed layout in "Insert Media" detail screen - Same font size as other CMS UI - Smaller thumbnail height - Less label width and padding for file info
2013-06-15 10:02:11 +02:00
.cms-file-info .cms-file-info-data .field { margin: 0; padding-bottom: 8px; border: none; box-shadow: none; }
.cms-file-info .cms-file-info-data .field label.left { width: 96px; }
.cms-file-info .cms-file-info-data .field .middleColumn { margin-left: 104px; }
MINOR Styling and structural fixes for File/Image->getCMSFields() and relates usage in UploadField/HTMLEditorField.
2012-02-28 18:07:55 +01:00
.cms-file-info .cms-file-info-data .field label, .cms-file-info .cms-file-info-data .field span { padding: 0; }
ENHANCEMENT: File and Image CMSFields styling
2012-02-23 22:43:37 +01:00
MINOR More generic CSS styles for .cms-file-info: Apply to form.small parent, fixed related UploadField spacing issues
2012-03-01 11:57:35 +01:00
form.small .cms-file-info-preview { width: 112px; }
form.small .cms-file-info-preview img { max-width: 112px; }
ENHANCEMENT visual enhancements, cms tabs, main menu drop shadow adjusted, actions panel top gradient replaced
2012-05-21 01:00:10 +02:00
form.small .cms-file-info-data { max-width: 550px; }
MINOR More generic CSS styles for .cms-file-info: Apply to form.small parent, fixed related UploadField spacing issues
2012-03-01 11:57:35 +01:00
form.small .cms-file-info-data .field { padding-bottom: 0; }
form.small .cms-file-info-data .field label { width: 112px; }
form.small .cms-file-info-data .field .middleColumn { margin-left: 120px; }
ENHANCEMENT: SSF-53 - Styled the pagination and icons on export to CSV button on User datagrid.
2012-03-06 03:55:26 +01:00
/** -------------------------------------------- Users Members Admin -------------------------------------------- */
ENHANCEMENT:SSF-53 - hid the find button from the link existing member field on users groups.
2012-03-08 04:28:45 +01:00
.members_grid span button#action_gridfield_relationfind { display: none; }
MINOR:SSF-53 changed the class of export to csv icon in scss.
2012-03-07 03:33:15 +01:00
.members_grid p button#action_export span.btn-icon-download-csv { height: 17px; }
ENHANCEMENT: SSF-53 - Styled the pagination and icons on export to CSV button on User datagrid.
2012-03-06 03:55:26 +01:00
ENHANCEMENT Adding missing MemberImportForm to SecurityAdmin, putting each importer into Users and Groups tab for context instead of Import tab, and fixing styling to be close to how it was in SS 2.4.
2012-03-24 01:20:19 +01:00
/** Import forms */
CMS CSS Minor Polishing Tweaks Fixed what I believe to be a few very minor CSS regressions, that appeared after the CSS restructure for the side-by-side preview. - Reverted background of the right panel (and tab active state) to the slightly darker shade (as per 3.0) to keep each of the 3 panels visually separate. - Slightly increased padding on ui-tabs-panel as felt a but too close for comfort. Had decreased since 3.0. - Decreased padding for logged in user name in menu, felt too excessive. (3.0 was neater) - Evened out padding above buttons in site tree sidebar Screenshots showing changes: 3.0: http://spdr.me/xauh 3.1 before commit: http://spdr.me/jkIe 3.1 after commit: http://spdr.me/IxtB
2013-03-12 23:43:33 +01:00
body.SecurityAdmin { background-color: #e6eaed; }
BUGFIX:fixed broken styling of iframe in IE for member and group import
2013-01-15 00:16:45 +01:00
ENHANCEMENT Adding missing MemberImportForm to SecurityAdmin, putting each importer into Users and Groups tab for context instead of Import tab, and fixing styling to be close to how it was in SS 2.4.
2012-03-24 01:20:19 +01:00
form.import-form ul { list-style: disc; }
form.import-form ul li { margin-left: 20px; }
form.import-form p { margin-bottom: 5px; }
form.import-form label.left { width: 250px; }
MINOR Fixing 1px gap between nav tree and page header
2012-03-27 16:36:00 +02:00
/** -------------------------------------------- Page Edit Controller -------------------------------------------- */
Side-by-side preview options styling. Thanks @adrexia for contributing.
2012-11-22 04:30:50 +01:00
/*.cms-container {
.CMSPageEditController, .CMSPageSettingsController, .CMSPageHistoryController {
// Fix pixel gap between nav tree and main page header
margin-left: -1px; // Removed to close gap far right of right tabs?
}
}*/
BUGFIX:Trac#7196 - Fixed styling issues with CMS page settings.
2012-05-02 06:58:08 +02:00
/** -------------------------------------------- Page Settings Controller -------------------------------------------- */
Side-by-side preview options styling. Thanks @adrexia for contributing.
2012-11-22 04:30:50 +01:00
.cms-container .CMSMain.CMSPageSettingsController .tab#Root_Settings .optionset li { white-space: nowrap; }
BUGFIX:Trac#7196 - Fixed styling issues with CMS page settings.
2012-05-02 06:58:08 +02:00
.cms-container .CMSMain.CMSPageSettingsController .tab#Root_Settings .optionset li label { padding-left: 2px; }
.cms-container .CMSMain.CMSPageSettingsController .tab#Root_Settings .fieldgroup .fieldgroup-field { width: 216px; padding-left: 0; }
BUGFIX: colour Adjustments Change the constructive button colour to match the colour used in the designs, and fixed up calculations to produce the correct button colour.
2012-05-08 04:15:09 +02:00
/** -------------------------------------------- Buttons for FileUpload -------------------------------------------- */
BUGFIXES: File Uploads * Add arrows back to edit-all toggle button * Don't show dimensions if the item being inserted doesn't have them. * Set pop-up windows to be a percentage of the window height for better use of space * Fix broken fieldholdersmall styling within files edit * Add placeholder if no preview *Take out minFileSize so upload will work on Android phones
2012-06-08 06:42:14 +02:00
.ss-uploadfield-item-edit-all .ui-button-text { padding-right: 0; }
Replace logout button with a more commonly used symbol * Power icon swapped for door icon * Minor hover/focus opacity effect added to button
2013-05-25 06:45:49 +02:00
.toggle-details-icon { background: url('../images/sprites-32x32-s972e408b05.png') 0 -407px no-repeat; }
.ss-uploadfield-item-edit-all .toggle-details-icon { background: url('../images/sprites-32x32-s972e408b05.png') 0 -349px no-repeat; display: inline-block; width: 8px; height: 8px; padding-left: 5px; }
.toggle-details-icon.opened { background: url('../images/sprites-32x32-s972e408b05.png') 0 -1121px no-repeat; }
.ss-uploadfield-item-edit-all .toggle-details-icon.opened { background: url('../images/sprites-32x32-s972e408b05.png') 0 -333px no-repeat; }
BUGFIX: colour Adjustments Change the constructive button colour to match the colour used in the designs, and fixed up calculations to produce the correct button colour.
2012-05-08 04:15:09 +02:00
Clean up the side-by-side code.
2012-12-06 04:01:33 +01:00
/** -------------------------------------------- Hide preview toggle link by default. May be shown in IE7 stylesheet and forced to show with js if needed -------------------------------------------- */
.cms .Actions > .cms-preview-toggle-link, .cms .cms-navigator > .cms-preview-toggle-link { display: none; }
BUGFIX show scroll bar on menu and side panels in adminstration section rather than hiding
2011-10-29 02:01:06 +02:00
/** This file defines the jstree base styling (see http://jstree.com), as well as any customizations (see bottom of file). The styles are usually added through jstree.js on DOM load, but we need it earlier in order to correctly display the uninitialized tree. */
BUG: Site Tree checkboxes and refactoring * Increased height of site tree checkbox by 3px, so users are less likely to miss it and load a page by mistake * Refactored _tree.scss to make better use of SCSS, and stop repetition of styles
2012-11-01 03:26:46 +01:00
.cms .jstree > ul > li, .TreeDropdownField .treedropdownfield-panel .jstree > ul > li { margin-left: 0px; }
.cms .jstree ul, .cms .jstree li, .TreeDropdownField .treedropdownfield-panel .jstree ul, .TreeDropdownField .treedropdownfield-panel .jstree li { display: block; margin: 0; padding: 0; background: none; list-style-type: none; }
.cms .jstree li, .TreeDropdownField .treedropdownfield-panel .jstree li { min-height: 18px; line-height: 25px; white-space: nowrap; margin-left: 18px; min-width: 18px; }
BUGFIX:fixed various styling issues in cms (raised in SSF-188)
2012-02-17 05:00:29 +01:00
.cms .jstree li.jstree-open > ul, .TreeDropdownField .treedropdownfield-panel .jstree li.jstree-open > ul { display: block; }
.cms .jstree li.jstree-closed > ul, .TreeDropdownField .treedropdownfield-panel .jstree li.jstree-closed > ul { display: none; }
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.cms .jstree li.disabled > a, .TreeDropdownField .treedropdownfield-panel .jstree li.disabled > a { color: #aaaaaa; }
BUG: fixed "regression" inserted with 9281ebc64764a58f86f685f9765e1d8b60995e5a adding a new class to SiteTree elem (edit-disabled)
2013-05-30 15:50:38 +02:00
.cms .jstree li.edit-disabled > a, .TreeDropdownField .treedropdownfield-panel .jstree li.edit-disabled > a { color: #aaaaaa; }
Add pointer to expand/collapse tree icons Make it clear that they're interactive elements
2013-01-08 18:46:08 +01:00
.cms .jstree li > .jstree-icon, .TreeDropdownField .treedropdownfield-panel .jstree li > .jstree-icon { cursor: pointer; }
BUG: Site Tree checkboxes and refactoring * Increased height of site tree checkbox by 3px, so users are less likely to miss it and load a page by mistake * Refactored _tree.scss to make better use of SCSS, and stop repetition of styles
2012-11-01 03:26:46 +01:00
.cms .jstree ins, .TreeDropdownField .treedropdownfield-panel .jstree ins { display: inline-block; text-decoration: none; width: 18px; height: 18px; margin: 0 0 0 0; padding: 0; float: left; }
Put back cog icon for multi-select batch actions (was removed in f4b080e)
2013-05-15 11:09:19 +02:00
.cms .jstree a, .TreeDropdownField .treedropdownfield-panel .jstree a { display: inline-block; line-height: 16px; height: 16px; color: black; white-space: nowrap; text-decoration: none; padding: 1px 2px; margin: 0; border: 1px solid #fff; }
Accessibility: Visible focus rings
2013-06-15 11:52:02 +02:00
.cms .jstree a:focus, .cms .jstree a:active, .cms .jstree a:hover, .TreeDropdownField .treedropdownfield-panel .jstree a:focus, .TreeDropdownField .treedropdownfield-panel .jstree a:active, .TreeDropdownField .treedropdownfield-panel .jstree a:hover { text-decoration: none; cursor: pointer; text-shadow: none; }
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.cms .jstree a > ins, .TreeDropdownField .treedropdownfield-panel .jstree a > ins { height: 16px; width: 16px; }
.cms .jstree a > ins.jstree-checkbox, .TreeDropdownField .treedropdownfield-panel .jstree a > ins.jstree-checkbox { height: 19px; }
.cms .jstree a > .jstree-icon, .TreeDropdownField .treedropdownfield-panel .jstree a > .jstree-icon { margin-right: 3px; }
BUG: Site Tree checkboxes and refactoring * Increased height of site tree checkbox by 3px, so users are less likely to miss it and load a page by mistake * Refactored _tree.scss to make better use of SCSS, and stop repetition of styles
2012-11-01 03:26:46 +01:00
.cms .jstree .jstree-real-checkbox, .TreeDropdownField .treedropdownfield-panel .jstree .jstree-real-checkbox { display: none; }
.cms .jstree .jstree-wholerow-real, .TreeDropdownField .treedropdownfield-panel .jstree .jstree-wholerow-real { position: relative; z-index: 1; }
.cms .jstree .jstree-wholerow-real li, .TreeDropdownField .treedropdownfield-panel .jstree .jstree-wholerow-real li { cursor: pointer; }
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.cms .jstree .jstree-wholerow-real a, .TreeDropdownField .treedropdownfield-panel .jstree .jstree-wholerow-real a { border-left-color: transparent !important; border-right-color: transparent !important; }
FIX make sure select dropdowns in add page dialog aren't cut off due to .parent-mode class having overflow:auto
2013-06-19 01:27:22 +02:00
.cms .jstree .jstree-wholerow, .cms .TreeDropdownField .treedropdownfield-panel .jstree .jstree-wholerow, .TreeDropdownField .treedropdownfield-panel .cms .jstree .jstree-wholerow, .cms .jstree .jstree-wholerow ul, .cms .jstree .jstree-wholerow li, .cms .TreeDropdownField .treedropdownfield-panel .jstree .jstree-wholerow ul, .TreeDropdownField .treedropdownfield-panel .cms .jstree .jstree-wholerow ul, .cms .TreeDropdownField .treedropdownfield-panel .jstree .jstree-wholerow li, .TreeDropdownField .treedropdownfield-panel .cms .jstree .jstree-wholerow li, .cms .jstree .jstree-wholerow a, .cms .jstree .jstree-wholerow a:hover, .cms .TreeDropdownField .treedropdownfield-panel .jstree .jstree-wholerow a, .TreeDropdownField .treedropdownfield-panel .cms .jstree .jstree-wholerow a, .TreeDropdownField .treedropdownfield-panel .jstree .jstree-wholerow, .TreeDropdownField .treedropdownfield-panel .jstree .jstree-wholerow ul, .TreeDropdownField .treedropdownfield-panel .jstree .jstree-wholerow li, .TreeDropdownField .treedropdownfield-panel .jstree .jstree-wholerow a, .TreeDropdownField .treedropdownfield-panel .jstree .jstree-wholerow a:hover { margin: 0 !important; padding: 0 !important; }
BUG: Site Tree checkboxes and refactoring * Increased height of site tree checkbox by 3px, so users are less likely to miss it and load a page by mistake * Refactored _tree.scss to make better use of SCSS, and stop repetition of styles
2012-11-01 03:26:46 +01:00
.cms .jstree .jstree-wholerow, .TreeDropdownField .treedropdownfield-panel .jstree .jstree-wholerow { position: relative; z-index: 0; height: 0; background: transparent !important; }
.cms .jstree .jstree-wholerow ul, .cms .jstree .jstree-wholerow li, .TreeDropdownField .treedropdownfield-panel .jstree .jstree-wholerow ul, .TreeDropdownField .treedropdownfield-panel .jstree .jstree-wholerow li { background: transparent !important; width: 100%; }
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.cms .jstree .jstree-wholerow a, .cms .jstree .jstree-wholerow a:hover, .TreeDropdownField .treedropdownfield-panel .jstree .jstree-wholerow a, .TreeDropdownField .treedropdownfield-panel .jstree .jstree-wholerow a:hover { text-indent: -9999px !important; width: 100%; border-right-width: 0px !important; border-left-width: 0px !important; }
BUG: Site Tree checkboxes and refactoring * Increased height of site tree checkbox by 3px, so users are less likely to miss it and load a page by mistake * Refactored _tree.scss to make better use of SCSS, and stop repetition of styles
2012-11-01 03:26:46 +01:00
.cms .jstree .jstree-wholerow ins, .cms .jstree .jstree-wholerow span, .cms .jstree .jstree-wholerow input, .TreeDropdownField .treedropdownfield-panel .jstree .jstree-wholerow ins, .TreeDropdownField .treedropdownfield-panel .jstree .jstree-wholerow span, .TreeDropdownField .treedropdownfield-panel .jstree .jstree-wholerow input { display: none !important; }
.cms .jstree .jstree-wholerow-span, .TreeDropdownField .treedropdownfield-panel .jstree .jstree-wholerow-span { position: absolute; left: 0; margin: 0px; padding: 0; height: 18px; border-width: 0; padding: 0; z-index: 0; }
.cms .jstree-apple.jstree-focused, .TreeDropdownField .treedropdownfield-panel .jstree-apple.jstree-focused { background: none; }
.cms .jstree-apple.jstree-focused .jstree-apple > ul, .TreeDropdownField .treedropdownfield-panel .jstree-apple.jstree-focused .jstree-apple > ul { background: none; }
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.cms a > .jstree-icon, .TreeDropdownField .treedropdownfield-panel a > .jstree-icon { display: none; }
.cms .draggable a > .jstree-icon, .TreeDropdownField .treedropdownfield-panel .draggable a > .jstree-icon { display: block; }
Fix tree arrows in TreeDropdownField Partially reverts "fixes" from 411673ed. This re-introduces the arrow on the main tree node in the CMS ("Your site name"), but that's less important than being able to navigate tree hierarchies in the first place in TreeDropdownField.
2013-01-08 18:45:35 +01:00
.cms li.jstree-open > ul, .TreeDropdownField .treedropdownfield-panel li.jstree-open > ul { display: block; margin-left: -13px; }
BUG: Site Tree checkboxes and refactoring * Increased height of site tree checkbox by 3px, so users are less likely to miss it and load a page by mistake * Refactored _tree.scss to make better use of SCSS, and stop repetition of styles
2012-11-01 03:26:46 +01:00
.cms li.jstree-open > ul li ul, .TreeDropdownField .treedropdownfield-panel li.jstree-open > ul li ul { margin-left: 2px; }
.cms li.jstree-closed > ul, .TreeDropdownField .treedropdownfield-panel li.jstree-closed > ul { display: none; }
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.cms .jstree-rtl a > .jstree-icon, .TreeDropdownField .treedropdownfield-panel .jstree-rtl a > .jstree-icon { margin-left: 3px; margin-right: 0; }
BUGFIX:fixed various styling issues in cms (raised in SSF-188)
2012-02-17 05:00:29 +01:00
.cms .jstree-rtl li, .TreeDropdownField .treedropdownfield-panel .jstree-rtl li { margin-left: 0; margin-right: 18px; }
.cms .jstree-rtl > ul > li, .TreeDropdownField .treedropdownfield-panel .jstree-rtl > ul > li { margin-right: 0px; }
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.cms .jstree-themeroller a, .TreeDropdownField .treedropdownfield-panel .jstree-themeroller a { padding: 0 2px; }
BUG: Site Tree checkboxes and refactoring * Increased height of site tree checkbox by 3px, so users are less likely to miss it and load a page by mistake * Refactored _tree.scss to make better use of SCSS, and stop repetition of styles
2012-11-01 03:26:46 +01:00
.cms .jstree-themeroller .ui-icon, .TreeDropdownField .treedropdownfield-panel .jstree-themeroller .ui-icon { overflow: visible; }
.cms .jstree-themeroller .jstree-no-icon, .TreeDropdownField .treedropdownfield-panel .jstree-themeroller .jstree-no-icon { display: none; }
FIX make sure select dropdowns in add page dialog aren't cut off due to .parent-mode class having overflow:auto
2013-06-19 01:27:22 +02:00
.cms #jstree-marker, .cms .TreeDropdownField .treedropdownfield-panel #jstree-marker, .TreeDropdownField .treedropdownfield-panel .cms #jstree-marker, .cms #jstree-marker-line, .cms .TreeDropdownField .treedropdownfield-panel #jstree-marker-line, .TreeDropdownField .treedropdownfield-panel .cms #jstree-marker-line, .TreeDropdownField .treedropdownfield-panel #jstree-marker, .TreeDropdownField .treedropdownfield-panel #jstree-marker-line { padding: 0; margin: 0; overflow: hidden; position: absolute; top: -30px; background-repeat: no-repeat; display: none; }
BUG: Site Tree checkboxes and refactoring * Increased height of site tree checkbox by 3px, so users are less likely to miss it and load a page by mistake * Refactored _tree.scss to make better use of SCSS, and stop repetition of styles
2012-11-01 03:26:46 +01:00
.cms #jstree-marker, .TreeDropdownField .treedropdownfield-panel #jstree-marker { line-height: 10px; font-size: 12px; height: 12px; width: 8px; z-index: 10001; background-color: transparent; text-shadow: 1px 1px 1px white; color: black; }
Put back cog icon for multi-select batch actions (was removed in f4b080e)
2013-05-15 11:09:19 +02:00
.cms #jstree-marker-line, .TreeDropdownField .treedropdownfield-panel #jstree-marker-line { line-height: 0%; font-size: 1px; height: 1px; width: 100px; z-index: 10000; background-color: #456c43; cursor: pointer; border: 1px solid #eeeeee; border-left: 0; -moz-box-shadow: 0px 0px 2px #666; -webkit-box-shadow: 0px 0px 2px #666; box-shadow: 0px 0px 2px #666; -moz-border-radius: 1px; border-radius: 1px; -webkit-border-radius: 1px; }
MINOR Updating compass sprites with its changed ordering starting with 0.12 release (see http://compass-style.org/blog/2012/02/01/compass-0-12-is-released/)
2012-06-03 23:22:29 +02:00
.cms #vakata-contextmenu, .TreeDropdownField .treedropdownfield-panel #vakata-contextmenu { display: block; visibility: hidden; left: 0; top: -200px; position: absolute; margin: 0; padding: 0; min-width: 180px; background: #FFF; border: 1px solid silver; z-index: 10000; *width: 180px; -webkit-box-shadow: 0 0 10px #cccccc; -moz-box-shadow: 0 0 10px #cccccc; box-shadow: 0 0 10px #cccccc; }
Put back cog icon for multi-select batch actions (was removed in f4b080e)
2013-05-15 11:09:19 +02:00
.cms #vakata-contextmenu::before, .TreeDropdownField .treedropdownfield-panel #vakata-contextmenu::before { content: ""; display: block; /* reduce the damage in FF3.0 */ position: absolute; top: -10px; left: 24px; width: 0; border-width: 0 6px 10px 6px; border-color: #FFF transparent; border-style: solid; z-index: 10000; }
.cms #vakata-contextmenu::after, .TreeDropdownField .treedropdownfield-panel #vakata-contextmenu::after { content: ""; display: block; /* reduce the damage in FF3.0 */ position: absolute; top: -11px; left: 23px; width: 0; border-width: 0 7px 11px 7px; border-color: #CCC transparent; border-style: solid; }
BUGFIX:fixed various styling issues in cms (raised in SSF-188)
2012-02-17 05:00:29 +01:00
.cms #vakata-contextmenu ul, .TreeDropdownField .treedropdownfield-panel #vakata-contextmenu ul { min-width: 180px; *width: 180px; }
.cms #vakata-contextmenu ul, .cms #vakata-contextmenu li, .TreeDropdownField .treedropdownfield-panel #vakata-contextmenu ul, .TreeDropdownField .treedropdownfield-panel #vakata-contextmenu li { margin: 0; padding: 0; list-style-type: none; display: block; }
ENHANCEMENT: Rightlick submenu styles and ability to add page with pagetype
2012-03-28 01:43:16 +02:00
.cms #vakata-contextmenu li, .TreeDropdownField .treedropdownfield-panel #vakata-contextmenu li { line-height: 20px; min-height: 23px; position: relative; padding: 0px; }
.cms #vakata-contextmenu li:last-child, .TreeDropdownField .treedropdownfield-panel #vakata-contextmenu li:last-child { margin-bottom: 1px; }
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.cms #vakata-contextmenu li a, .TreeDropdownField .treedropdownfield-panel #vakata-contextmenu li a { padding: 1px 10px; line-height: 23px; display: block; text-decoration: none; margin: 1px 1px 0 1px; border: 0; }
.cms #vakata-contextmenu li a:hover, .TreeDropdownField .treedropdownfield-panel #vakata-contextmenu li a:hover { padding: 1px 10px; background: #3875d7; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIyMCUiIHN0b3AtY29sb3I9IiMzODc1ZDciLz48c3RvcCBvZmZzZXQ9IjkwJSIgc3RvcC1jb2xvcj0iIzJhNjJiYyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #3875d7), color-stop(90%, #2a62bc)); background-image: -webkit-linear-gradient(top, #3875d7 20%, #2a62bc 90%); background-image: -moz-linear-gradient(top, #3875d7 20%, #2a62bc 90%); background-image: -o-linear-gradient(top, #3875d7 20%, #2a62bc 90%); background-image: linear-gradient(top, #3875d7 20%, #2a62bc 90%); color: #FFF; border: none; }
ENHANCEMENT: Rightlick submenu styles and ability to add page with pagetype
2012-03-28 01:43:16 +02:00
.cms #vakata-contextmenu li ins, .TreeDropdownField .treedropdownfield-panel #vakata-contextmenu li ins { float: left; width: 0; height: 0; text-decoration: none; margin-right: 2px; }
.cms #vakata-contextmenu li .jstree-pageicon, .TreeDropdownField .treedropdownfield-panel #vakata-contextmenu li .jstree-pageicon { margin-top: 3px; margin-right: 5px; }
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.cms #vakata-contextmenu li.vakata-hover > a, .TreeDropdownField .treedropdownfield-panel #vakata-contextmenu li.vakata-hover > a { padding: 1px 10px; background: #3875d7; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIyMCUiIHN0b3AtY29sb3I9IiMzODc1ZDciLz48c3RvcCBvZmZzZXQ9IjkwJSIgc3RvcC1jb2xvcj0iIzJhNjJiYyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #3875d7), color-stop(90%, #2a62bc)); background-image: -webkit-linear-gradient(top, #3875d7 20%, #2a62bc 90%); background-image: -moz-linear-gradient(top, #3875d7 20%, #2a62bc 90%); background-image: -o-linear-gradient(top, #3875d7 20%, #2a62bc 90%); background-image: linear-gradient(top, #3875d7 20%, #2a62bc 90%); color: #FFF; border: none; }
BUGFIX:fixed various styling issues in cms (raised in SSF-188)
2012-02-17 05:00:29 +01:00
.cms #vakata-contextmenu .right, .TreeDropdownField .treedropdownfield-panel #vakata-contextmenu .right { right: 100%; left: auto; }
.cms #vakata-contextmenu .bottom, .TreeDropdownField .treedropdownfield-panel #vakata-contextmenu .bottom { bottom: -1px; top: auto; }
BUG: Site Tree checkboxes and refactoring * Increased height of site tree checkbox by 3px, so users are less likely to miss it and load a page by mistake * Refactored _tree.scss to make better use of SCSS, and stop repetition of styles
2012-11-01 03:26:46 +01:00
.cms #vakata-contextmenu li ul, .TreeDropdownField .treedropdownfield-panel #vakata-contextmenu li ul { display: none; position: absolute; top: -2px; left: 100%; background: #FFF; border: 1px solid silver; -webkit-box-shadow: 0 0 10px #cccccc; -moz-box-shadow: 0 0 10px #cccccc; box-shadow: 0 0 10px #cccccc; }
.cms #vakata-contextmenu li.vakata-separator, .TreeDropdownField .treedropdownfield-panel #vakata-contextmenu li.vakata-separator { min-height: 0; height: 1px; line-height: 1px; font-size: 1px; overflow: hidden; margin: 0 2px; background: #ccc; padding: 0; }
.cms #vakata-dragged, .TreeDropdownField .treedropdownfield-panel #vakata-dragged { display: block; margin: 0 0 0 0; padding: 4px 4px 4px 24px; position: absolute; top: -2000px; line-height: 16px; z-index: 10000; }
BUGFIX:fixed various styling issues in cms (raised in SSF-188)
2012-02-17 05:00:29 +01:00
.cms #vakata-dragged ins, .TreeDropdownField .treedropdownfield-panel #vakata-dragged ins { display: block; text-decoration: none; width: 16px; height: 16px; margin: 0 0 0 0; padding: 0; position: absolute; top: 4px; left: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-border-radius: 4px; }
.cms #vakata-dragged .jstree-ok, .TreeDropdownField .treedropdownfield-panel #vakata-dragged .jstree-ok { background: green; }
.cms #vakata-dragged .jstree-invalid, .TreeDropdownField .treedropdownfield-panel #vakata-dragged .jstree-invalid { background: red; }
MINOR Cleaned up CMS dialog styling (now works with/without tabs, in iframe and inline markup), removed superfluous SCSS variable declarations
2012-01-03 17:38:11 +01:00
MINOR Tree and content toolbar styling fixes (SSF-138, SSF-71)
2012-02-07 23:24:42 +01:00
.jstree-apple li, .jstree-apple .jstree-apple ins { background: none; }
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.jstree-apple .jstree-unchecked > a > .jstree-checkbox, .jstree-apple .jstree-checked > a > .jstree-checkbox, .jstree-apple .jstree-undetermined > a > .jstree-checkbox { margin-right: 3px; }
MINOR Tree and content toolbar styling fixes (SSF-138, SSF-71)
2012-02-07 23:24:42 +01:00
BUGFIX:fixed various styling issues in cms (raised in SSF-188)
2012-02-17 05:00:29 +01:00
.tree-holder.jstree-apple, .cms-tree.jstree-apple { /* comment speech bubble - ccs3 only - source: http://nicolasgallagher.com/pure-css-speech-bubbles/demo/ */ }
BUG: Site Tree checkboxes and refactoring * Increased height of site tree checkbox by 3px, so users are less likely to miss it and load a page by mistake * Refactored _tree.scss to make better use of SCSS, and stop repetition of styles
2012-11-01 03:26:46 +01:00
.tree-holder.jstree-apple li, .cms-tree.jstree-apple li { padding: 0px; clear: left; }
BUGFIX:fixed various styling issues in cms (raised in SSF-188)
2012-02-17 05:00:29 +01:00
.tree-holder.jstree-apple li.Root strong, .cms-tree.jstree-apple li.Root strong { font-weight: bold; padding-left: 1px; }
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.tree-holder.jstree-apple li.Root > a .jstree-icon, .cms-tree.jstree-apple li.Root > a .jstree-icon { background-position: -56px -36px; }
Avoid collision of status flags in tree items when updating tree nodes Fixes silverstripe/silverstripe-cms#445 See https://github.com/silverstripe/silverstripe-framework/pull/1996 Thanks to Jean-Fabien for getting this started
2013-05-25 11:27:50 +02:00
.tree-holder.jstree-apple li.status-deletedonlive .text, .cms-tree.jstree-apple li.status-deletedonlive .text { text-decoration: line-through; }
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.tree-holder.jstree-apple li.jstree-checked > a, .tree-holder.jstree-apple li.jstree-checked > a:link, .cms-tree.jstree-apple li.jstree-checked > a, .cms-tree.jstree-apple li.jstree-checked > a:link { background-color: #efe999; }
NEW Enforce max node counts to avoid excessive resource usage Rendering potentially 1000s of nodes can exceed the CPU and memory constraints of a normal PHP process, as well as the rendering capabilities of browsers. Set a hard maximum for the renderable nodes, deferring to a "show as list" action in the main CMS tree. For TreeDropdownField, we don't have the list fallback option, so ask the user to search for the node title instead. Also makes both the "node_threshold_total" and "node_threshold_leaf" values configurable
2013-03-19 22:26:48 +01:00
.tree-holder.jstree-apple li.readonly, .cms-tree.jstree-apple li.readonly { color: #aaaaaa; padding-left: 18px; }
.tree-holder.jstree-apple li.readonly a, .tree-holder.jstree-apple li.readonly a:link, .cms-tree.jstree-apple li.readonly a, .cms-tree.jstree-apple li.readonly a:link { margin: 0; padding: 0; }
.tree-holder.jstree-apple li.readonly .jstree-icon, .cms-tree.jstree-apple li.readonly .jstree-icon { display: none; }
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.tree-holder.jstree-apple a, .tree-holder.jstree-apple a:link, .cms-tree.jstree-apple a, .cms-tree.jstree-apple a:link { color: #0073c1; padding: 3px 6px 3px 3px; border: none; display: inline-block; margin-right: 5px; }
BUG: Site Tree checkboxes and refactoring * Increased height of site tree checkbox by 3px, so users are less likely to miss it and load a page by mistake * Refactored _tree.scss to make better use of SCSS, and stop repetition of styles
2012-11-01 03:26:46 +01:00
.tree-holder.jstree-apple ins, .cms-tree.jstree-apple ins { background-color: transparent; background-image: url(../images/sitetree_ss_default_icons.png); }
BUG: One too many brackets in _style.scss Caused when merging 3.0 back into master
2012-10-31 23:16:13 +01:00
.tree-holder.jstree-apple span.badge, .cms-tree.jstree-apple span.badge { clear: both; text-transform: uppercase; display: inline-block; padding: 0px 3px; font-size: 0.75em; line-height: 1em; margin-left: 3px; margin-right: 6px; margin-top: -1px; -webkit-border-radius: 2px 2px; -moz-border-radius: 2px / 2px; border-radius: 2px / 2px; }
Avoid collision of status flags in tree items when updating tree nodes Fixes silverstripe/silverstripe-cms#445 See https://github.com/silverstripe/silverstripe-framework/pull/1996 Thanks to Jean-Fabien for getting this started
2013-05-25 11:27:50 +02:00
.tree-holder.jstree-apple span.badge.status-modified, .tree-holder.jstree-apple span.badge.status-addedtodraft, .cms-tree.jstree-apple span.badge.status-modified, .cms-tree.jstree-apple span.badge.status-addedtodraft { color: #7E7470; border: 1px solid #C9B800; background-color: #FFF0BC; }
.tree-holder.jstree-apple span.badge.status-deletedonlive, .tree-holder.jstree-apple span.badge.status-removedfromdraft, .cms-tree.jstree-apple span.badge.status-deletedonlive, .cms-tree.jstree-apple span.badge.status-removedfromdraft { color: #636363; border: 1px solid #E49393; background-color: #F2DADB; }
.tree-holder.jstree-apple span.badge.status-workflow-approval, .cms-tree.jstree-apple span.badge.status-workflow-approval { color: #56660C; border: 1px solid #7C8816; background-color: #DAE79A; }
Put back cog icon for multi-select batch actions (was removed in f4b080e)
2013-05-15 11:09:19 +02:00
.tree-holder.jstree-apple span.comment-count, .cms-tree.jstree-apple span.comment-count { clear: both; position: relative; text-transform: uppercase; display: inline-block; overflow: visible; padding: 0px 3px; font-size: 0.75em; line-height: 1em; margin-left: 3px; margin-right: 6px; -webkit-border-radius: 2px 2px; -moz-border-radius: 2px / 2px; border-radius: 2px / 2px; color: #7E7470; border: 1px solid #C9B800; background-color: #FFF0BC; }
FIX make sure select dropdowns in add page dialog aren't cut off due to .parent-mode class having overflow:auto
2013-06-19 01:27:22 +02:00
.tree-holder.jstree-apple span.comment-count span.comment-count:before, .tree-holder.jstree-apple span.comment-count span.comment-count:after, .cms-tree.jstree-apple span.comment-count span.comment-count:before, .cms-tree.jstree-apple span.comment-count span.comment-count:after { content: ""; position: absolute; border-style: solid; /* reduce the damage in FF3.0 */ display: block; width: 0; }
Put back cog icon for multi-select batch actions (was removed in f4b080e)
2013-05-15 11:09:19 +02:00
.tree-holder.jstree-apple span.comment-count:before, .cms-tree.jstree-apple span.comment-count:before { bottom: -4px; /* value = - border-top-width - border-bottom-width */ left: 3px; /* controls horizontal position */ border-width: 4px 4px 0; border-color: #C9B800 transparent; }
.tree-holder.jstree-apple span.comment-count:after, .cms-tree.jstree-apple span.comment-count:after { bottom: -3px; /* value = - border-top-width - border-bottom-width */ left: 4px; /* value = (:before left) + (:before border-left) - (:after border-left) */ border-width: 3px 3px 0; border-color: #FFF0BC transparent; }
BUGFIX:fixed various styling issues in cms (raised in SSF-188)
2012-02-17 05:00:29 +01:00
.tree-holder.jstree-apple .jstree-hovered, .cms-tree.jstree-apple .jstree-hovered { text-shadow: none; text-decoration: none; }
ENHANCEMENT: Rightlick submenu styles and ability to add page with pagetype
2012-03-28 01:43:16 +02:00
.tree-holder.jstree-apple .jstree-closed > ins, .cms-tree.jstree-apple .jstree-closed > ins { background-position: 0 0; }
.tree-holder.jstree-apple .jstree-open > ins, .cms-tree.jstree-apple .jstree-open > ins { background-position: -20px 0; }
BUGFIX show scroll bar on menu and side panels in adminstration section rather than hiding
2011-10-29 02:01:06 +02:00
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
a .jstree-pageicon { float: left; margin-right: 4px; }
li.class-HomePage > a .jstree-pageicon { background-position: 0 -48px; }
li.class-RedirectorPage > a .jstree-pageicon { background-position: 0 -16px; }
li.class-VirtualPage > a .jstree-pageicon { background-position: 0 -32px; }
BUG Fixed broken ErrorPage icons in CMS view
2013-04-10 07:15:42 +02:00
li.class-ErrorPage > a .jstree-pageicon { background-position: 0 -112px; }
BUGFIX show scroll bar on menu and side panels in adminstration section rather than hiding
2011-10-29 02:01:06 +02:00
MINOR Improved perceived UI feedback by hiding various elements until they're styled properly (TinyMCE, tree)
2011-12-14 16:54:52 +01:00
.cms-tree { visibility: hidden; }
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.cms-tree.multiple li > a > .jstree-icon { display: none; }
.cms-tree.multiple li > a > .jstree-icon.jstree-checkbox { display: inline-block; }
.cms-tree.multiple li#record-0 > a .jstree-checkbox { display: none; }
.cms-tree a.jstree-loading .jstree-icon { background-image: none !important; }
.cms-tree a.jstree-loading .jstree-pageicon { background: url(../images/throbber.gif) top left no-repeat; }
MINOR Improved perceived UI feedback by hiding various elements until they're styled properly (TinyMCE, tree)
2011-12-14 16:54:52 +01:00
MINOR Update @package values to match renaming sapphire
2012-04-12 08:02:46 +02:00
/** Styles for the left hand side menu and header for the admin panels. Take into consideration CSS selector performance. @package framework @subpackage admin */
Side-by-side preview options fixes. Add extra preview-mode selector to the CMS actions so we can show something when the preview is closed (and with it all options are not visible). Thanks @mateusz, @clarkepaul and @robert-h-curry for contributing.
2012-11-27 06:03:43 +01:00
.cms-logo-header { position: relative !important; top: auto !important; height: auto !important; padding: 0 8px; line-height: 24px; background-color: #22385b; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzMwNGU4MCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzE0MjEzNiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #304e80), color-stop(100%, #142136)); background-image: -webkit-linear-gradient(#304e80, #142136); background-image: -moz-linear-gradient(#304e80, #142136); background-image: -o-linear-gradient(#304e80, #142136); background-image: linear-gradient(#304e80, #142136); }
BUGFIX: fixed trac 7665 - CMS Menu header now changes height depending on the name of the admin and greeting message. position and height were being set inline so added !important to override this.
2012-08-15 01:28:31 +02:00
.cms-logo-header span { color: white; display: block; padding-left: 26px; }
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.cms-logo-header span a { color: #3ebae0; display: inline; }
BUGFIX show scroll bar on menu and side panels in adminstration section rather than hiding
2011-10-29 02:01:06 +02:00
NEW Side by side editing functionality - first cut (os#7412) Introduces a preview window that appears when the screen is wide enough, removes old preview button, adds a draft-public switch, adds variety of preview options which are not hooked up yet. Goes along with cms commit fa3738a9f4c5181eabf18a77ca89792d31592250
2012-11-22 02:14:11 +01:00
.cms-logo { border-bottom: 1px solid #1a2a45; overflow: hidden; padding: 10px 0 9px; /* should come to 40px with border bottom and line-height */ position: relative; vertical-align: middle; font-size: 12px; min-height: 20px; }
BUG: Logo padding in collapsed Menu
2012-07-26 05:41:44 +02:00
.collapsed .cms-logo { padding: 0; }
BUGFIX show scroll bar on menu and side panels in adminstration section rather than hiding
2011-10-29 02:01:06 +02:00
.cms-logo .version { display: none; }
Side-by-side preview options fixes. Add extra preview-mode selector to the CMS actions so we can show something when the preview is closed (and with it all options are not visible). Thanks @mateusz, @clarkepaul and @robert-h-curry for contributing.
2012-11-27 06:03:43 +01:00
.cms-logo a { position: absolute; top: 8px; bottom: 8px; display: block; width: 24px; background: url("../images/logo_small.png") no-repeat left center; text-indent: -9999em; padding: 0 1px; left: 0; }
NEW Side by side editing functionality - first cut (os#7412) Introduces a preview window that appears when the screen is wide enough, removes old preview button, adds a draft-public switch, adds variety of preview options which are not hooked up yet. Goes along with cms commit fa3738a9f4c5181eabf18a77ca89792d31592250
2012-11-22 02:14:11 +01:00
.cms-logo span { font-weight: bold; font-size: 12px; line-height: 16px; padding: 2px 0; margin-left: 30px; }
BUGFIX show scroll bar on menu and side panels in adminstration section rather than hiding
2011-10-29 02:01:06 +02:00
CMS CSS Minor Polishing Tweaks Fixed what I believe to be a few very minor CSS regressions, that appeared after the CSS restructure for the side-by-side preview. - Reverted background of the right panel (and tab active state) to the slightly darker shade (as per 3.0) to keep each of the 3 panels visually separate. - Slightly increased padding on ui-tabs-panel as felt a but too close for comfort. Had decreased since 3.0. - Decreased padding for logged in user name in menu, felt too excessive. (3.0 was neater) - Evened out padding above buttons in site tree sidebar Screenshots showing changes: 3.0: http://spdr.me/xauh 3.1 before commit: http://spdr.me/jkIe 3.1 after commit: http://spdr.me/IxtB
2013-03-12 23:43:33 +01:00
.cms-login-status { border-top: 1px solid #19435c; padding: 8px 0 9.6px; line-height: 16px; font-size: 11px; }
Replace logout button with a more commonly used symbol * Power icon swapped for door icon * Minor hover/focus opacity effect added to button
2013-05-25 06:45:49 +02:00
.cms-login-status .logout-link { display: inline-block; height: 16px; width: 16px; float: left; margin: 0 8px 0 5px; background: url('../images/sprites-32x32-s972e408b05.png') 0 -1095px no-repeat; text-indent: -9999em; opacity: 0.9; }
.cms-login-status .logout-link:hover, .cms-login-status .logout-link:focus { opacity: 1; }
BUGFIX show scroll bar on menu and side panels in adminstration section rather than hiding
2011-10-29 02:01:06 +02:00
Side-by-side preview options fixes. Add extra preview-mode selector to the CMS actions so we can show something when the preview is closed (and with it all options are not visible). Thanks @mateusz, @clarkepaul and @robert-h-curry for contributing.
2012-11-27 06:03:43 +01:00
.cms-menu { z-index: 80; background: #b0bec7; width: 160px; -webkit-box-shadow: rgba(0, 0, 0, 0.9) 0 0 3px; -moz-box-shadow: rgba(0, 0, 0, 0.9) 0 0 3px; box-shadow: rgba(0, 0, 0, 0.9) 0 0 3px; }
.cms-menu a { text-decoration: none; }
.cms-menu .cms-panel-content { width: 160px; overflow-x: hidden; overflow-y: auto; position: relative !important; top: auto !important; left: auto !important; }
.cms-menu.collapsed { width: 40px; cursor: auto; z-index: 1000; }
BUGFIX show scroll bar on menu and side panels in adminstration section rather than hiding
2011-10-29 02:01:06 +02:00
.cms-menu.collapsed .cms-panel-header { width: 30px; }
.cms-menu.collapsed .cms-panel-header span { display: none; }
.cms-menu.collapsed .cms-menu-list { overflow-x: hidden; overflow-y: auto; }
BUGFIX: Padding in navigation elements in IE7 Fixes the gap between navigation elements in IE7
2012-06-21 01:48:39 +02:00
.cms-menu.collapsed .cms-menu-list li { width: 100%; float: left; }
BUGFIX show scroll bar on menu and side panels in adminstration section rather than hiding
2011-10-29 02:01:06 +02:00
.cms-menu.collapsed .cms-menu-list li span.text { display: none; }
.cms-menu.collapsed .cms-menu-list li ul { display: none; }
BUGFIX: fixed trac 7665 - CMS Menu header now changes height depending on the name of the admin and greeting message. position and height were being set inline so added !important to override this.
2012-08-15 01:28:31 +02:00
.cms-menu.collapsed .cms-login-status { height: 16px; }
.cms-menu.collapsed .cms-login-status span { display: none; }
NEW Side by side editing functionality - first cut (os#7412) Introduces a preview window that appears when the screen is wide enough, removes old preview button, adds a draft-public switch, adds variety of preview options which are not hooked up yet. Goes along with cms commit fa3738a9f4c5181eabf18a77ca89792d31592250
2012-11-22 02:14:11 +01:00
.cms-menu.collapsed .cms-logo { height: 20px; padding: 10px 0 9px; }
BUGFIX show scroll bar on menu and side panels in adminstration section rather than hiding
2011-10-29 02:01:06 +02:00
.cms-menu.collapsed.cms-panel .cms-panel-content { display: block; }
.cms-menu-list li { /* Style applied to the menu flyout only when the collapsed setting */ }
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.cms-menu-list li a { display: block; height: 24px; line-height: 24px; font-size: 12px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; text-shadow: #bfcad2 1px 1px 0; color: #1f1f1f; padding: 7px 5px 7px 8px; background-color: #b0bec7; cursor: pointer; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2IwYmVjNyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzkyYTViMiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #b0bec7), color-stop(100%, #92a5b2)); background-image: -webkit-linear-gradient(#b0bec7, #92a5b2); background-image: -moz-linear-gradient(#b0bec7, #92a5b2); background-image: -o-linear-gradient(#b0bec7, #92a5b2); background-image: linear-gradient(#b0bec7, #92a5b2); border-top: 1px solid #c2cdd4; border-bottom: 1px solid #748d9d; }
.cms-menu-list li a:hover { text-decoration: none; background-color: #b6c3cb; border-bottom: 1px solid #8399a7; color: #2c2c2c; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2JmY2FkMiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2IwYmVjNyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #bfcad2), color-stop(100%, #b0bec7)); background-image: -webkit-linear-gradient(#bfcad2, #b0bec7); background-image: -moz-linear-gradient(#bfcad2, #b0bec7); background-image: -o-linear-gradient(#bfcad2, #b0bec7); background-image: linear-gradient(#bfcad2, #b0bec7); }
.cms-menu-list li a:focus, .cms-menu-list li a:active { border-top: 1px solid #a1b2bc; text-decoration: none; background-color: #a1b2bc; color: #393939; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzkyYTViMiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ExYjJiYyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #92a5b2), color-stop(100%, #a1b2bc)); background-image: -webkit-linear-gradient(#92a5b2, #a1b2bc); background-image: -moz-linear-gradient(#92a5b2, #a1b2bc); background-image: -o-linear-gradient(#92a5b2, #a1b2bc); background-image: linear-gradient(#92a5b2, #a1b2bc); }
.cms-menu-list li a .icon { display: inline-block; float: left; margin: 4px 10px 0 4px; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70); opacity: 0.7; }
.cms-menu-list li a .text { display: inline-block; float: left; }
.cms-menu-list li a .toggle-children { display: inline-block; float: right; width: 20px; height: 100%; cursor: pointer; }
Replace logout button with a more commonly used symbol * Power icon swapped for door icon * Minor hover/focus opacity effect added to button
2013-05-25 06:45:49 +02:00
.cms-menu-list li a .toggle-children .toggle-children-icon { display: inline-block; width: 8px; height: 8px; background: url('../images/sprites-32x32-s972e408b05.png') 0 -349px no-repeat; vertical-align: middle; }
.cms-menu-list li a .toggle-children.opened .toggle-children-icon { background: url('../images/sprites-32x32-s972e408b05.png') 0 -333px no-repeat; }
Side-by-side preview options fixes. Add extra preview-mode selector to the CMS actions so we can show something when the preview is closed (and with it all options are not visible). Thanks @mateusz, @clarkepaul and @robert-h-curry for contributing.
2012-11-27 06:03:43 +01:00
.cms-menu-list li ul li a { border-top: 1px solid #b6c3cb; }
.cms-menu-list li.current a { color: white; text-shadow: #1e5270 0 -1px 0; border-top: 1px solid #55a4d2; border-bottom: 1px solid #236184; background-color: #338dc1; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzMzOGRjMSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzI4NzA5OSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #338dc1), color-stop(100%, #287099)); background-image: -webkit-linear-gradient(#338dc1, #287099); background-image: -moz-linear-gradient(#338dc1, #287099); background-image: -o-linear-gradient(#338dc1, #287099); background-image: linear-gradient(#338dc1, #287099); }
Replace logout button with a more commonly used symbol * Power icon swapped for door icon * Minor hover/focus opacity effect added to button
2013-05-25 06:45:49 +02:00
.cms-menu-list li.current a .toggle-children .toggle-children-icon { background: url('../images/sprites-32x32-s972e408b05.png') 0 -407px no-repeat; }
.cms-menu-list li.current a .toggle-children.opened .toggle-children-icon { background: url('../images/sprites-32x32-s972e408b05.png') 0 -1121px no-repeat; }
BUGFIX show scroll bar on menu and side panels in adminstration section rather than hiding
2011-10-29 02:01:06 +02:00
.cms-menu-list li.current ul { border-top: none; display: block; }
.cms-menu-list li.current li { background-color: #287099; }
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.cms-menu-list li.current li a { font-size: 11px; padding: 0 10px 0 40px; height: 32px; line-height: 32px; color: #e2f0f7; background: none; border-top: 1px solid #2f81b1; border-bottom: 1px solid #1e5270; }
.cms-menu-list li.current li a.current, .cms-menu-list li.current li a:hover { background: #2e7ead; border-top: 1px solid #2e7ead; color: white; }
.cms-menu-list li.current li a:focus { background: #236184; border-top: 1px solid #1e5270; color: white; }
ENHANCEMENT visual enhancements, cms tabs, main menu drop shadow adjusted, actions panel top gradient replaced
2012-05-21 01:00:10 +02:00
.cms-menu-list li.current li.current { background: #2e7ead; border-top: 1px solid #2e7ead; border-top: none; }
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.cms-menu-list li.current li.current a { font-weight: bold; color: white; }
.cms-menu-list li.current li.first a { border-top: none; }
API Add action tabsets as a interface idiom. Introduces the concept of action tabsets - usage of TabSet and Tabs in between the action buttons to allow richer set of capabilities that can be offered to the user. Goes along with c8d0cdec99c95dbed3b58ebcc098cc9d22c58206 that implements a change to the CMS actions.
2012-11-21 22:01:02 +01:00
.cms-menu-list li ul.collapse { display: none; }
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.cms-menu-list li ul.collapse li a { background-image: none; font-size: 11px; padding: 0 10px 0 40px; height: 32px; line-height: 32px; }
BUGFIX show scroll bar on menu and side panels in adminstration section rather than hiding
2011-10-29 02:01:06 +02:00
.cms-menu-list li ul.collapsed-flyout { display: block; }
BUG: Extends too generic
2012-11-28 22:20:00 +01:00
.cms-menu-list li ul.collapsed-flyout li a { font-size: 11px; padding: 0 10px 0 16px; height: 32px; line-height: 32px; }
.cms-menu-list li ul.collapsed-flyout li.current a { font-weight: bold; }
.cms-menu-list li ul.collapsed-flyout li.first a { border-top: 1px solid #92a5b2; }
ENHANCEMENT Added children toggle actions to CMS menu, fixed menu link update behaviour when records change
2012-01-05 17:03:38 +01:00
.cms-menu-list.collapsed li .text, .cms-menu-list.collapsed li .toggle-children { display: none; }
BUGFIX show scroll bar on menu and side panels in adminstration section rather than hiding
2011-10-29 02:01:06 +02:00
.cms-menu-list.collapsed li > li { display: none; }
MINOR Moved ModelAdmin styles into separate file
2012-01-03 17:19:23 +01:00
NEW Side by side editing functionality - first cut (os#7412) Introduces a preview window that appears when the screen is wide enough, removes old preview button, adds a draft-public switch, adds variety of preview options which are not hooked up yet. Goes along with cms commit fa3738a9f4c5181eabf18a77ca89792d31592250
2012-11-22 02:14:11 +01:00
/* -------------------------- */
Side-by-side preview options fixes. Add extra preview-mode selector to the CMS actions so we can show something when the preview is closed (and with it all options are not visible). Thanks @mateusz, @clarkepaul and @robert-h-curry for contributing.
2012-11-27 06:03:43 +01:00
.cms-content-controls { /* Styling the background, controls sit on */ /* Styling for icons in controls */ /* Preview selectors. Overrides default chosen styles and applies its own */ }
.cms-content-controls.cms-preview-controls { z-index: 1; background: #eceff1; height: 30px; /* should be set in js Layout to match page actions */ padding: 12px 12px; }
Replace the state selector switch to support more than 2 states.
2012-12-03 03:17:16 +01:00
.cms-content-controls .icon-view, .cms-content-controls .preview-selector.dropdown a.chzn-single { white-space: nowrap; }
.cms-content-controls .icon-view:before, .cms-content-controls .preview-selector.dropdown a.chzn-single:before { display: inline-block; float: left; content: ''; width: 23px; height: 17px; overflow: hidden; }
Replace logout button with a more commonly used symbol * Power icon swapped for door icon * Minor hover/focus opacity effect added to button
2013-05-25 06:45:49 +02:00
.cms-content-controls .icon-auto:before { background: url('../images/sprites-32x32-s972e408b05.png') 0 -108px no-repeat; }
.cms-content-controls .icon-desktop:before { background: url('../images/sprites-32x32-s972e408b05.png') 0 -81px no-repeat; }
.cms-content-controls .icon-tablet:before { background: url('../images/sprites-32x32-s972e408b05.png') 0 -162px no-repeat; }
.cms-content-controls .icon-mobile:before { background: url('../images/sprites-32x32-s972e408b05.png') 0 -189px no-repeat; }
.cms-content-controls .icon-split:before { background: url('../images/sprites-32x32-s972e408b05.png') 0 -135px no-repeat; }
.cms-content-controls .icon-edit:before { background: url('../images/sprites-32x32-s972e408b05.png') 0 -27px no-repeat; }
.cms-content-controls .icon-preview:before { background: url('../images/sprites-32x32-s972e408b05.png') 0 0 no-repeat; }
.cms-content-controls .icon-window:before { background: url('../images/sprites-32x32-s972e408b05.png') 0 -54px no-repeat; }
Side-by-side preview options fixes. Add extra preview-mode selector to the CMS actions so we can show something when the preview is closed (and with it all options are not visible). Thanks @mateusz, @clarkepaul and @robert-h-curry for contributing.
2012-11-27 06:03:43 +01:00
.cms-content-controls .cms-navigator { width: 100%; }
Replace the state selector switch to support more than 2 states.
2012-12-03 03:17:16 +01:00
.cms-content-controls .preview-selector.dropdown a.chzn-single { text-indent: -200px; }
Ability to rotate the mobile preview in side-by-side preview.
2012-12-06 03:22:45 +01:00
.cms-content-controls .preview-selector { float: right; border-bottom: none; position: relative; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; margin: 3px 0 0 4px; padding: 0; height: 28px; }
.cms-content-controls .preview-selector a.chzn-single { width: 20px; padding: 6px 5px 5px; height: 18px; margin: -3px 0 0; filter: none; /* remove ie background */ background: none; border: none; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; }
.cms-content-controls .preview-selector a.chzn-single:hover, .cms-content-controls .preview-selector a.chzn-single.chzn-single-with-drop { background-color: #dae0e5; -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.05) inset, 0 1px 0 rgba(248, 248, 248, 0.9); -moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.05) inset, 0 1px 0 rgba(248, 248, 248, 0.9); box-shadow: 0 0 3px rgba(0, 0, 0, 0.05) inset, 0 1px 0 rgba(248, 248, 248, 0.9); }
Side-by-side preview options fixes. Add extra preview-mode selector to the CMS actions so we can show something when the preview is closed (and with it all options are not visible). Thanks @mateusz, @clarkepaul and @robert-h-curry for contributing.
2012-11-27 06:03:43 +01:00
.cms-content-controls .preview-selector a.chzn-single.chzn-single-with-drop { -webkit-border-radius: 0 0 3px 3px; -moz-border-radius: 0 0 3px 3px; -ms-border-radius: 0 0 3px 3px; -o-border-radius: 0 0 3px 3px; border-radius: 0 0 3px 3px; }
.cms-content-controls .preview-selector a.chzn-single div { display: none; }
.cms-content-controls .preview-selector.open .chzn-drop { position: absolute; left: auto !important; right: 0; }
.cms-content-controls .preview-selector .chzn-drop { -webkit-border-radius: 3px 3px 0 3px; -moz-border-radius: 3px 3px 0 3px; -ms-border-radius: 3px 3px 0 3px; -o-border-radius: 3px 3px 0 3px; border-radius: 3px 3px 0 3px; -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.1); box-shadow: 0 0 3px rgba(0, 0, 0, 0.1); }
.cms-content-controls .preview-selector .chzn-drop .chzn-results { width: 135px; }
.cms-content-controls .preview-selector .chzn-drop .chzn-results .result-selected { background: #eceff1; }
Clean up the side-by-side code.
2012-12-06 04:01:33 +01:00
.cms-content-controls .preview-selector .chzn-container { width: auto !important; }
Put back cog icon for multi-select batch actions (was removed in f4b080e)
2013-05-15 11:09:19 +02:00
.cms-content-controls .preview-selector .chzn-container.chzn-with-rise .chzn-drop { padding: 0; border-bottom: 1px solid #aaa; margin-top: -5px; width: auto !important; }
Side-by-side preview options fixes. Add extra preview-mode selector to the CMS actions so we can show something when the preview is closed (and with it all options are not visible). Thanks @mateusz, @clarkepaul and @robert-h-curry for contributing.
2012-11-27 06:03:43 +01:00
.cms-content-controls .preview-selector .chzn-container.chzn-with-rise .chzn-drop .chzn-search { display: none; }
.cms-content-controls .preview-selector .chzn-container.chzn-with-rise .chzn-drop ul { padding: 0; margin: 0; }
Put back cog icon for multi-select batch actions (was removed in f4b080e)
2013-05-15 11:09:19 +02:00
.cms-content-controls .preview-selector .chzn-container.chzn-with-rise .chzn-drop ul li { font-size: 12px; line-height: 16px; padding: 7px 16px 7px 6px; color: #0073c1; border-bottom: 1px solid #DDD; background-color: #FFF; /* Description styling */ }
Side-by-side preview options fixes. Add extra preview-mode selector to the CMS actions so we can show something when the preview is closed (and with it all options are not visible). Thanks @mateusz, @clarkepaul and @robert-h-curry for contributing.
2012-11-27 06:03:43 +01:00
.cms-content-controls .preview-selector .chzn-container.chzn-with-rise .chzn-drop ul li:before { margin-right: 2px; }
.cms-content-controls .preview-selector .chzn-container.chzn-with-rise .chzn-drop ul li.description { padding-top: 5px; padding-bottom: 5px; }
.cms-content-controls .preview-selector .chzn-container.chzn-with-rise .chzn-drop ul li.description:before { margin-top: 5px; }
.cms-content-controls .preview-selector .chzn-container.chzn-with-rise .chzn-drop ul li.highlighted, .cms-content-controls .preview-selector .chzn-container.chzn-with-rise .chzn-drop ul li:hover, .cms-content-controls .preview-selector .chzn-container.chzn-with-rise .chzn-drop ul li:focus { color: #0073c1; filter: none; background: #f2f4f6; text-decoration: none; }
.cms-content-controls .preview-selector .chzn-container.chzn-with-rise .chzn-drop ul li.first { -webkit-border-radius: 3px 3px 0 0; -moz-border-radius: 3px 3px 0 0; -ms-border-radius: 3px 3px 0 0; -o-border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0; }
.cms-content-controls .preview-selector .chzn-container.chzn-with-rise .chzn-drop ul li.last { border-bottom: none; -webkit-border-radius: 0 0 0 3px; -moz-border-radius: 0 0 0 3px; -ms-border-radius: 0 0 0 3px; -o-border-radius: 0 0 0 3px; border-radius: 0 0 0 3px; }
Ability to rotate the mobile preview in side-by-side preview.
2012-12-06 03:22:45 +01:00
.cms-content-controls .preview-selector .chzn-container.chzn-with-rise .chzn-drop ul li.restricted { /* disable option (eg.split mode for smaller screen sizes) */ color: #CCC; background-color: #EEE; pointer-events: none; /*text-decoration: line-through;*/ }
.cms-content-controls .preview-selector .chzn-container.chzn-with-rise .chzn-drop ul li.restricted:before { opacity: 0.2; }
Side-by-side preview options fixes. Add extra preview-mode selector to the CMS actions so we can show something when the preview is closed (and with it all options are not visible). Thanks @mateusz, @clarkepaul and @robert-h-curry for contributing.
2012-11-27 06:03:43 +01:00
.cms-content-controls .preview-selector .chzn-container.chzn-with-rise .chzn-drop ul li span { display: block; color: #6c6c6c; font-size: 0.85em; line-height: 1.1em; padding-left: 23px; }
.cms-content-controls .preview-selector .chzn-container.chzn-with-rise .chzn-drop ul li .icon-view { margin-right: 4px; }
.cms-content-controls .preview-selector .chzn-drop ul.chzn-results li.result-selected { background: #e6eaed; color: #444444; }
.cms-content-controls .preview-selector .chzn-drop ul.chzn-results li.result-selected.highlighted, .cms-content-controls .preview-selector .chzn-drop ul.chzn-results li.result-selected:hover, .cms-content-controls .preview-selector .chzn-drop ul.chzn-results li.result-selected:focus { background: #e6eaed; color: #444444; }
Replace the state selector switch to support more than 2 states.
2012-12-03 03:17:16 +01:00
.cms-content-controls .cms-preview-states { float: right; }
.cms-content-controls .cms-preview-states select { max-width: 150px; }
.cms-content-controls .cms-preview-states.dropdown { max-width: 150px; }
.cms-content-controls .cms-preview-states.dropdown a.chzn-single span { margin: 0; }
.cms-content-controls .cms-preview-states.dropdown .chzn-container { max-width: 150px; }
NEW Side by side editing functionality - first cut (os#7412) Introduces a preview window that appears when the screen is wide enough, removes old preview button, adds a draft-public switch, adds variety of preview options which are not hooked up yet. Goes along with cms commit fa3738a9f4c5181eabf18a77ca89792d31592250
2012-11-22 02:14:11 +01:00
Clean up the side-by-side code.
2012-12-06 04:01:33 +01:00
/* Styling for the preview screen sizes */
Ability to rotate the mobile preview in side-by-side preview.
2012-12-06 03:22:45 +01:00
.cms-preview { background-color: #eceff1; height: 100%; width: 100%; }
Correct dimensions for preview overlay During the side-by-side refactoring, those were removed, rendering the overlay invisible, which lead to the "blocked" state not being shown at all.
2013-01-09 21:42:20 +01:00
.cms-preview .cms-preview-overlay { width: 100%; height: 100%; }
Put back cog icon for multi-select batch actions (was removed in f4b080e)
2013-05-15 11:09:19 +02:00
.cms-preview .preview-note { color: #CDD7DC; display: block; font-size: 22px; font-weight: bold; height: 82px; margin-top: -50px; margin-left: -150px; /* half of width */ position: absolute; text-align: center; text-shadow: 0 1px 0 #fff; top: 50%; left: 50%; width: 300px; }
Wider side panel to fit "add" and "edit" button Moved "edit tree" button into same DOM structure so we can layout them more easily through inline-block.
2012-12-17 11:27:24 +01:00
.cms-preview .preview-note span { background: url('../images/sprites-64x64-s88957ee578.png') 0 0 no-repeat; display: block; height: 41px; margin: 0 auto 20px; width: 50px; }
Clean up the side-by-side code.
2012-12-06 04:01:33 +01:00
.cms-preview .preview-scroll { height: 100%; overflow: auto; position: relative; width: 100%; }
Ability to rotate the mobile preview in side-by-side preview.
2012-12-06 03:22:45 +01:00
.cms-preview .preview-scroll .preview-device-outer { height: 100%; width: 100%; }
Preview Background styling * Added background color to preview for sites that don't have a background color (based on @clarkepaul's commit: https://github.com/silverstripe-droptables/sapphire/commit/7750c8f75fc4a 764b384c6e19dbe543c4811cdcb)
2013-06-04 02:57:09 +02:00
.cms-preview .preview-scroll .preview-device-outer .preview-device-inner { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 100%; height: 100%; background-color: #FFF; }
Clean up the side-by-side code.
2012-12-06 04:01:33 +01:00
.cms-preview .preview-scroll .preview-device-outer .preview-device-inner iframe { height: 100%; overflow-y: auto; width: 100%; }
.cms-preview.mobile .preview-scroll, .cms-preview.mobileLandscape .preview-scroll, .cms-preview.tablet .preview-scroll, .cms-preview.tabletLandscape .preview-scroll, .cms-preview.desktop .preview-scroll { background-color: #eceff1; /* cover website preview icon */ }
.cms-preview.mobile .preview-scroll .preview-device-outer, .cms-preview.mobileLandscape .preview-scroll .preview-device-outer, .cms-preview.tablet .preview-scroll .preview-device-outer, .cms-preview.tabletLandscape .preview-scroll .preview-device-outer, .cms-preview.desktop .preview-scroll .preview-device-outer { -webkit-border-radius: 7px; -moz-border-radius: 7px; -ms-border-radius: 7px; -o-border-radius: 7px; border-radius: 7px; background: #d5dde2; border: 1px solid transparent; border-left: 1px solid #cfd9de; padding: 0 16px 16px; }
.cms-preview.mobile .preview-scroll .preview-device-outer .preview-device-inner, .cms-preview.mobileLandscape .preview-scroll .preview-device-outer .preview-device-inner, .cms-preview.tablet .preview-scroll .preview-device-outer .preview-device-inner, .cms-preview.tabletLandscape .preview-scroll .preview-device-outer .preview-device-inner, .cms-preview.desktop .preview-scroll .preview-device-outer .preview-device-inner { border-top: 2px solid #e1e7ea; border-right: 1px solid transparent; border-bottom: 1px solid #e1e7ea; border-left: 1px solid #c3cfd6; }
NEW Preview size and default mode configurability
2013-01-15 16:36:53 +01:00
.cms-preview.mobile .preview-scroll .preview-device-outer { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: all 0.3s ease-in; -webkit-transition-delay: 1s; -moz-transition: all 0.3s ease-in 1s; -o-transition: all 0.3s ease-in 1s; transition: all 0.3s ease-in 1s; margin: 20px auto 20px; overflow: hidden; padding-top: 16px; }
.cms-preview.mobile .preview-scroll .preview-device-outer .preview-device-inner { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: all 0.3s ease-out; -webkit-transition-delay: 1s; -moz-transition: all 0.3s ease-out 1s; -o-transition: all 0.3s ease-out 1s; transition: all 0.3s ease-out 1s; }
Clean up the side-by-side code.
2012-12-06 04:01:33 +01:00
.cms-preview.mobile .preview-scroll .preview-device-outer.rotate { -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg); -webkit-transition: all 0.3s ease-in; -webkit-transition-delay: 1s; -moz-transition: all 0.3s ease-in 1s; -o-transition: all 0.3s ease-in 1s; transition: all 0.3s ease-in 1s; height: 583px; margin: 0px auto 0px; width: 320px; }
.cms-preview.mobile .preview-scroll .preview-device-outer.rotate .preview-device-inner { -webkit-transform-origin: 160px 160px; -moz-transform-origin: 160px 160px; -ms-transform-origin: 160px 160px; -o-transform-origin: 160px 160px; transform-origin: 160px 160px; -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); -webkit-transition: all 0.3s ease-out; -webkit-transition-delay: 1s; -moz-transition: all 0.3s ease-out 1s; -o-transition: all 0.3s ease-out 1s; transition: all 0.3s ease-out 1s; height: 320px; width: 583px; }
NEW Preview size and default mode configurability
2013-01-15 16:36:53 +01:00
.cms-preview.mobileLandscape .preview-scroll .preview-device-outer { -webkit-transition: all 0.3s ease-out; -webkit-transition-delay: 1s; -moz-transition: all 0.3s ease-out 1s; -o-transition: all 0.3s ease-out 1s; transition: all 0.3s ease-out 1s; margin: 12% auto; padding-top: 16px; }
.cms-preview.mobileLandscape .preview-scroll .preview-device-outer .preview-device-inner { -webkit-transition: all 0.3s ease-out; -webkit-transition-delay: 1s; -moz-transition: all 0.3s ease-out 1s; -o-transition: all 0.3s ease-out 1s; transition: all 0.3s ease-out 1s; }
.cms-preview.tablet .preview-scroll .preview-device-outer { -webkit-transition: all 0.3s ease-out; -webkit-transition-delay: 1s; -moz-transition: all 0.3s ease-out 1s; -o-transition: all 0.3s ease-out 1s; transition: all 0.3s ease-out 1s; margin: 0 auto; }
.cms-preview.tablet .preview-scroll .preview-device-outer .preview-device-inner { -webkit-transition: all 0.3s ease-out; -webkit-transition-delay: 1s; -moz-transition: all 0.3s ease-out 1s; -o-transition: all 0.3s ease-out 1s; transition: all 0.3s ease-out 1s; }
.cms-preview.tabletLandscape .preview-scroll .preview-device-outer { -webkit-transition: all 0.3s ease-out; -webkit-transition-delay: 1s; -moz-transition: all 0.3s ease-out 1s; -o-transition: all 0.3s ease-out 1s; transition: all 0.3s ease-out 1s; margin: 0 auto; }
.cms-preview.tabletLandscape .preview-scroll .preview-device-outer .preview-device-inner { -webkit-transition: all 0.3s ease-out; -webkit-transition-delay: 1s; -moz-transition: all 0.3s ease-out 1s; -o-transition: all 0.3s ease-out 1s; transition: all 0.3s ease-out 1s; }
.cms-preview.desktop .preview-scroll .preview-device-outer { -webkit-transition: all 0.3s ease-out; -webkit-transition-delay: 1s; -moz-transition: all 0.3s ease-out 1s; -o-transition: all 0.3s ease-out 1s; transition: all 0.3s ease-out 1s; margin: 0 auto; }
Ability to rotate the mobile preview in side-by-side preview.
2012-12-06 03:22:45 +01:00
API Add action tabsets as a interface idiom. Introduces the concept of action tabsets - usage of TabSet and Tabs in between the action buttons to allow richer set of capabilities that can be offered to the user. Goes along with c8d0cdec99c95dbed3b58ebcc098cc9d22c58206 that implements a change to the CMS actions.
2012-11-21 22:01:02 +01:00
/********************************************
More CSS fixes for the ActionTabSets. Thanks for contributing @clarkepaul.
2012-11-30 03:29:53 +01:00
* Defines the styles for .ss-ui-action-tabset:
* * Site tree action tabs (to perform actions on the site tree)
* * Actions menu (Edit page actions)
*
* Reliant on TabSet.js to apply and remove some classes.
*
* Note: This is a special use case of tabs, so the default tab
* styling should not apply
*
API Add action tabsets as a interface idiom. Introduces the concept of action tabsets - usage of TabSet and Tabs in between the action buttons to allow richer set of capabilities that can be offered to the user. Goes along with c8d0cdec99c95dbed3b58ebcc098cc9d22c58206 that implements a change to the CMS actions.
2012-11-21 22:01:02 +01:00
**********************************************/
Loading indicator for "more options" buttons
2012-12-13 22:03:43 +01:00
.cms .ss-ui-action-tabset { float: left; position: relative; /*
More CSS fixes for the ActionTabSets. Thanks for contributing @clarkepaul.
2012-11-30 03:29:53 +01:00
Styles for the tab-nav of the site tree implementation
of ss-ui-action-tabset
*/ /* position a checkbox & icon within a tab */ /* Styles for the cms-actions in tree view, to use more limited space.
API Add action tabsets as a interface idiom. Introduces the concept of action tabsets - usage of TabSet and Tabs in between the action buttons to allow richer set of capabilities that can be offered to the user. Goes along with c8d0cdec99c95dbed3b58ebcc098cc9d22c58206 that implements a change to the CMS actions.
2012-11-21 22:01:02 +01:00
Title hidden in tree view, until hover/active state added. Active is applied
to the first tab within the template, so there should always be one title
Loading indicator for "more options" buttons
2012-12-13 22:03:43 +01:00
visible. Added and removed with js in TabSet.js */ /****************************************************************
More CSS fixes for the ActionTabSets. Thanks for contributing @clarkepaul.
2012-11-30 03:29:53 +01:00
Styles for the actions-menu implementation
of ss-ui-action-tabset
****************************************************************/ }
.cms .ss-ui-action-tabset.multi { /* Style the tab panels */ }
Loading indicator for "more options" buttons
2012-12-13 22:03:43 +01:00
.cms .ss-ui-action-tabset.multi ul.ui-tabs-nav { -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; overflow: hidden; *zoom: 1; border: 1px solid #b3b3b3; float: left; overflow: visible; padding: 0; }
More CSS fixes for the ActionTabSets. Thanks for contributing @clarkepaul.
2012-11-30 03:29:53 +01:00
.cms .ss-ui-action-tabset.multi ul.ui-tabs-nav:active { outline: none; box-shadow: none; -webkit-box-shadow: none; }
Put back cog icon for multi-select batch actions (was removed in f4b080e)
2013-05-15 11:09:19 +02:00
.cms .ss-ui-action-tabset.multi ul.ui-tabs-nav li { background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2Y4ZjhmOCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2Q5ZDlkOSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f8f8f8), color-stop(100%, #d9d9d9)); background-image: -webkit-linear-gradient(top, #f8f8f8, #d9d9d9); background-image: -moz-linear-gradient(top, #f8f8f8, #d9d9d9); background-image: -o-linear-gradient(top, #f8f8f8, #d9d9d9); background-image: linear-gradient(top, #f8f8f8, #d9d9d9); -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; background: #eaeaea; border: none; border-right: 1px solid #eee; border-left: 1px solid #b3b3b3; margin: 0; overflow: visible; min-width: 110px; }
More CSS fixes for the ActionTabSets. Thanks for contributing @clarkepaul.
2012-11-30 03:29:53 +01:00
.cms .ss-ui-action-tabset.multi ul.ui-tabs-nav li:active { outline: none; box-shadow: none; -webkit-box-shadow: none; }
.cms .ss-ui-action-tabset.multi ul.ui-tabs-nav li.ui-state-active { -moz-border-radius-bottomleft: 0px; -webkit-border-bottom-left-radius: 0px; border-bottom-left-radius: 0px; -moz-border-radius-bottomright: 0px; -webkit-border-bottom-right-radius: 0px; border-bottom-right-radius: 0px; background: #f8f8f8; border-bottom: none !important; }
.cms .ss-ui-action-tabset.multi ul.ui-tabs-nav li.ui-state-active a { -moz-border-radius-bottomleft: 0px; -webkit-border-bottom-left-radius: 0px; border-bottom-left-radius: 0px; -moz-border-radius-bottomright: 0px; -webkit-border-bottom-right-radius: 0px; border-bottom-right-radius: 0px; }
.cms .ss-ui-action-tabset.multi ul.ui-tabs-nav li.ui-state-active a:active, .cms .ss-ui-action-tabset.multi ul.ui-tabs-nav li.ui-state-active a span:active { outline: none; box-shadow: none; -webkit-box-shadow: none; }
.cms .ss-ui-action-tabset.multi ul.ui-tabs-nav li.first { -moz-border-radius-topleft: 3px; -webkit-border-top-left-radius: 3px; border-top-left-radius: 3px; -moz-border-radius-bottomleft: 3px; -webkit-border-bottom-left-radius: 3px; border-bottom-left-radius: 3px; border-left: none; }
.cms .ss-ui-action-tabset.multi ul.ui-tabs-nav li.last { -moz-border-radius-topright: 3px; -webkit-border-top-right-radius: 3px; border-top-right-radius: 3px; -moz-border-radius-bottomright: 3px; -webkit-border-bottom-right-radius: 3px; border-bottom-right-radius: 3px; border-right: none; }
.cms .ss-ui-action-tabset.multi ul.ui-tabs-nav li a.tab-nav-link { color: #444444; display: inline-block; font-weight: bold; line-height: 16px; padding: 5px 10px; }
.cms .ss-ui-action-tabset.multi ul.ui-tabs-nav li a.tab-nav-link .ui-no-icon { display: inline-block; float: left; height: 16px; padding: 0 2px; width: 16px; }
.cms .ss-ui-action-tabset.multi ul.ui-tabs-nav li a.tab-nav-link .title { display: inline-block; line-height: 18px; }
.cms .ss-ui-action-tabset.multi ul.ui-tabs-nav li a.tab-nav-link.view-mode-batchactions-wrapper .title { margin-left: 22px; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel { /* Restyle for smaller area*/ background: #f8f8f8 !important; border: 1px solid #b3b3b3; border-top: none; clear: both; display: block; float: left; margin: 0; padding: 10px; padding-top: 15px; position: absolute; top: 30px; width: 202px; z-index: 1; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel h3, .cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel h4, .cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel h5 { font-weight: bold; line-height: 16px; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel h3 { font-size: 13px; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel h4 { font-size: 12px; margin: 5px 0; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .ui-widget-content { background: none; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .field { /* Fields are more compressed in some areas compared to the main content editing window so the below alters the internal spacing of the fields so we can move that spacing to between the form fields rather than padding */ border-bottom: none; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .field label { float: none; width: auto; font-size: 12px; padding: 0 8px 4px 0; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .field label.extra-details { overflow: hidden; margin-top: 10px; display: block; color: #9d9d9d; font-style: italic; font-weight: normal; font-size: 1em; float: left; text-shadow: none; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .field label.extra-details.fill:before { color: #fff; content: '?'; font-size: 12px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding-left: 3px; padding-right: 3px; display: block; float: left; text-shadow: none; -webkit-border-radius: 50px; -moz-border-radius: 50px; -ms-border-radius: 50px; -o-border-radius: 50px; border-radius: 50px; background-color: #b7b7b7; width: 15px; height: 15px; margin-right: 5px; margin-bottom: 5px; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .field .middleColumn { margin: 0; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .field input.text, .cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .field select, .cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .field textarea { padding: 5px; font-size: 11px; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .field.checkbox { padding: 0 8px 0; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .field.checkbox input { margin: 2px 0; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .fieldgroup .fieldgroup-field { padding: 0; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .fieldgroup .fieldgroup-field .field { margin: 0; padding: 0; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .cms-content-fields { overflow: visible; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .chzn-container-single { width: 100% !important; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .chzn-container-single .chzn-single { padding: 0 0 0 5px; float: none; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .cms-content-actions, .cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .cms-preview-controls { padding: 0; height: auto; border: none; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .cms-edit-form { width: 100%; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .CompositeField { margin: 0; padding: 0; float: none; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .parent-mode { padding-top: 0; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .treedropdown, .cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .SelectionGroup li.selected div.field { margin: 10px 0 0 0; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .treedropdown .treedropdownfield-title, .cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .SelectionGroup li.selected div.field .treedropdownfield-title { position: absolute; z-index: 2; padding: 5px; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .treedropdown .treedropdownfield-panel, .cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .SelectionGroup li.selected div.field .treedropdownfield-panel { margin-top: 11px; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .treedropdown .treedropdownfield-toggle-panel-link, .cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .SelectionGroup li.selected div.field .treedropdownfield-toggle-panel-link { background: none; border-left: none; padding: 5px 3px; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .treedropdown .treedropdownfield-toggle-panel-link .ui-icon, .cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .SelectionGroup li.selected div.field .treedropdownfield-toggle-panel-link .ui-icon { float: right; opacity: 0.7; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .cms-add-form ul.SelectionGroup { padding-left: 0; padding-right: 0; overflow: visible; border-bottom: none; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel.first { left: 0; width: 203px; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .ui-icon { padding-right: 0; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .tab-nav-link, .cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel .ss-ui-button { font-size: 12px; }
FIX: Update references to ID values from 79c9433
2013-05-26 01:11:05 +02:00
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel #Form_AddForm_PageType_Holder ul { padding: 0; }
.cms .ss-ui-action-tabset.multi .ss-ui-action-tab.ui-tabs-panel #Form_AddForm_PageType_Holder ul li { padding: 4px 5px; }
API Add action tabsets as a interface idiom. Introduces the concept of action tabsets - usage of TabSet and Tabs in between the action buttons to allow richer set of capabilities that can be offered to the user. Goes along with c8d0cdec99c95dbed3b58ebcc098cc9d22c58206 that implements a change to the CMS actions.
2012-11-21 22:01:02 +01:00
.cms .ss-ui-action-tabset.tabset-open ul.ui-tabs-nav, .cms .ss-ui-action-tabset.tabset-open ul.ui-tabs-nav li.first { -moz-border-radius-bottomleft: 0; -webkit-border-bottom-left-radius: 0; border-bottom-left-radius: 0; }
.cms .ss-ui-action-tabset.tabset-open-last ul.ui-tabs-nav li.last { -moz-border-radius-bottomright: 0; -webkit-border-bottom-right-radius: 0; border-bottom-right-radius: 0; }
More CSS fixes for the ActionTabSets. Thanks for contributing @clarkepaul.
2012-11-30 03:29:53 +01:00
.cms .ss-ui-action-tabset .batch-check, .cms .ss-ui-action-tabset .ui-icon { display: inline-block; float: left; margin-left: -2px; padding-right: 6px; }
API Add action tabsets as a interface idiom. Introduces the concept of action tabsets - usage of TabSet and Tabs in between the action buttons to allow richer set of capabilities that can be offered to the user. Goes along with c8d0cdec99c95dbed3b58ebcc098cc9d22c58206 that implements a change to the CMS actions.
2012-11-21 22:01:02 +01:00
.cms .ss-ui-action-tabset .batch-check { margin: 6px 0px 5px 9px; position: absolute; }
More CSS fixes for the ActionTabSets. Thanks for contributing @clarkepaul.
2012-11-30 03:29:53 +01:00
.cms .ss-ui-action-tabset .cms-tree-view-sidebar { min-width: 176px; /* for when the scrollbar is present & find dropdown open */ }
.cms .ss-ui-action-tabset .cms-tree-view-sidebar .ss-ui-action-tabset ul.ui-tabs-nav > li { width: auto; }
.cms .ss-ui-action-tabset .cms-tree-view-sidebar .ss-ui-action-tabset ul.ui-tabs-nav > li a.tab-nav-link { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transition-duration: 0.5s; -moz-transition-duration: 0.5s; -o-transition-duration: 0.5s; transition-duration: 0.5s; overflow: hidden; padding-right: 0; width: 30px; }
.cms .ss-ui-action-tabset .cms-tree-view-sidebar .ss-ui-action-tabset ul.ui-tabs-nav > li a.tab-nav-link.active { -webkit-transition-duration: 0.5s; -moz-transition-duration: 0.5s; -o-transition-duration: 0.5s; transition-duration: 0.5s; width: 110px; }
.cms .ss-ui-action-tabset .cms-tree-view-sidebar .ss-ui-action-tabset.tabset-open ul.ui-tabs-nav, .cms .ss-ui-action-tabset .cms-tree-view-sidebar .ss-ui-action-tabset.tabset-open ul.ui-tabs-nav li.first, .cms .ss-ui-action-tabset .cms-tree-view-sidebar .ss-ui-action-tabset.tabset-open ul.ui-tabs-nav li.last, .cms .ss-ui-action-tabset .cms-tree-view-sidebar .ss-ui-action-tabset.tabset-open-last ul.ui-tabs-nav, .cms .ss-ui-action-tabset .cms-tree-view-sidebar .ss-ui-action-tabset.tabset-open-last ul.ui-tabs-nav li.first, .cms .ss-ui-action-tabset .cms-tree-view-sidebar .ss-ui-action-tabset.tabset-open-last ul.ui-tabs-nav li.last { -moz-border-radius-bottomright: 0; -webkit-border-bottom-right-radius: 0; border-bottom-right-radius: 0; -moz-border-radius-bottomleft: 0; -webkit-border-bottom-left-radius: 0; border-bottom-left-radius: 0; }
.cms .ss-ui-action-tabset .cms-tree-view-sidebar .ui-tabs .ui-tabs-panel.ss-ui-action-tab { padding: 10px 6px; width: 162px; }
.cms .ss-ui-action-tabset .cms-tree-view-sidebar .ui-tabs .ui-tabs-panel.ss-ui-action-tab .field { max-width: 160px; }
.cms .ss-ui-action-tabset .cms-tree-view-sidebar .ui-tabs .ui-tabs-panel.ss-ui-action-tab .ui-icon { padding-right: 0; }
.cms .ss-ui-action-tabset .cms-tree-view-sidebar .last .ui-tabs-panel.ss-ui-action-tab { left: auto; right: 0; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset { margin-top: 2px; /* Style the panel for actions-menu */ /* Re-align last tab */ }
.cms .ss-ui-action-tabset.action-menus.ss-tabset ul.ui-tabs-nav { margin: 0; float: left; /* needed for ie but doesnt effect other browsers */ }
.cms .ss-ui-action-tabset.action-menus.ss-tabset ul.ui-tabs-nav li { background: none; border: none; border-bottom: none !important; display: inline; padding: 0; /* Make arrow point in up when nav open */ }
.cms .ss-ui-action-tabset.action-menus.ss-tabset ul.ui-tabs-nav li:hover, .cms .ss-ui-action-tabset.action-menus.ss-tabset ul.ui-tabs-nav li:active { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; outline: none; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset ul.ui-tabs-nav li a { text-shadow: white 0 1px 1px; color: #0073c1; font-size: 13px; font-weight: normal; line-height: 24px; padding: 0 25px 0 10px; /* Arrow */ }
.cms .ss-ui-action-tabset.action-menus.ss-tabset ul.ui-tabs-nav li a:hover, .cms .ss-ui-action-tabset.action-menus.ss-tabset ul.ui-tabs-nav li a:active { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; outline: none; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset ul.ui-tabs-nav li a:hover { text-shadow: white 0 10px 10px; color: #005b98; }
Replace logout button with a more commonly used symbol * Power icon swapped for door icon * Minor hover/focus opacity effect added to button
2013-05-25 06:45:49 +02:00
.cms .ss-ui-action-tabset.action-menus.ss-tabset ul.ui-tabs-nav li a:after { background: url('../images/sprites-32x32-s972e408b05.png') 0 -1189px no-repeat; border-bottom: 0; content: ""; display: inline-block; height: 16px; margin-left: 6px; width: 16px; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset ul.ui-tabs-nav li a:hover:after { background: url('../images/sprites-32x32-s972e408b05.png') 0 -1163px no-repeat; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset ul.ui-tabs-nav li.ui-state-active a:after { background: url('../images/sprites-32x32-s972e408b05.png') 0 -1215px no-repeat; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset ul.ui-tabs-nav li.ui-state-active a:hover:after { background: url('../images/sprites-32x32-s972e408b05.png') 0 -1137px no-repeat; }
Put back cog icon for multi-select batch actions (was removed in f4b080e)
2013-05-15 11:09:19 +02:00
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel { overflow: hidden; *zoom: 1; -moz-border-radius-topleft: 3px; -webkit-border-top-left-radius: 3px; border-top-left-radius: 3px; -moz-border-radius-topright: 3px; -webkit-border-top-right-radius: 3px; border-top-right-radius: 3px; -moz-border-radius-bottomleft: 0; -webkit-border-bottom-left-radius: 0; border-bottom-left-radius: 0; -moz-border-radius-bottomright: 0; -webkit-border-bottom-right-radius: 0; border-bottom-right-radius: 0; /* Restyle for smaller area*/ clear: both; display: block; background-color: #eceff1; border: 1px solid #ccc; border-bottom: 1px solid #eceff1; margin: 0; margin-top: 2px; max-width: 250px; padding: 8px 0 2px; position: absolute; z-index: 1; min-width: 190px; }
More CSS fixes for the ActionTabSets. Thanks for contributing @clarkepaul.
2012-11-30 03:29:53 +01:00
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel h3, .cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel h4, .cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel h5 { font-weight: bold; line-height: 16px; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel h3 { font-size: 13px; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel h4 { font-size: 12px; margin: 5px 0; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .ui-widget-content { background: none; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .field { /* Fields are more compressed in some areas compared to the main content editing window so the below alters the internal spacing of the fields so we can move that spacing to between the form fields rather than padding */ border-bottom: none; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .field label { float: none; width: auto; font-size: 12px; padding: 0 8px 4px 0; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .field label.extra-details { overflow: hidden; margin-top: 10px; display: block; color: #9d9d9d; font-style: italic; font-weight: normal; font-size: 1em; float: left; text-shadow: none; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .field label.extra-details.fill:before { color: #fff; content: '?'; font-size: 12px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding-left: 3px; padding-right: 3px; display: block; float: left; text-shadow: none; -webkit-border-radius: 50px; -moz-border-radius: 50px; -ms-border-radius: 50px; -o-border-radius: 50px; border-radius: 50px; background-color: #b7b7b7; width: 15px; height: 15px; margin-right: 5px; margin-bottom: 5px; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .field .middleColumn { margin: 0; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .field input.text, .cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .field select, .cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .field textarea { padding: 5px; font-size: 11px; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .field.checkbox { padding: 0 8px 0; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .field.checkbox input { margin: 2px 0; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .fieldgroup .fieldgroup-field { padding: 0; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .fieldgroup .fieldgroup-field .field { margin: 0; padding: 0; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .cms-content-fields { overflow: visible; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .chzn-container-single { width: 100% !important; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .chzn-container-single .chzn-single { padding: 0 0 0 5px; float: none; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .cms-content-actions, .cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .cms-preview-controls { padding: 0; height: auto; border: none; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .cms-edit-form { width: 100%; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .CompositeField { margin: 0; padding: 0; float: none; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .parent-mode { padding-top: 0; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .treedropdown, .cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .SelectionGroup li.selected div.field { margin: 10px 0 0 0; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .treedropdown .treedropdownfield-title, .cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .SelectionGroup li.selected div.field .treedropdownfield-title { position: absolute; z-index: 2; padding: 5px; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .treedropdown .treedropdownfield-panel, .cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .SelectionGroup li.selected div.field .treedropdownfield-panel { margin-top: 11px; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .treedropdown .treedropdownfield-toggle-panel-link, .cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .SelectionGroup li.selected div.field .treedropdownfield-toggle-panel-link { background: none; border-left: none; padding: 5px 3px; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .treedropdown .treedropdownfield-toggle-panel-link .ui-icon, .cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .SelectionGroup li.selected div.field .treedropdownfield-toggle-panel-link .ui-icon { float: right; opacity: 0.7; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .cms-add-form ul.SelectionGroup { padding-left: 0; padding-right: 0; overflow: visible; border-bottom: none; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .cms-sitetree-information { border-bottom: 1px solid #e6e7e8; margin-bottom: 8px; padding: 0 20px 0 0; margin-right: 10px; margin-left: 10px; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel .cms-sitetree-information p.meta-info { color: #999; font-size: 11px; line-height: 16px; margin-bottom: 8px; white-space: nowrap; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel button.ss-ui-button { width: 100%; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel button.ss-ui-button:hover, .cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel button.ss-ui-button:focus, .cms .ss-ui-action-tabset.action-menus.ss-tabset .ui-tabs-panel button.ss-ui-button:active { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; background-color: #e0e5e8; outline: none; }
.cms .ss-ui-action-tabset.action-menus.ss-tabset .last .ui-tabs-panel.ss-ui-action-tab { left: auto; right: -1px; }
CSS fixes for the ActionTabSet. Thanks for contributing @clarkepaul!
2012-11-29 04:26:50 +01:00
.cms .cms-content-actions .Actions { overflow: visible; }
API Add action tabsets as a interface idiom. Introduces the concept of action tabsets - usage of TabSet and Tabs in between the action buttons to allow richer set of capabilities that can be offered to the user. Goes along with c8d0cdec99c95dbed3b58ebcc098cc9d22c58206 that implements a change to the CMS actions.
2012-11-21 22:01:02 +01:00
BUGFIX:fixed issues with overflow on model and security admin - made changes more specific.
2012-03-12 22:54:57 +01:00
.ModelAdmin .cms-content-fields { overflow: hidden; }
Side-by-side preview options styling. Thanks @adrexia for contributing.
2012-11-22 04:30:50 +01:00
.ModelAdmin .cms-content-fields .cms-edit-form { overflow-y: auto; overflow-x: hidden; }
ENHANCMENT: SSF-25 - fixed a couple of styling issues on the ModelAdmin Filter
2012-03-11 23:49:00 +01:00
.ModelAdmin .cms-content-fields .cms-content-tools .cms-panel-content .cms-search-form .resetformaction { margin-right: 0px; }
.ModelAdmin .cms-content-fields .cms-content-tools .cms-panel-content #Form_ImportForm { overflow: hidden; }
Permission list styling improvements (#8100)
2012-12-13 03:01:06 +01:00
.permissioncheckboxset h5, .permissioncheckboxsetfield_readonly h5 { margin: 0; }
.permissioncheckboxset .optionset, .permissioncheckboxsetfield_readonly .optionset { overflow: auto; }
.permissioncheckboxset .optionset li, .permissioncheckboxsetfield_readonly .optionset li { float: none; width: auto; clear: both; }
BUGFIX:fixed issues with overflow on model and security admin - made changes more specific.
2012-03-12 22:54:57 +01:00
ENHANCEMENT: open/7881 - removed disabled checkboxes and replaced them with green ticks. Added help text above the list of permissions. Removed action buttons by fade out when user goes to users permissions tab.
2012-09-26 03:19:26 +02:00
/* For user permissions the readonly checkboxes are set as display none and are replaced with a <span> that has a
green tick icon as a background this is created using compass generated classes and hardcoded in the php */
.permissioncheckboxsetfield_readonly .optionset li.odd, .permissioncheckboxsetfield_readonly .optionset li.even { margin-left: 16px; }
.permissioncheckboxsetfield_readonly .optionset li.help { width: 384px; }
.permissioncheckboxsetfield_readonly .optionset li input { display: none; }
.permissioncheckboxsetfield_readonly .optionset li label { position: relative; }
.permissioncheckboxsetfield_readonly .optionset li label span { position: absolute; left: -16px; top: -2px; }
BUGFIX:fixed issues with overflow on model and security admin - made changes more specific.
2012-03-12 22:54:57 +01:00
.cms .cms-content .SecurityAdmin .cms-content-fields { overflow-y: auto; }
.cms .cms-content .SecurityAdmin .cms-content-fields .aligned-right-label { margin-left: 184px; padding: 8px 0; }
Reference in New Issue Copy Permalink