Skip to content

Commit

Permalink
Migration Part 2
Browse files Browse the repository at this point in the history 
Migrated Views bulk action form & added initial styles for
admin_bar
  • Loading branch information
@saschaeggi
saschaeggi committed Jul 2, 2023
1 parent 7a94f08 commit f6a93ef
Show file tree
Hide file tree
Showing 21 changed files with 493 additions and 178 deletions.
69 changes: 37 additions & 32 deletions dist/css/base/gin.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1222,7 +1222,7 @@ table.sticky-header {
visibility: hidden;
z-index: 98;
position: fixed;
top: calc(var(--ginHorizontalToolbarOffset) + var(--ginStickyOffset)) !important;
top: calc(var(--gin-toolbar-y-offset) + var(--gin-sticky-offset)) !important;
background: transparent;
}

Expand Down Expand Up @@ -1293,6 +1293,10 @@ table thead tr:hover {
background: transparent;
}

table thead tr th {
border-bottom: none;
}

table th {
font-size: var(--gin-font-size-s);
font-weight: var(--gin-font-weight-bold);
Expand All @@ -1310,7 +1314,9 @@ table th, table th .form-item__label {
}
}

table tbody tr {
table tbody tr,
table tbody tr.odd,
table tbody tr.even {
border-bottom: 1px solid var(--gin-border-color-table);
}

Expand Down Expand Up @@ -1496,6 +1502,18 @@ td.webform-has-field-suffix > .form-item > .form-element {
margin-top: 0;
}

.tableresponsive-toggle {
font-size: var(--gin-font-size-xs);
}

[dir="ltr"] .tableresponsive-toggle {
float: right;
}

[dir="rtl"] .tableresponsive-toggle {
float: left;
}

.draggable a.tabledrag-handle {
float: none;
vertical-align: middle;
Expand Down Expand Up @@ -2308,7 +2326,7 @@ tr .form-item {
.button:not(:focus),
.form-actions .button,
.action-link--icon-trash.action-link {
padding: calc(var(--gin-spacing-m) - 2px) calc(var(--gin-spacing-l) - 2px);
padding: var(--gin-spacing-s) var(--gin-spacing-m);
border: 2px solid var(--gin-color-primary) !important;
border-radius: var(--gin-border-m);
box-shadow: 0 1px 2px var(--gin-color-primary-light);
Expand Down Expand Up @@ -3807,8 +3825,8 @@ tr.color-error:focus,
margin-bottom: var(--gin-spacing-xl);
}

.upgrade-status-counter__status-icon--not-scanned:before,
.upgrade-status-summary tr.not-scanned > td.status-info:before {
.report-info .report-icon div::before,
.admin-dblog .icon::before {
background-image: none;
background-color: var(--gin-color-text);
-webkit-mask-image: url("../../media/sprite.svg#info-view");
Expand All @@ -3821,16 +3839,8 @@ tr.color-error:focus,
mask-size: 20px 20px;
}

.system-status-counter__status-icon--checked:before,
.admin-dblog .dblog-info .icon,
.admin-dblog .dblog-notice .icon,
.system-status-report__status-icon--checked .details-title:before,
.details .system-status-report__status-icon--checked:before,
.color-checked .system-status-report__status-title:before,
.upgrade-status-counter__status-icon--checked:before,
.upgrade-status-error-list tr.no-known-error > td.status-info:before,
.upgrade-status-summary tr.no-known-error > td.status-info:before,
#checked + .claro-details__wrapper--system-status-report .system-status-report__status-title:before {
.report-status .report-icon div::before,
.admin-dblog .dblog-status .icon::before {
background-image: none;
background-color: var(--gin-color-green);
-webkit-mask-image: url("../../media/sprite.svg#status-view");
Expand All @@ -3843,13 +3853,9 @@ tr.color-error:focus,
mask-size: 20px 20px;
}

.system-status-counter__status-icon--warning:before,
.admin-dblog .dblog-warning .icon,
.system-status-report__status-icon--warning .details-title:before,
.details .system-status-report__status-icon--warning:before,
.upgrade-status-counter__status-icon--warning:before,
.upgrade-status-error-list tr.known-warnings > td.status-info:before,
.upgrade-status-summary tr.known-warnings > td.status-info:before {
.report-warning .report-icon div::before,
.admin-dblog .dblog-debug .icon::before,
.admin-dblog .dblog-warning .icon::before {
background-image: none;
background-color: var(--gin-color-warning);
-webkit-mask-image: url("../../media/sprite.svg#warning-view");
Expand All @@ -3862,16 +3868,8 @@ tr.color-error:focus,
mask-size: 20px 20px;
}

.system-status-counter__status-icon--error:before,
.admin-dblog .dblog-error .icon,
.admin-dblog .dblog-critical .icon,
.admin-dblog .dblog-alert .icon,
.admin-dblog .dblog-emergency .icon,
.system-status-report__status-icon--error .details-title:before,
.details .system-status-report__status-icon--error:before,
.upgrade-status-counter__status-icon--error:before,
.upgrade-status-error-list tr.known-errors > td.status-info:before,
.upgrade-status-summary tr.known-errors > td.status-info:before {
.report-error .report-icon div::before,
.admin-dblog .dblog-error .icon::before {
background-image: none;
background-color: var(--gin-color-danger);
-webkit-mask-image: url("../../media/sprite.svg#error-view");
Expand Down Expand Up @@ -4266,6 +4264,13 @@ ul.primary li.active a {
.container-fluid {
margin-left: min(5vw, var(--gin-spacing-xxl));
margin-right: min(5vw, var(--gin-spacing-xxl));
padding-left: 0;
padding-right: 0;
}

.layout.dashboard .region-sticky .container-fluid {
margin-left: 0;
margin-right: 0;
}

html {
Expand Down
6 changes: 3 additions & 3 deletions dist/css/components/tableselect.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,9 +46,9 @@
}
}

.block-system > .views-form .views-bulk-form > .form-wrapper,
.view-content .views-form .views-bulk-form > .form-wrapper {
padding: var(--gin-spacing-m);
.block-system > .views-form .views-bulk-form.form-wrapper,
.view-content .views-form .views-bulk-form.form-wrapper {
padding: var(--gin-spacing-xs) var(--gin-spacing-m) var(--gin-spacing-m);
}

.block-system > .views-form .views-bulk-form.is-sticky,
Expand Down
194 changes: 193 additions & 1 deletion dist/css/layout/gin_admin_bar.css
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
:root {
--gin-toolbar-secondary-height: 48px;
--gin-toolbar-height: 33px;
--gin-toolbar-height: 32px;
--gin-scroll-offset: 72px;
--gin-toolbar-y-offset: var(--gin-toolbar-height);
--gin-toolbar-x-offset: 0px;
Expand All @@ -9,9 +9,201 @@

@media (min-width: 61em) {
:root {
--gin-toolbar-height: 48px;
--gin-scroll-offset: 180px;
--gin-icon-size-toolbar: 18px;
--gin-sticky-offset: var(--gin-height-sticky);
}
}

.admin-bar body {
border-top: 0 !important;
padding-top: var(--gin-toolbar-height);
}

#admin-bar {
font-family: var(--gin-font);
box-shadow: none;
}

@media (min-width: 64em) {
#admin-bar #admin-bar-menu > li > .dropdown > li > a {
background: none !important;
text-shadow: none;
}

#admin-bar > .dropdown li > a,
#admin-bar > .dropdown li > span {
font-size: var(--gin-font-size-xxs);
font-weight: var(--gin-font-weight-normal);
}
}

#admin-bar #admin-bar-icon .icon,
#admin-bar #admin-bar-extra .extra,
#admin-bar #admin-bar-extra .page,
#admin-bar #admin-bar-extra .user-counter,
#admin-bar #admin-bar-extra .account,
#admin-bar #admin-bar-extra .logout,
#admin-bar #admin-bar-menu > li > .dropdown > li > a {
padding: var(--gin-spacing-m) var(--gin-spacing-s);
background: none;
}

#admin-bar #admin-bar-icon .icon::before,
#admin-bar #admin-bar-extra .extra::before,
#admin-bar #admin-bar-extra .page::before,
#admin-bar #admin-bar-extra .user-counter::before,
#admin-bar #admin-bar-extra .account::before,
#admin-bar #admin-bar-extra .logout::before,
#admin-bar #admin-bar-menu > li > .dropdown > li > a::before {
content: "";
display: block;
width: 16px;
height: 16px;
background-color: var(--gin-color-disabled);
-webkit-mask-position: center center;
mask-position: center center;
}

[dir="ltr"] #admin-bar #admin-bar-icon .icon::before,
[dir="ltr"] #admin-bar #admin-bar-extra .extra::before,
[dir="ltr"] #admin-bar #admin-bar-extra .page::before,
[dir="ltr"] #admin-bar #admin-bar-extra .user-counter::before,
[dir="ltr"] #admin-bar #admin-bar-extra .account::before,
[dir="ltr"] #admin-bar #admin-bar-extra .logout::before,
[dir="ltr"] #admin-bar #admin-bar-menu > li > .dropdown > li > a::before {
float: left;
margin-right: var(--gin-spacing-xs);
}

[dir="rtl"] #admin-bar #admin-bar-icon .icon::before,
[dir="rtl"] #admin-bar #admin-bar-extra .extra::before,
[dir="rtl"] #admin-bar #admin-bar-extra .page::before,
[dir="rtl"] #admin-bar #admin-bar-extra .user-counter::before,
[dir="rtl"] #admin-bar #admin-bar-extra .account::before,
[dir="rtl"] #admin-bar #admin-bar-extra .logout::before,
[dir="rtl"] #admin-bar #admin-bar-menu > li > .dropdown > li > a::before {
float: right;
margin-left: var(--gin-spacing-xs);
}

#admin-bar #admin-bar-icon .icon.active-trail,
#admin-bar #admin-bar-extra .extra.active-trail,
#admin-bar #admin-bar-extra .page.active-trail,
#admin-bar #admin-bar-extra .user-counter.active-trail,
#admin-bar #admin-bar-extra .account.active-trail,
#admin-bar #admin-bar-extra .logout.active-trail,
#admin-bar #admin-bar-menu > li > .dropdown > li > a.active-trail {
color: #fff;
font-weight: var(--gin-font-weight-bold);
background: rgba(255, 255, 255, .1) !important;
}

#admin-bar #admin-bar-icon .icon.active-trail::before,
#admin-bar #admin-bar-extra .extra.active-trail::before,
#admin-bar #admin-bar-extra .page.active-trail::before,
#admin-bar #admin-bar-extra .user-counter.active-trail::before,
#admin-bar #admin-bar-extra .account.active-trail::before,
#admin-bar #admin-bar-extra .logout.active-trail::before,
#admin-bar #admin-bar-menu > li > .dropdown > li > a.active-trail::before {
background-color: #fff;
}

