Skip to content

Commit

Permalink
62 - Improve the system mobile view (#32)
Browse files Browse the repository at this point in the history
* Get the lighthouse logo and update the fjelltopp logo

* Fix margins, descriptions text align to justify and more ...

* View all button in /home is now #212121

* No padding between subscribe to updates and footer

* Categories margin are a bit off

* Categories margin are a bit off

* Updates for the search bar, order by dropdown, number of datasets found

* Dataset tabs and manage button look's messy

* Resource description better

* Hides resources list

* Resource buttons are off

* Requires more cleaning

* Removed second drop down arrow

* Removed a few classes in dms-main.css

* Fix facets not showing on mobile

* Fix container's mobile padding

* Cleaned up

* Cleaned up

* Fix officedocs and pdf view icons

* Mention lighthouse in footer funding comment

* Darker promoted backgrounds

* Fix review #1

* Fix review #2

* cleaning

* cleaning

* Fixing review #3

* Fix review #3

* Fix review #3

* Fix review #3

* Fix form control appearance

* Fix file uploader

* Update file input component

* Improve formatting of resource form

---------

Co-authored-by: toavina <[email protected]>
Co-authored-by: Jonathan S Berry <[email protected]>
  • Loading branch information
3 people authored Dec 10, 2024
1 parent e3acd36 commit 486cbb3
Show file tree
Hide file tree
Showing 18 changed files with 476 additions and 338 deletions.
4 changes: 4 additions & 0 deletions ckanext/dms/assets/FileInputComponent.css
Original file line number Diff line number Diff line change
Expand Up @@ -16,3 +16,7 @@
#FileInputComponent .field-url-input-group{
margin-bottom: 30px;
}

#FileInputComponent .btn.btn-danger {
padding: 6px 12px;
}
284 changes: 3 additions & 281 deletions ckanext/dms/assets/css/dms-main.css
Original file line number Diff line number Diff line change
Expand Up @@ -3435,12 +3435,6 @@ input[type="reset"].btn-block,
input[type="button"].btn-block {
width: 100%;
}
.fade {
opacity: 0;
-webkit-transition: opacity 0.15s linear;
-o-transition: opacity 0.15s linear;
transition: opacity 0.15s linear;
}
.fade.in {
opacity: 1;
}
Expand Down Expand Up @@ -6056,137 +6050,7 @@ button.close {
border-color: transparent;
border-style: solid;
}
.popover {
position: absolute;
top: 0;
left: 0;
z-index: 1060;
display: none;
max-width: 276px;
padding: 1px;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-style: normal;
font-weight: 400;
line-height: 1.42857143;
line-break: auto;
text-align: left;
text-align: start;
text-decoration: none;
text-shadow: none;
text-transform: none;
letter-spacing: normal;
word-break: normal;
word-spacing: normal;
word-wrap: normal;
white-space: normal;
font-size: 14px;
background-color: #ffffff;
background-clip: padding-box;
border: 1px solid #cccccc;
border: 1px solid rgba(0, 0, 0, 0.2);
border-radius: 6px;
-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}
.popover.top {
margin-top: -10px;
}
.popover.right {
margin-left: 10px;
}
.popover.bottom {
margin-top: 10px;
}
.popover.left {
margin-left: -10px;
}
.popover > .arrow {
border-width: 11px;
}
.popover > .arrow,
.popover > .arrow:after {
position: absolute;
display: block;
width: 0;
height: 0;
border-color: transparent;
border-style: solid;
}
.popover > .arrow:after {
content: "";
border-width: 10px;
}
.popover.top > .arrow {
bottom: -11px;
left: 50%;
margin-left: -11px;
border-top-color: #999999;
border-top-color: rgba(0, 0, 0, 0.25);
border-bottom-width: 0;
}
.popover.top > .arrow:after {
bottom: 1px;
margin-left: -10px;
content: " ";
border-top-color: #ffffff;
border-bottom-width: 0;
}
.popover.right > .arrow {
top: 50%;
left: -11px;
margin-top: -11px;
border-right-color: #999999;
border-right-color: rgba(0, 0, 0, 0.25);
border-left-width: 0;
}
.popover.right > .arrow:after {
bottom: -10px;
left: 1px;
content: " ";
border-right-color: #ffffff;
border-left-width: 0;
}
.popover.bottom > .arrow {
top: -11px;
left: 50%;
margin-left: -11px;
border-top-width: 0;
border-bottom-color: #999999;
border-bottom-color: rgba(0, 0, 0, 0.25);
}
.popover.bottom > .arrow:after {
top: 1px;
margin-left: -10px;
content: " ";
border-top-width: 0;
border-bottom-color: #ffffff;
}
.popover.left > .arrow {
top: 50%;
right: -11px;
margin-top: -11px;
border-right-width: 0;
border-left-color: #999999;
border-left-color: rgba(0, 0, 0, 0.25);
}
.popover.left > .arrow:after {
right: 1px;
bottom: -10px;
content: " ";
border-right-width: 0;
border-left-color: #ffffff;
}
.popover-title {
padding: 8px 14px;
margin: 0;
font-size: 14px;
background-color: #f7f7f7;
border-bottom: 1px solid #ebebeb;
border-radius: 5px 5px 0 0;
}
.popover-content {
padding: 9px 14px;
}

