From 7d1a337ea8c89b3ad2ecc676dba7c53fc070ba61 Mon Sep 17 00:00:00 2001 From: Tobias Klika Date: Sat, 31 Aug 2019 13:10:22 +0200 Subject: [PATCH] group and describe overrides in uCare package --- .../App_Plugins/brothers.uCare/uCare.css | 325 +++++++++++------- 1 file changed, 196 insertions(+), 129 deletions(-) diff --git a/UmbracoPackages/App_Plugins/brothers.uCare/uCare.css b/UmbracoPackages/App_Plugins/brothers.uCare/uCare.css index 6d2fef5..ba08523 100644 --- a/UmbracoPackages/App_Plugins/brothers.uCare/uCare.css +++ b/UmbracoPackages/App_Plugins/brothers.uCare/uCare.css @@ -1,6 +1,10 @@  -/* generic overrides */ +/* BUTTONS +/* ********************************************************** +/* make buttons bigger and better clickable +/* includes actions buttons which appear in dropdown lists +/* ********************************************************** */ .btn, .btn-group > .btn, .btn-group > .dropdown-menu, .btn-group > .popover { @@ -12,6 +16,196 @@ padding: 10px 18px; } +.umb-action-link +{ + padding: 12px 25px 12px 20px; + font-size: 14px; +} + +.umb-action-link:focus, .umb-action-link:hover, .umb-action.selected +{ + color: #2152a3 !important; + background: #f9f6f5 !important; +} + +.btn-outline +{ + border-color: #e9e9eb; +} + + + +/* CONTENT TABS +/* ********************************************************** +/* Way more space for tabs and better visibility by +/* providing a background which flows into the content +/* ********************************************************** */ + +.umb-sub-views-nav-item .icon +{ + font-size: 20px !important; + margin-bottom: 3px; + margin-right: 10px; +} + +.umb-sub-views-nav-item > a +{ + padding: 6px 30px 4px 26px; + min-width: 80px; + flex-direction: row; +} + +.umb-sub-views-nav-item > a.is-active +{ + padding: 6px 30px 5px 26px; + background: #f6f4f4; + height: 70px; +} + +.umb-sub-views-nav-item-text +{ + font-size: 14px; + line-height: 20px; +} + +.umb-sub-views-nav-item > a.is-active .umb-sub-views-nav-item-text +{ + font-weight: 600; +} + +.umb-sub-views-nav-item > a:active +{ + box-shadow: none; +} + +.umb-sub-views-nav-item > a.is-active::after +{ + display: none; +} + +.umb-sub-views-nav-item__anchor_dropdown +{ + display: none; +} + + + +/* DROPWDOWNS AND MODALS +/* ********************************************************** +/* More padding for dropdown items and matching headlines +/* for flyouts +/* ********************************************************** */ + +.dropdown-menu > li > a +{ + padding: 12px 20px; +} + +.umb-modalcolumn-header h1 +{ + font-weight: 700; + font-size: 15px; +} + + + +/* FORM ELEMENTS +/* ********************************************************** +/* Softer inputs and usability enhancements +/* ********************************************************** */ + +.umb-editor-header__name-wrapper, +.uneditable-input, input[type="color"], input[type="date"], input[type="datetime-local"], input[type="datetime"], input[type="email"], input[type="month"], +input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="time"], input[type="url"], input[type="week"], textarea, +.umb-mediapicker > div +{ + border-color: #eceaea; +} + +.mce-panel +{ + border-color: #eceaea !important; +} + +input.umb-editor-header__name-input +{ + border-color: transparent !important; +} + +.mce-top-part::before +{ + display: none !important; +} + + + +/* TREE +/* ********************************************************** +/* The tree needs more clickable space per item and a +/* softer active state +/* ********************************************************** */ + +.umb-tree-icon +{ + margin: 0 15px 0 5px; +} + +.has-unpublished-version > .umb-tree-item__inner > .umb-tree-item__annotation, +.is-container > .umb-tree-item__inner > .umb-tree-item__annotation, +.protected > .umb-tree-item__inner > .umb-tree-item__annotation +{ + margin-left: 18px !important; + top: 22px !important; +} + +.umb-tree-item.current > .umb-tree-item__inner +{ + background: #f7e4e1; + border-right: 3px solid #f5c1bc; +} + +.umb-tree-item__label +{ + padding: 12px 0 10px 0 !important; +} + + + +/* FOOTER +/* ********************************************************** +/* Higher footer to match updated buttons +/* ********************************************************** */ + +.umb-editor-footer +{ + height: 60px; +} + +.umb-editor-container +{ + bottom: 60px; +} + + + +/* BOXES +/* ********************************************************** +/* TODO desc +/* ********************************************************** */ + +.umb-box-header +{ + padding: 20px 20px; + background: #faf8f8; + border-radius: 3px 3px 0 0; +} + + + +/* TABIFY PACKAGE +/* ********************************************************** +/* static tabs instead of fixed and some visual updates +/* ********************************************************** */ .tabLink { font-size: 14px !important; @@ -78,131 +272,4 @@ { position: relative !important; top: 0 !important; -} - - -.umb-tree-item__label -{ - padding: 12px 0 10px 0 !important; -} - -.umb-editor-header__name-wrapper, -.uneditable-input, input[type="color"], input[type="date"], input[type="datetime-local"], input[type="datetime"], input[type="email"], input[type="month"], -input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="time"], input[type="url"], input[type="week"], textarea, -.umb-mediapicker > div -{ - border-color: #eceaea; -} - -.mce-panel -{ - border-color: #eceaea !important; -} - -input.umb-editor-header__name-input -{ - border-color: transparent !important; -} - -.mce-top-part::before -{ - display: none !important; -} - -.umb-tree-icon -{ - margin: 0 15px 0 5px; -} - -.has-unpublished-version > .umb-tree-item__inner > .umb-tree-item__annotation, -.is-container > .umb-tree-item__inner > .umb-tree-item__annotation, -.protected > .umb-tree-item__inner > .umb-tree-item__annotation -{ - margin-left: 18px !important; - top: 22px !important; -} - -.umb-tree-item.current > .umb-tree-item__inner -{ - background: #f7e4e1; - border-right: 3px solid #f5c1bc; -} - -.umb-sub-views-nav-item .icon -{ - font-size: 20px !important; - margin-bottom: 3px; - margin-right: 10px; -} - -.umb-sub-views-nav-item > a -{ - padding: 6px 30px 4px 26px; - min-width: 80px; - flex-direction: row; -} - -.umb-sub-views-nav-item > a.is-active -{ - padding: 6px 30px 5px 26px; - background: #f6f4f4; - height: 70px; -} - -.umb-sub-views-nav-item-text -{ - font-size: 14px; - line-height: 20px; -} - -.umb-sub-views-nav-item > a.is-active .umb-sub-views-nav-item-text -{ - font-weight: 600; -} - -.umb-sub-views-nav-item > a:active -{ - box-shadow: none; -} - -.umb-sub-views-nav-item > a.is-active::after -{ - display: none; -} - -.umb-sub-views-nav-item__anchor_dropdown -{ - display: none; -} - -.dropdown-menu > li > a -{ - padding: 12px 20px; -} - -.umb-action-link -{ - padding: 12px 25px 12px 20px; - font-size: 14px; -} - -.umb-action-link:focus, .umb-action-link:hover, .umb-action.selected -{ - color: #2152a3 !important; - background: #f9f6f5 !important; -} - -.umb-modalcolumn-header h1 -{ - font-weight: 700; - font-size: 15px; -} - -.umb-editor-footer -{ - height: 60px; -} - -.umb-editor-container -{ - bottom: 60px; +} \ No newline at end of file