#admin-bar #admin-bar-icon .icon:before {
-webkit-mask-image: url("../../media/sprite.svg#backdrop-view");
mask-image: url("../../media/sprite.svg#backdrop-view");
}

#admin-bar .admin-dashboard:before {
-webkit-mask-image: url("../../media/sprite.svg#sidebar-view");
mask-image: url("../../media/sprite.svg#sidebar-view");
}

#admin-bar .admin-content:before {
-webkit-mask-image: url("../../media/sprite.svg#content-view");
mask-image: url("../../media/sprite.svg#content-view");
}

#admin-bar .admin-people:before {
-webkit-mask-image: url("../../media/sprite.svg#user-view");
mask-image: url("../../media/sprite.svg#user-view");
}

#admin-bar .admin-appearance:before {
-webkit-mask-image: url("../../media/sprite.svg#appearance-view");
mask-image: url("../../media/sprite.svg#appearance-view");
}

#admin-bar .admin-modules:before {
-webkit-mask-image: url("../../media/sprite.svg#extend-view");
mask-image: url("../../media/sprite.svg#extend-view");
}

#admin-bar .admin-structure:before {
-webkit-mask-image: url("../../media/sprite.svg#structure-view");
mask-image: url("../../media/sprite.svg#structure-view");
}

#admin-bar .admin-config:before {
-webkit-mask-image: url("../../media/sprite.svg#config-view");
mask-image: url("../../media/sprite.svg#config-view");
}

