Skip to content

Commit

Permalink
Style improvements & cleanup CSS
Browse files Browse the repository at this point in the history
  • Loading branch information
@kreafox
kreafox committed Jun 2, 2022
1 parent 0756bbd commit 321caeb
Show file tree
Hide file tree
Showing 5 changed files with 162 additions and 229 deletions.
143 changes: 35 additions & 108 deletions src/SearchBlock/less/facets.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -57,18 +57,8 @@ div#page-document .searchlib-block {
}

.content-section-tabs.menu {
overflow: auto;
width: 100%;
max-width: 100%;
border: none;
border-top: none;
border-right: none;
border-bottom: 1px solid @midGray;
border-left: none;
margin: 0;
margin-bottom: 3px;
border-radius: 0px;
box-shadow: none;
margin-bottom: 1em;
overflow-x: auto;

.item.dropdown {
padding: 0px 10px 0px 10px;
Expand Down Expand Up @@ -104,10 +94,10 @@ div#page-document .searchlib-block {
}

a.item {
padding: 0px;
border-bottom: 3px solid white;
margin-right: 1.5em;
border-radius: 0px;
// padding: 0px;
// border-bottom: 3px solid white;
// margin-right: 1.5em;
// border-radius: 0px;
color: @deepBlue;
font-size: 18px;

Expand All @@ -120,7 +110,7 @@ div#page-document .searchlib-block {
}

&.active {
border-bottom: 3px solid @secondaryColor;
// border-bottom: 3px solid @secondaryColor;
color: @secondaryColor;

// .icon {
Expand Down Expand Up @@ -359,69 +349,6 @@ div#page-document .searchlib-block {
}
}

.filter-list-item.more-like-this {
margin-bottom: 1em;

div.ui.label {
width: 100%;
}

i.icon.delete {
position: absolute;
top: 10px;
right: 10px;
color: @secondaryColor;
}

div.meta {
line-height: normal;

i.icon {
margin-right: 0.5em;
}
}

a.centered {
img {
width: 100%;
height: auto;
max-height: 200px;
margin-top: 0.5em;
margin-bottom: 0.5em;
object-fit: cover;
object-position: top;
}
}

h4 {
margin-top: 0.5em;
line-height: inherit;
}
}

.filter-list-item.more-like-this > .labels > .label {
overflow: hidden;
max-width: 100%;
padding: 0px;
margin: 0px;
}

.mlt-filter {
img {
width: 100%;
height: auto;
}

a {
font-size: 12px;
}

.meta {
font-size: 12px;
font-weight: 400;
}
}

.card .meta {
color: @s-medium-gray2 !important;
}
Expand Down Expand Up @@ -785,13 +712,13 @@ div.ui.modal.facet {
margin: 0;
}

@media screen and (min-width: 1000px) and (max-width: 1300px) {
div.content-section-tabs.menu {
a.item {
margin-right: 1.5em !important;
}
}
}
// @media screen and (min-width: 1000px) and (max-width: 1300px) {
// div.content-section-tabs.menu {
// a.item {
// margin-right: 1.5em !important;
// }
// }
// }

