From 0da6720ce06d4bb7a601a78a2f22554434dc7301 Mon Sep 17 00:00:00 2001
From: Demian Katz <demian.katz@villanova.edu>
Date: Thu, 8 Nov 2018 13:35:36 -0500
Subject: [PATCH] lessToSass.
---
themes/bootprint3/scss/bootprint.scss | 11 +-
themes/bootstrap3/scss/bootstrap.scss | 17 +--
.../bootstrap3/scss/components/channels.scss | 80 ++++++++++++--
.../bootstrap3/scss/components/lightbox.scss | 23 +++-
themes/bootstrap3/scss/components/search.scss | 6 +-
.../bootstrap3/scss/components/sidebar.scss | 100 +++++++++---------
themes/sandal/scss/common.scss | 15 +--
themes/sandal/scss/sandal.scss | 12 ++-
themes/sandal/scss/search.scss | 18 ++--
9 files changed, 184 insertions(+), 98 deletions(-)
diff --git a/themes/bootprint3/scss/bootprint.scss b/themes/bootprint3/scss/bootprint.scss
index c9b8e98ed7b..77e60b825c6 100644
--- a/themes/bootprint3/scss/bootprint.scss
+++ b/themes/bootprint3/scss/bootprint.scss
@@ -82,6 +82,11 @@ footer ul { padding-left: 30px; }
[id^=list].list-group .col-sm-9 { margin: 0; }
/* --- Channels --- */
+.channel {
+ max-width: 96%;
+ margin-left: 2%;
+ margin-right: 2%;
+}
.channel,
.channel-title.no-results { margin-bottom: 2rem; }
.channel-title { margin-top: 1rem; }
@@ -149,7 +154,6 @@ ul.random.image li img { margin: 0 auto; }
.facet .badge a { color: #fff; }
.facet.facetOR { padding-left: 1rem; }
- .facet.excludable { padding-right: 0; }
}
.slider-container .slider-handle {
background: $brand-primary;
@@ -164,5 +168,8 @@ ul.random.image li img { margin: 0 auto; }
color: #fff;
&:hover { color: $brand-danger; }
}
-.jstree-facet .facet { padding: 0; }
+.jstree-facet .facet {
+ padding: 0;
+ padding-right: 10px;
+}
.jstree-node.active { background-color: $active-orange; }
diff --git a/themes/bootstrap3/scss/bootstrap.scss b/themes/bootstrap3/scss/bootstrap.scss
index 5433b8e62e2..853afdf3359 100644
--- a/themes/bootstrap3/scss/bootstrap.scss
+++ b/themes/bootstrap3/scss/bootstrap.scss
@@ -114,6 +114,11 @@ footer {
float: right;
padding-left: 1rem;
}
+ .mainbody.solo {
+ width: auto;
+ padding-left: 0;
+ padding-right: 0;
+ }
}
/* ------ Form Errors ------ */
@@ -215,18 +220,6 @@ footer {
.date-from { padding-right: .25rem; }
.date-to { padding-left: .25rem; }
}
-.top-facets {
- margin-left: -.5rem;
- margin-right: -.5rem;
-}
-.top-facets .facet,
-.top-facets .narrow-toggle,
-.top-facets > strong {
- display: inline-block;
- padding: .25rem .5rem;
- white-space: nowrap;
-}
-.top-facets .narrow-toggle { text-decoration: underline; }
@media (min-width: 768px) {
.author-facets { display: flex; }
.author-list { flex: 0 1 100%; }
diff --git a/themes/bootstrap3/scss/components/channels.scss b/themes/bootstrap3/scss/components/channels.scss
index dddb8817c98..65cbae9222e 100644
--- a/themes/bootstrap3/scss/components/channels.scss
+++ b/themes/bootstrap3/scss/components/channels.scss
@@ -1,15 +1,47 @@
+.channel-wrapper {
+ margin-top: 1rem;
+ margin-bottom: 2rem;
+}
+@media (max-width: 767px) {
+ .channel-wrapper {
+ margin-left: 1rem;
+ }
+}
.channel {
position: relative;
width: 100%;
- height: 300px;
- border: 1px solid $btn-default-border;
+ max-height: 300px;
+ padding: 1rem;
+ background-color: #eee;
border-radius: $border-radius-base;
}
-.channel .slider-menu {
- border-top-color: $btn-default-border;
- border-radius: 0 0 $border-radius-base $border-radius-base;
- .channel-links .btn { margin-left: 4px; }
+
+.channel-add-menu {
+ position: relative;
+ margin-bottom: 1rem;
+ padding-bottom: 1rem;
+ border-bottom: 1px solid $gray;
+ text-align: center;
}
+@media (min-width: 768px) {
+ .channel-add-menu {
+ float: right;
+ margin: 0;
+ padding: 0;
+ border: 0;
+
+ body.rtl & {
+ float: left;
+ }
+ }
+}
+.channel-add-menu .dropdown-menu {
+ left: auto;
+ right: 0;
+ max-width: 90vw;
+ overflow: hidden;
+}
+
.channel .channel-record.slide {
display: inline-block;
min-width: 100px;
@@ -21,16 +53,32 @@
}
.channel .channel-record.is-selected { @extend a:hover; }
.channel .channel-record .thumb {
+ display: flex;
height: 200px;
- background-position: center center;
- background-repeat: no-repeat;
- background-size: contain;
+ align-items: center;
+ justify-content: center;
+}
+.channel .channel-record .thumb img {
+ max-width: 100%;
+ max-height: 100%;
}
+
.channel .popover {
width: 500px;
max-width: none;
}
+.channel .popover-title {
+ font-size: 1.4rem;
+ font-weight: bold;
+}
+.channel-title h2 {
+ display: inline-block;
+ margin: 0;
+}
+.channel-title .dropdown {
+ display: inline-block;
+}
.channel-title a:hover { text-decoration: none; }
.channel-title i.fa-fw {
width: 1.4em;
@@ -40,3 +88,17 @@
vertical-align: top;
}
.channel-title .placeholder { width: 25px; }
+
+.channel-title .dropdown button {
+ font-size: 18px;
+ color: #777;
+ vertical-align: baseline;
+}
+.channel .slick-prev::before,
+.channel .slick-next::before {
+ color: #555;
+}
+
+.channel-search {
+ margin-top: 1rem;
+}
diff --git a/themes/bootstrap3/scss/components/lightbox.scss b/themes/bootstrap3/scss/components/lightbox.scss
index 9361fab53c8..d24c96b3f65 100644
--- a/themes/bootstrap3/scss/components/lightbox.scss
+++ b/themes/bootstrap3/scss/components/lightbox.scss
@@ -1,17 +1,30 @@
#modal { background-color: rgba(0,0,0,.2); }
-#modal .modal-content > .close { // Fancy side X button
+
+#modal .modal-content > .close {
position: absolute;
- right: -50px;
top: 0;
+ right: 0;
z-index: 2;
- font-size: 32pt;
- color: #fff;
+ padding: .5rem 1rem;
opacity: .7;
+
body.rtl & {
- left: -50px;
+ left: 0;
right: auto;
}
}
+@media (min-width: 768px) {
+ #modal .modal-content > .close { // Fancy side X button
+ right: -50px;
+ font-size: 32pt;
+ color: #fff;
+ body.rtl & {
+ left: -50px;
+ right: auto;
+ }
+ }
+}
+
#modal .modal-content > .close:hover { opacity: 1; }
#modal .modal-body h1,
#modal .modal-body h2 {
diff --git a/themes/bootstrap3/scss/components/search.scss b/themes/bootstrap3/scss/components/search.scss
index bb0ecf8dcc1..d797d7e2f23 100644
--- a/themes/bootstrap3/scss/components/search.scss
+++ b/themes/bootstrap3/scss/components/search.scss
@@ -98,6 +98,8 @@ header .container.navbar { margin-bottom: 0; }
.media {
flex: 1;
margin: 0;
+ padding-right: 10px;
+ padding-left: 10px;
}
.media-left,
.media-right {
@@ -114,13 +116,13 @@ header .container.navbar { margin-bottom: 0; }
max-width: none;
}
}
+ .media-left { margin-right: 10px; }
+ .media-right { margin-left: 10px; }
@media (min-width: 768px) {
.media-left,
.media-right {
max-width: 25%;
- padding-right: 10px;
- padding-left: 10px;
a {
display: inline-block;
diff --git a/themes/bootstrap3/scss/components/sidebar.scss b/themes/bootstrap3/scss/components/sidebar.scss
index 9c51e515165..059b4d9fb81 100644
--- a/themes/bootstrap3/scss/components/sidebar.scss
+++ b/themes/bootstrap3/scss/components/sidebar.scss
@@ -3,33 +3,6 @@
margin-bottom: 1rem;
padding-left: 0;
- .facet,
- .title {
- display: block;
- padding: 8px 15px;
- line-height: 1.5rem;
- width: 100%;
- text-align: left;
- background-color: transparent;
-
- .badge,
- .status {
- float: right;
-
- body.rtl & { float: left; }
- }
- .badge {
- max-height: 19px;
- line-height: 1.1rem;
- }
- }
- .facet { border-bottom: 1px solid $list-group-border; }
- .title {
- padding-right: 8px;
- border: 1px solid $list-group-border;
- font-weight: bold;
- }
-
[data-toggle="collapse"] {
cursor: pointer;
@@ -49,32 +22,58 @@
border-right: 1px solid $list-group-border;
}
& > .facet:first-child { border-top: 1px solid $list-group-border; }
+}
- .facetOR .text {
- display: inline-block;
- padding-left: 0.5rem;
- text-indent: -0.5rem;
- }
- .excludable {
- display: flex;
- flex-direction: row-reverse;
- padding-right: 0;
+.facet,
+.facet-group .title {
+ display: flex;
+ padding: .5rem;
+ width: 100%;
+ line-height: 1.5rem;
+ background-color: transparent;
- .badge { flex-shrink: 0; }
- .text { flex-grow: 1; }
- .exclude {
- flex-basis: 2rem;
- flex-shrink: 0;
- text-align: center;
- }
+ .text {
+ flex-grow: 1;
+ }
- body.rtl & {
- padding-left: 0;
- padding-right: 15px;
- }
+ .badge {
+ flex-shrink: 0;
+ max-height: 19px;
+ line-height: 1.1rem;
}
+
+ .exclude {
+ flex-shrink: 0;
+ text-align: center;
+ padding-left: 0.5rem;
+ }
+}
+.facet {
+ border-bottom: 1px solid $list-group-border;
}
+.facet-group .title {
+ display: block;
+ padding-right: 8px;
+ border: 1px solid $list-group-border;
+ font-weight: bold;
+ text-align: inherit;
+}
+
+.top-facets {
+ margin-left: -.5rem;
+ margin-right: -.5rem;
+}
+.top-facets .facet,
+.top-facets .narrow-toggle,
+.top-facets > strong {
+ display: inline-block;
+ width: auto;
+ padding: .25rem .5rem;
+ border: 0;
+ white-space: nowrap;
+}
+.top-facets .narrow-toggle { text-decoration: underline; }
.checkbox-filter {
display: block;
@@ -120,17 +119,16 @@
}
.full-facet-list { margin-top: 1rem; }
-.full-facet-list .active .fa {
+.full-facet-list .active .fa.fa-times {
float: right;
margin-top: .25rem;
- margin-right: 0.5rem;
margin-left: 0.5rem;
}
-body.rtl .full-facet-list .active .fa { float: left; }
+body.rtl .full-facet-list .active .fa.fa-times { float: left; }
.jstree-node {
.facet {
- padding: 0;
+ padding: 0 0.5rem 0 0;
border: none;
}
}
diff --git a/themes/sandal/scss/common.scss b/themes/sandal/scss/common.scss
index 30c1391f0e5..f835a95b6db 100644
--- a/themes/sandal/scss/common.scss
+++ b/themes/sandal/scss/common.scss
@@ -3,12 +3,13 @@ $list-group-border-radius: 0 !default;
$border-radius-large: 0 !default; // modal
/* ------ Common element changes ------ */
-h1, h2, h3, h4 {
- margin: 0;
- margin-bottom: 1rem;
-
- .help-block & { margin: 0; }
+.help-block {
+ h1,
+ h2,
+ h3,
+ h4 { margin: 0; }
}
+
.highlight,
mark { background-color: $highlighter-color; }
table { font-size: $reduced-font-size; }
@@ -86,8 +87,8 @@ select.form-control {
.alert-success,
.alert-success:hover {
color: $dark-green;
- background-color: $light-green;
- a { color: $white; }
+ background-color: $washed-green;
+ a { color: $green; }
}
.alert-danger,
.alert-danger:hover {
diff --git a/themes/sandal/scss/sandal.scss b/themes/sandal/scss/sandal.scss
index 5d34610ba2c..8bb5c738609 100644
--- a/themes/sandal/scss/sandal.scss
+++ b/themes/sandal/scss/sandal.scss
@@ -162,6 +162,8 @@ header {
font-size: $reduced-font-size;
background-color: $light-gray;
+ h1,h2,h3,h4 { margin-top: 0; }
+
.facet-group {
margin-left: 1rem;
margin-right: 1rem;
@@ -206,10 +208,16 @@ header {
.facet .badge {
max-height: 15px;
margin-top: 5px;
- line-height: .8;
- background-color: $sidebar-item-badge;
}
}
+
+.facet .badge {
+ flex-shrink: 0;
+ max-height: 19px;
+ line-height: .8;
+ background-color: $sidebar-item-badge;
+}
+
.sidebar.left,
.sidebar.right {
padding-left: 0;
diff --git a/themes/sandal/scss/search.scss b/themes/sandal/scss/search.scss
index 0ad5d19635c..04af0a1a578 100644
--- a/themes/sandal/scss/search.scss
+++ b/themes/sandal/scss/search.scss
@@ -17,9 +17,8 @@
.result {
margin-left: -1rem;
margin-right: -1rem;
- padding-top: 1rem;
- padding-left: 1rem;
- padding-bottom: 1rem;
+ padding: 1rem;
+ padding-right: 0;
border-bottom: 1px solid $moon-gray;
font-size: $reduced-font-size;
@@ -112,7 +111,6 @@
.grid-result .grid-checkbox label { width: 100%; }
@media (min-width: 768px) {
- .result { padding-right: 1rem; }
.result-body { width: 75%; }
.result-links {
width: 25%;
@@ -259,8 +257,12 @@
padding-top: 1rem;
padding-bottom: 1rem;
}
-.combined-search-container {
- @include full-width();
-
- .result { margin-right: 0; }
+.template-dir-combined.template-name-results {
+ .bulkActionButtons {
+ max-width: 1170px;
+ margin: auto;
+ }
+ .main .container {
+ width: 100%;
+ }
}
--
GitLab