#admin-bar .admin-reports:before {
-webkit-mask-image: url("../../media/sprite.svg#reports-view");
mask-image: url("../../media/sprite.svg#reports-view");
}

#admin-bar .extra:before {
-webkit-mask-image: url("../../media/sprite.svg#more-view");
mask-image: url("../../media/sprite.svg#more-view");
}

#admin-bar .page:before {
-webkit-mask-image: url("../../media/sprite.svg#content-view");
mask-image: url("../../media/sprite.svg#content-view");
}

#admin-bar .user-counter:before {
-webkit-mask-image: url("../../media/sprite.svg#users-view");
mask-image: url("../../media/sprite.svg#users-view");
}

#admin-bar .account:before {
-webkit-mask-image: url("../../media/sprite.svg#user-view");
mask-image: url("../../media/sprite.svg#user-view");
}

#admin-bar .logout:before {
-webkit-mask-image: url("../../media/sprite.svg#logout-view");
mask-image: url("../../media/sprite.svg#logout-view");
}

#admin-bar .top-level .admin-bar-search .form-item {
padding-top: 9px;
}

#admin-bar #admin-bar-search-items {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
font-size: var(--gin-font-size-xxs);
line-height: 1;
border-radius: var(--gin-border-xl);
}

[dir="ltr"] #admin-bar #admin-bar-search-items {
padding: var(--gin-spacing-xs) var(--gin-spacing-xl) var(--gin-spacing-xs) var(--gin-spacing-m);
background: #fff url("../../media/sprite.svg#search-view") no-repeat center right var(--gin-spacing-s);
}