.carousel {
position: relative;
}
Expand Down Expand Up @@ -10298,35 +10162,8 @@ h4 small {
.activity .load-less {
margin-bottom: 15px;
}
.popover {
width: 300px;
}
.popover .popover-title {
font-weight: bold;
margin-bottom: 0;
}
.popover p.about {
margin: 0 0 10px 0;
}
.popover .popover-close {
float: right;
text-decoration: none;
}
.popover .popover-content {
font-size: 14px;
line-height: 1.42857143;
color: #444444;
word-break: break-all;
}
.popover .popover-content dl {
margin: 0;
}
.popover .popover-content dl dd {
margin-left: 0;
margin-bottom: 10px;
}
.activity .item .icon {
background-color: #999999;
background-color: #999999;transition: opacity 0.15s linear;
}
.activity .item.failure .icon {
background-color: #b95252;
Expand Down Expand Up @@ -10423,36 +10260,7 @@ br.line-height2 {
.js .dropdown.open .dropdown-menu {
display: block;
}
#followee-filter .btn:before,
#followee-filter .btn:after {
display: table;
content: " ";
}
#followee-filter .btn:after {
clear: both;
}
#followee-filter .btn:before,
#followee-filter .btn:after {
display: table;
content: " ";
}
#followee-filter .btn:after {
clear: both;
}
#followee-filter .btn span,
#followee-filter .btn strong {
line-height: 1.5;
}
#followee-filter .btn span {
font-weight: normal;
}
#followee-filter .btn strong {
margin: 0 5px;
white-space: nowrap;
max-width: 90px;
overflow: hidden;
text-overflow: ellipsis;
}

.dashboard-context {
position: relative;
margin-bottom: 20px;
Expand All @@ -10473,92 +10281,6 @@ br.line-height2 {
height: 21px;
background: transparent url("../../../base/images/dashboard-followee-related.png");
}
.popover-followee .popover-title {
display: none;
}
.popover-followee .popover-content {
padding: 0;
border-radius: 3px;
}
.popover-followee .empty {
padding: 10px;
}
.popover-followee .popover-header {
background-color: whiteSmoke;
padding: 5px;
border-bottom: 1px solid #cccccc;
border-radius: 3px 3px 0 0;
}
.popover-followee .popover-header:before,
.popover-followee .popover-header:after {
display: table;
content: " ";
}
.popover-followee .popover-header:after {
clear: both;
}
.popover-followee .popover-header:before,
.popover-followee .popover-header:after {
display: table;
content: " ";
}
.popover-followee .popover-header:after {
clear: both;
}
.popover-followee .popover-header .input-group {
margin-bottom: 0;
}
.popover-followee .popover-header .input-group-addon,
.popover-followee .popover-header input {
margin: 0;
}
.popover-followee .popover-header .input-group-addon {
padding: 4px 8px 4px 12px;
border-right-width: 0;
border-radius: 100px 0 0 100px;
}
.popover-followee .popover-header input {
padding: 4px 12px 4px 8px;
font-size: 13px;
width: 227px;
border-radius: 0 100px 100px 0;
}
.popover-followee .nav {
padding: 0;
margin: 0;
max-height: 205px;
overflow: auto;
border-radius: 0 0 3px 3px;
}
.popover-followee .nav li {
float: none;
}
.popover-followee .nav li a {
display: block;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
padding: 7px 10px 7px 15px;
margin: 0;
border-radius: 0;
}
.popover-followee .nav li a i {
background-color: #b30006;
color: #ffffff;
margin-right: 11px;
padding: 3px 5px;
line-height: 1;
border-radius: 100px;
-webkit-box-shadow: inset 0 1px 2x rgba(0, 0, 0, 0.2);
box-shadow: inset 0 1px 2x rgba(0, 0, 0, 0.2);
}
.popover-followee .nav li a:hover i {
background-color: #000;
}
.popover-followee .nav li.active a i {
color: #b30006;
background-color: #ffffff;
}
.dashboard-me {
padding: 15px 15px 0 15px;
}
Expand Down
Loading

0 comments on commit 486cbb3

Please sign in to comment.