diff --git a/core/modules/node/lib/Drupal/node/NodeFormController.php b/core/modules/node/lib/Drupal/node/NodeFormController.php index 80823229ee5b29d4471b86222b2c5d9b9aaa8394..104c3352a5508660dfb17276017d43657ce4d7c5 100644 --- a/core/modules/node/lib/Drupal/node/NodeFormController.php +++ b/core/modules/node/lib/Drupal/node/NodeFormController.php @@ -56,6 +56,7 @@ protected function prepareEntity(EntityInterface $node) { * Overrides Drupal\Core\Entity\EntityFormController::form(). */ public function form(array $form, array &$form_state, EntityInterface $node) { + $user_config = config('user.settings'); // Some special stuff when previewing a node. if (isset($form_state['node_preview'])) { diff --git a/core/modules/node/node.edit.admin.css b/core/modules/node/node.edit.admin.css new file mode 100644 index 0000000000000000000000000000000000000000..1f92354589cc7bf0322716da2fb9e0d96cd75682 --- /dev/null +++ b/core/modules/node/node.edit.admin.css @@ -0,0 +1,69 @@ +/** + * @file + * Styles for administration pages. + */ + +/** + * Node add/edit form layout + */ + +/* Narrow screens */ +.layout-region { + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; +} + +/* Wide screens */ +@media + screen and (min-width: 780px), + (orientation: landscape) and (min-device-height: 780px) { + + .layout-region-node-main, + .layout-region-node-footer { + float: left; /* LTR */ + width: 65%; + padding-right: 2em; + } + + .layout-region-node-secondary { + float: right; /* LTR */ + width: 35%; + } + + /* @todo File an issue to add a standard class to all text-like inputs */ + .layout-region-node-secondary .form-autocomplete, + .layout-region-node-secondary .form-text, + .layout-region-node-secondary .form-tel, + .layout-region-node-secondary .form-email, + .layout-region-node-secondary .form-url, + .layout-region-node-secondary .form-search, + .layout-region-node-secondary .form-number, + .layout-region-node-secondary .form-color, + .layout-region-node-secondary textarea { + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + width: 100%; + max-width: 100%; + } +} + +/** + * The vertical toolbar mode gets triggered for narrow screens, which throws off + * the intent of media queries written for the viewport width. When the vertical + * toolbar is on, we need to suppress layout for the original media width + the + * toolbar width (240px). In this case, 240px + 780px. + */ +@media + screen and (max-width: 1020px), + (orientation: landscape) and (max-device-height: 1020px) { + + .toolbar-vertical .layout-region-node-main, + .toolbar-vertical .layout-region-node-footer, + .toolbar-vertical .layout-region-node-secondary { + float: none; + width: auto; + padding-right: 0; + } +} diff --git a/core/modules/node/node.module b/core/modules/node/node.module index f2206a088568b2ab8c3eceb2edb365e27b2442cd..b16949943b4a576fa329c8107622cd704cb40557 100644 --- a/core/modules/node/node.module +++ b/core/modules/node/node.module @@ -171,6 +171,11 @@ function node_theme() { 'node_recent_content' => array( 'variables' => array('node' => NULL), ), + 'node_edit_form' => array( + 'render element' => 'form', + 'path' => drupal_get_path('module', 'node') . '/templates', + 'template' => 'node-edit-form', + ), ); } diff --git a/core/modules/node/templates/node-edit-form.tpl.php b/core/modules/node/templates/node-edit-form.tpl.php new file mode 100644 index 0000000000000000000000000000000000000000..7b766839078b61c053ea7c166f061c8aeb93a508 --- /dev/null +++ b/core/modules/node/templates/node-edit-form.tpl.php @@ -0,0 +1,27 @@ + +
+
+ +
+ +
+ +
+ + +
diff --git a/core/modules/overlay/images/close-rtl.png b/core/modules/overlay/images/close-rtl.png deleted file mode 100644 index ae05d11140b8236de673cdd06bfffcc7f3553cfa..0000000000000000000000000000000000000000 --- a/core/modules/overlay/images/close-rtl.png +++ /dev/null @@ -1,5 +0,0 @@ -PNG - - IHDRgAMA|QQPLTEooo```ppp000"tRNS0/@?IDAT(υ DIAЂMVS܁Q*{>J<)/ߨQųI;x!I9V` `j',>?~|ѧFGg'/A9aW<㺏eE16ŚcoT" -Y -)շ :59]IENDB` \ No newline at end of file diff --git a/core/modules/overlay/images/close.png b/core/modules/overlay/images/close.png index 436985e226fd080768ef3345691da20c72e38942..44d2b6b007d508b220cb06a1ee9d1e5183e6d6c2 100644 --- a/core/modules/overlay/images/close.png +++ b/core/modules/overlay/images/close.png @@ -1,4 +1,14 @@ PNG  - IHDRQPLTE000oooppp```:qtRNS0/@?IDATx^}҉ aynkˡnV ?F(Vt}ꌒY)5l7V9Yɀf<'_<(0 -nxAh7 25~1:[+!p+Py2}6Ґ9\DM)iMJ>-Rja~[N'epv.IENDB` \ No newline at end of file + IHDRJL pHYs   +OiCCPPhotoshop ICC profilexڝSgTS=BKKoR RB&*! J!QEEȠQ, +!{kּ> H3Q5 B.@ +$pd!s#~<<+"x M0B\t8K@zB@F&S`cbP-`'{[! eDh;VEX0fK9-0IWfH  0Q){`##xFW<+*x<$9E[-qWW.(I+6aa@.y24x6_-"bbϫp@t~,/;m%h^ uf@Wp~<5j>{-]cK'Xto(hw?G%fIq^D$.Tʳ?D*A, `6B$BB +dr`)B(Ͱ*`/@4Qhp.U=pa( Aa!ڈbX#!H$ ɈQ"K5H1RT UH=r9\F;2G1Q= C7F dt1r=6Ыhڏ>C03l0.B8, c˱" VcϱwE 6wB aAHXLXNH $4 7 Q'"K&b21XH,#/{C7$C2'ITFnR#,4H#dk9, +ȅ3![ +b@qS(RjJ4e2AURݨT5ZBRQ4u9̓IKhhitݕNWGw Ljg(gwLӋT071oUX**| +J&*/Tު UUT^S}FU3S ԖUPSSg;goT?~YYLOCQ_ cx,!k u5&|v*=9C3J3WRf?qtN (~))4L1e\kXHQG6EYAJ'\'GgSSݧ +M=:.kDwn^Loy}/TmG X $ <5qo</QC]@Caaᄑ.ȽJtq]zۯ6iܟ4)Y3sCQ? 0k߬~OCOg#/c/Wװwa>>r><72Y_7ȷOo_C#dz%gA[z|!?:eAAA!h쐭!ΑiP~aa~ 'W?pX15wCsDDDޛg1O9-J5*>.j<74?.fYXXIlK9.*6nl {/]py.,:@LN8A*%w% +yg"/6шC\*NH*Mz쑼5y$3,幄'L Lݛ:v m2=:1qB!Mggfvˬen/kY- +BTZ(*geWf͉9+̳ې7ᒶKW-X潬j9(xoʿܔĹdff-[n ڴ VE/(ۻCɾUUMfeI?m]Nmq#׹=TR+Gw- 6 U#pDy  :v{vg/jBFS[b[O>zG499?rCd&ˮ/~јѡ򗓿m|x31^VwwO| (hSЧc3- cHRMz%u0`:o_FIDATx 0 D5FN;H8\bbIZL(806q:"4B03Df,3|3HU"4ݛBVbf6,.)^6fyafhV~&y]u?а qzG`~A=gU݌ UM3y&JhۻgIENDB` \ No newline at end of file diff --git a/core/modules/overlay/overlay-child-rtl.css b/core/modules/overlay/overlay-child-rtl.css index eeff66cb941380ff60aa210e97807eede1c7fb68..41955304fd12a3f21382a1e2e026619234dede6f 100644 --- a/core/modules/overlay/overlay-child-rtl.css +++ b/core/modules/overlay/overlay-child-rtl.css @@ -22,8 +22,16 @@ html { } #overlay-close, #overlay-close:hover { - background: transparent url(images/close-rtl.png) no-repeat; + background: transparent url(images/close.png) no-repeat; border-top-right-radius: 0; + + -webkit-border-top-left-radius: 12px; + -webkit-border-bottom-left-radius: 12px; + -moz-border-radius-topleft: 12px; + -moz-border-radius-bottomleft: 12px; + border-top-left-radius: 12px; + border-bottom-left-radius: 12px; + background-color: #ffffff; } /** diff --git a/core/modules/overlay/overlay-child.css b/core/modules/overlay/overlay-child.css index 48f217dda43157a7fe5590eb377b06a98b91fa7f..aa0effc407a90c4160401214efb9ac2e08f65353 100644 --- a/core/modules/overlay/overlay-child.css +++ b/core/modules/overlay/overlay-child.css @@ -77,6 +77,14 @@ /* Replace with position:fixed to get a scrolling close button. */ position: absolute; width: 26px; + + -webkit-border-top-right-radius: 12px; + -webkit-border-bottom-right-radius: 12px; + -moz-border-radius-topright: 12px; + -moz-border-radius-bottomright: 12px; + border-top-right-radius: 12px; + border-bottom-right-radius: 12px; + background-color: #ffffff; } /** diff --git a/core/themes/seven/ie.css b/core/themes/seven/ie.css index 21252de7101dd9d0dea5e466fffcfd9a843affd3..df7056ebf5c53179934c642dc77ecab7da74e9d7 100644 --- a/core/themes/seven/ie.css +++ b/core/themes/seven/ie.css @@ -4,3 +4,35 @@ pre, kbd { font-size: 1em; } + +/* Node Add/Edit Page Layout */ + +.layout-node-form { + overflow: hidden; +} + +.overlay .node-actions { + margin-bottom: 1em; +} + +.node-main-content, +.node-actions { + padding: 0.5em 1.5em 0 1.5em; +} + +/** + * 1. Applies the Position Is Everything technique for equal-height columns; + * @see http://www.positioniseverything.net/articles/onetruelayout/equalheight + * 2. When animating the height of elements within this region, prevent + * vertical jittering of elements further down in the document flow. + */ +.node-advanced-settings { + margin-bottom: -999em; + padding-bottom: 999em; + display: table; + + -moz-box-shadow: inset 0.1em -1em 0.6em rgba(100, 100, 100, .1); + -webkit-box-shadow: inset 0.1em -1em 0.6em rgba(100, 100, 100, .1); + box-shadow: inset 0.1em -1em 0.6em rgba(100, 100, 100, .1); + border: none; +} \ No newline at end of file diff --git a/core/themes/seven/style-rtl.css b/core/themes/seven/style-rtl.css index f31d1d3ae29d0362ce15ddb417354ee934dfbd4e..4b676e023951773dcfdc34381dca6dec252a2118 100644 --- a/core/themes/seven/style-rtl.css +++ b/core/themes/seven/style-rtl.css @@ -205,3 +205,22 @@ div.add-or-remove-shortcuts { } /* @end */ + + +/** + * Node Add/Edit Page Layout + */ + +/* Narrow screens */ +/*.overlay .layout-region-secondary { + -moz-box-shadow: inset -0.15em 0.3em .5em rgba(0, 0, 0, .1); + -webkit-box-shadow: inset -0.15em 0.3em .5em rgba(0, 0, 0, .1); + box-shadow: inset -0.15em 0.3em .5em rgba(0, 0, 0, .1); +}*/ +/* Wide screens */ +@media only screen and (min-width: 780px) { + .overlay [id="edit-additional-settings"] { + -webkit-box-shadow: inset -3px 3px 5px rgba(0, 0, 0, .15); + box-shadow: inset -3px 3px 5px rgba(0, 0, 0, .15); + } +} diff --git a/core/themes/seven/style.css b/core/themes/seven/style.css index 8e128d2098d9178d1fa6436d097da57016abc25c..856037d64303cb002fcca8ab4ac0bcac7c425f09 100644 --- a/core/themes/seven/style.css +++ b/core/themes/seven/style.css @@ -182,9 +182,10 @@ pre { position: relative; background-color: #e0e0d8; } -#branding .breadcrumb { +.breadcrumb { font-size: 0.846em; - padding-bottom: 5px; + line-height: 1em; + padding: 0; } /** @@ -674,6 +675,9 @@ input.form-color, input.form-file, textarea.form-textarea, select.form-select { + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; padding: 2px; border: 1px solid #ccc; border-top-color: #999; @@ -682,6 +686,7 @@ select.form-select { -webkit-transition: border linear 0.2s, box-shadow linear 0.2s; -moz-transition: border linear 0.2s, box-shadow linear 0.2s; transition: border linear 0.2s, box-shadow linear 0.2s; + max-width: 100%; } input.form-text:focus, input.form-tel:focus, @@ -807,6 +812,9 @@ select.form-select:focus { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; } #dblog-filter-form .form-actions { float: none; @@ -978,6 +986,7 @@ body.in-maintenance #branding .step-indicator { .overlay #branding { background-color: #fff; padding-top: 15px; + padding-bottom: 15px; } .overlay #branding h1.page-title, .overlay #left, @@ -1462,16 +1471,14 @@ details.fieldset-no-legend { /* @end */ -/* @end */ - /** * Entity meta settings. */ .entity-meta { - background-color: #e2e2e2; + background-color: #ececec; border-bottom: 0; - border-left: 1px solid #a5a5a5; - border-right: 1px solid #a5a5a5; + border-left: 1px solid #bfbfbf; + border-right: 1px solid #bfbfbf; border-top: 0; -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, .15); box-shadow: inset 0 0 5px rgba(0, 0, 0, .15); @@ -1480,13 +1487,16 @@ details.fieldset-no-legend { } .entity-meta-header, .entity-meta details { - background-color: #f2f2f2; - border-top: 1px solid #a5a5a5; - border-bottom: 1px solid #a5a5a5; + background-color: #f7f7f7; + border-top: 1px solid #bfbfbf; + border-bottom: 1px solid #bfbfbf; } .entity-meta-header { padding: 1em 1.5em; } +.entity-meta-header .form-item { + margin: .25em 0; +} .entity-meta-header .published { font-size: 1.231em; font-weight: bold; @@ -1498,15 +1508,15 @@ details.fieldset-no-legend { .entity-meta details { border-left: 0; border-right: 0; - border-top: 1px solid #fff; + border-top: 1px solid #ffffff; margin: 0; } .entity-meta details[open] { background-color: transparent; - background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, .15), transparent 5px); - background-image: -moz-linear-gradient(top, rgba(0, 0, 0, .15), transparent 5px); - background-image: -o-linear-gradient(top, rgba(0, 0, 0, .15), transparent 5px); - background-image: linear-gradient(to bottom, rgba(0, 0, 0, .15), transparent 5px); + background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, .125), transparent 4px); + background-image: -moz-linear-gradient(top, rgba(0, 0, 0, .125), transparent 4px); + background-image: -o-linear-gradient(top, rgba(0, 0, 0, .125), transparent 4px); + background-image: linear-gradient(to bottom, rgba(0, 0, 0, .125), transparent 4px); border-top-width: 0; padding-top: 1px; } @@ -1523,7 +1533,137 @@ details.fieldset-no-legend { text-shadow: 0 1px 0 white; } .entity-meta details .summary { - display: none; /* Hide JS summaries. @todo Rethink summaries. */ + display: none; /* Hide JS summaries. @todo Rethink summaries. */ +} +.overlay .layout-region-node-footer { + padding-bottom: .5em; +} + +/** + * Widescreen + * + * Both of the following media queries must *exactly* match what is in + * node.edit.admin.css. This is rather crazy. + * + * @todo Figure out how to reduce media query duplication across files + * and modules. Layout styles only allowed in themes? + */ +@media + screen and (min-width: 780px), + (orientation: landscape) and (min-device-height: 780px) { + + [class*="page-node-add-"] #page, + .page-node-edit #page { + padding-top: 0; + margin-right: 0; + } + + [class*="page-node-add-"] #console, + .page-node-edit #console { + margin-right: 2.5em; + } + + .layout-node-form { + overflow: hidden; + position: relative; + } + /** + * Draw a bottom border on the meta settings region + * @todo Better ideas welcome. + */ + .layout-node-form:before { + content: ''; + display: block; + height: 0; + width: 34.9%; + position: absolute; + bottom: 0; + right: 0; + border-top: 1px solid #bfbfbf; + } + + .layout-region-node-secondary { + /** + * 1. Applies the Position Is Everything technique for equal-height columns; + * @see http://www.positioniseverything.net/articles/onetruelayout/equalheight + * 2. When animating the height of elements within this region, prevent + * vertical jittering of elements further down in the document flow. + */ + margin-bottom: -999em; /* 1 */ + padding-bottom: 999em; /* 1 */ + display: table; /* 2 */ + + background-color: #f7f7f7; + border-left: 1px solid #bfbfbf; + } + + .entity-meta { + border-left: 0; + border-right: 0; + border-bottom: 1px solid #ffffff; + } + .entity-meta-header { + border-top: 0; + } + + /* Additional overlay theming */ + + /** + * These are terrible selectors. + * @todo Add a proper class to the overlay for this page. + */ + .overlay[class*="page-node-add-"] #overlay-content, + .overlay.page-node-edit #overlay-content { + padding: 0; + } + .overlay[class*="page-node-add-"] #page, + .overlay.page-node-edit #page { + padding: 0; + } + .overlay[class*="page-node-add-"] #branding, + .overlay.page-node-edit #branding { + padding-left: 2em; + padding-right: 2em; + } + .overlay[class*="page-node-add-"] #console, + .overlay.page-node-edit #console { + margin: 0 2em; + } + .overlay[class*="page-node-add-"] .messages, + .overlay.page-node-edit .messages { + margin-bottom: 1em; + } + .overlay .layout-node-form { + border-top: 1px solid #bfbfbf; + } + .overlay .layout-node-form:before { + display: none; + } + .overlay .layout-region-node-main, + .overlay .layout-region-node-footer { + padding-left: 2em; + } + .overlay .layout-region-node-footer { + padding-bottom: 1.5em; + } +} +@media + screen and (max-width: 1020px), + (orientation: landscape) and (max-device-height: 1020px) { + + .toolbar-vertical .layout-region-node-secondary { + margin-bottom: 0; + padding-bottom: 0; + display: block; + } + .toolbar-vertical .layout-region-node-secondary { + margin-bottom: 0; + padding-bottom: 0; + display: block; + } + .toolbar-vertical .layout-node-form:after { + display: none; + } } diff --git a/core/themes/seven/template.php b/core/themes/seven/template.php index ae9120dfba2c890005c3f44cb078986eda0a08fe..5e59526df2de9b59ca2b539e593613400712aabd 100644 --- a/core/themes/seven/template.php +++ b/core/themes/seven/template.php @@ -120,6 +120,11 @@ function seven_preprocess_install_page(&$variables) { function seven_form_node_form_alter(&$form, &$form_state) { $node = $form_state['controller']->getEntity($form_state); + $form['#theme'] = array('node_edit_form'); + $form['#attached'] = array( + 'css' => array(drupal_get_path('module', 'node') . '/node.edit.admin.css'), + ); + $form['advanced']['#type'] = 'container'; $form['meta'] = array ( '#type' => 'fieldset',