[dir="rtl"] #admin-bar #admin-bar-search-items {
padding: var(--gin-spacing-xs) var(--gin-spacing-m) var(--gin-spacing-xs) var(--gin-spacing-xl);
background: #fff url("../../media/sprite.svg#search-view") no-repeat center left var(--gin-spacing-s);
}

[dir] #admin-bar #admin-bar-search-items {
background-size: var(--gin-icon-size-toolbar-secondary) var(--gin-icon-size-toolbar-secondary);
}

2 changes: 1 addition & 1 deletion dist/css/theme/dialog.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -131,7 +131,7 @@
.ui-dialog .button:not(:focus),
.ui-dialog .form-actions .button,
.ui-dialog .action-link--icon-trash.action-link {
padding: calc(var(--gin-spacing-m) - 2px) calc(var(--gin-spacing-l) - 2px);
padding: var(--gin-spacing-s) var(--gin-spacing-m);
border: 2px solid var(--gin-color-primary) !important;
border-radius: var(--gin-border-m);
box-shadow: 0 1px 2px var(--gin-color-primary-light);
Expand Down
2 changes: 2 additions & 0 deletions dist/css/theme/variables.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -94,6 +94,8 @@
--gin-switch: #26a769;
--gin-shadow-button: #00000033;
--gin-color-button-text: #fff;
--gin-offset-x: var(--gin-toolbar-x-offset);
--gin-offset-y: calc(var(--gin-toolbar-y-offset) + var(--gin-sticky-offset));
}

@media (min-width: 61em) {
Expand Down
2 changes: 1 addition & 1 deletion dist/media/sprite.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
8 changes: 0 additions & 8 deletions includes/libraries.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -117,14 +117,6 @@ function gin_library_info() {
),
);

$libraries['gin_admin_bar'] = array(
'title' => 'Admin bar',
'version' => BACKDROP_VERSION,
'css' => array(
$basethemeurl . '/dist/css/layout/gin_admin_bar.css' => array(),
),
);

$libraries['sidebar'] = array(
'title' => 'Sidebar',
'version' => BACKDROP_VERSION,
Expand Down
Loading

0 comments on commit f6a93ef

Please sign in to comment.