@media only screen and (max-width: 1080px) {
div.facets {
Expand All @@ -812,27 +739,27 @@ div.ui.modal.facet {
}
}

@media screen and (max-width: 1000px) {
div.content-section-tabs.menu {
a.item {
margin-right: 0.5em !important;

span.count {
font-size: 10px !important;
}
}
}
}

@media screen and (max-width: 600px) {
div.content-section-tabs.menu {
div.item.dropdown {
div.menu {
transform: translateX(-90px);
}
}
}
}
// @media screen and (max-width: 1000px) {
// div.content-section-tabs.menu {
// a.item {
// margin-right: 0.5em !important;
//
// span.count {
// font-size: 10px !important;
// }
// }
// }
// }
//
// @media screen and (max-width: 600px) {
// div.content-section-tabs.menu {
// div.item.dropdown {
// div.menu {
// transform: translateX(-90px);
// }
// }
// }
// }

@media only screen and (max-width: 766px) {
div.content .searchlib-multiterm-facet.facet-sources button.ui.toggle {
Expand Down
140 changes: 72 additions & 68 deletions src/SearchBlock/less/filterlist.less
View file
Original file line number Diff line number Diff line change
@@ -1,9 +1,6 @@
div#page-document .searchlib-block {
.top-facetslist-wrapper {
padding: 0em;
border: 0px;
margin: 0em;
box-shadow: none;
margin: 1.5em 0 !important;
}

.ui.inverted.segment.filter-list {
Expand Down Expand Up @@ -143,78 +140,85 @@ div#page-document .searchlib-block {
}
}

.filter-list-item.more-like-this {
margin-bottom: 1em;

div.ui.label {
width: 100%;
}

i.icon.delete {
position: absolute;
top: 10px;
right: 10px;
color: @secondaryColor;
}

div.meta {
line-height: normal;

i.icon {
margin-right: 0.5em;
}
}

a.centered {
img {
width: 100%;
height: auto;
max-height: 200px;
margin-top: 0.5em;
margin-bottom: 0.5em;
object-fit: cover;
object-position: top;
}
}

h4 {
margin-top: 0.5em;
line-height: inherit;
}
}

.filter-list-item.more-like-this > .labels > .label {
overflow: hidden;
max-width: 100%;
padding: 0px;
margin: 0px;
}

.mlt-filter {
img {
width: 100%;
height: auto;
}

a {
font-size: 12px;
}

.meta {
font-size: 12px;
font-weight: 400;
}
}
// .filter-list-item.more-like-this {
// margin-bottom: 1em;
//
// div.ui.label {
// width: 100%;
// }
//
// i.icon.delete {
// position: absolute;
// top: 10px;
// right: 10px;
// color: @secondaryColor;
// }
//
// div.meta {
// line-height: normal;
//
// i.icon {
// margin-right: 0.5em;
// }
// }
//
// a.centered {
// img {
// width: 100%;
// height: auto;
// max-height: 200px;
// margin-top: 0.5em;
// margin-bottom: 0.5em;
// object-fit: cover;
// object-position: top;
// }
// }
//
// h4 {
// margin-top: 0.5em;
// line-height: inherit;
// }
// }

// .filter-list-item.more-like-this > .labels > .label {
// overflow: hidden;
// max-width: 100%;
// padding: 0px;
// margin: 0px;
// }
//
// .mlt-filter {
// img {
// width: 100%;
// height: auto;
// }
//
// a {
// font-size: 12px;
// }
//
// .meta {
// font-size: 12px;
// font-weight: 400;
// }
// }

.card .meta {
color: @s-medium-gray2 !important;
}

.facetslist-wrapper {
.facet-btn {
margin: 0 0.6em 0.6em 0;
background: @midGray;
color: @lightBlack;
font-size: 16px;
}

.card {
width: 100% !important;
// width: 100% !important;
border: 1px solid @sf-light-gray2;
margin: 3px 0px 3px 0px;
// margin: 3px 0px 3px 0px;
border-radius: 3px;
box-shadow: none;

Expand Down
17 changes: 10 additions & 7 deletions src/SearchBlock/less/searchbox.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -236,25 +236,28 @@
}
}

//TODO: move list with more space to design system
.ui.list {
margin-top: 2em !important;

> .item {
padding-top: 0 !important;
padding-bottom: 1em !important;
color: @deepBlue !important;
font-size: 18px !important;
font-weight: 400 !important;
}

> .item:not(:last-child) {
padding-bottom: 3.5em !important;
}
}

.demo-question {
margin-top: 2.5em;

//TODO: move list with more space to design system
.ui.list {
margin-top: 2em !important;

> .item:not(:last-child) {
padding-bottom: 3.5em !important;
}
}

.ui.basic.button.explore-more-queries {
display: flex;
align-items: center;
Expand Down
Loading

0 comments on commit 321caeb

Please sign in to comment.