Skip to content
This repository has been archived by the owner on Apr 25, 2024. It is now read-only.

Commit

Permalink
Updated style
Browse files Browse the repository at this point in the history
  • Loading branch information
@razvanMiu
razvanMiu committed Jan 21, 2022
1 parent e5d143e commit 26d2e5e
Showing 1 changed file with 161 additions and 156 deletions.
317 changes: 161 additions & 156 deletions theme/site/globals/site.overrides
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1543,236 +1543,241 @@ span.float-right {
}

// Europe forest specific blocks
.block-container,
.columns-view {
h5 {
color: @darkBrown;
font-weight: bold;
text-transform: uppercase;
}

div {
&.flex {
display: flex;
}

&.flex-column {
flex-direction: column;
}

&.h-100 {
height: 100%;
}
h5 {
color: @darkBrown;
font-weight: bold;
text-transform: uppercase;
}

&.w-100 {
width: 100%;
}
div {
&.flex {
display: flex;
}

&.pa-1 {
padding: 10px;
}
&.flex-column {
flex-direction: column;
}

.forest-block-wrapper {
display: flex;
&.h-100 {
height: 100%;
padding: 10px;
}

.forest-specific-block {
display: flex;
&.w-100 {
width: 100%;
flex-direction: column;
}

.land-data-wrapper,
.data-wrapper {
display: flex;
align-items: center;
padding: 1em;
margin-bottom: 1em;
border-radius: 5px;
&.pa-1 {
padding: 10px;
}
}

.land-data,
.data {
padding-right: 10px;
.forest-block-wrapper {
display: flex;
height: 100%;
padding: 10px;
}

span {
font-size: 50px;
font-weight: 700;
line-height: 46px;
}
}
.forest-specific-block {
display: flex;
width: 100%;
flex-direction: column;
}

.land-data-content,
.data-content {
font-size: 14px;
font-weight: 300;
.land-data-wrapper,
.data-wrapper {
display: flex;
align-items: center;
padding: 1em;
margin-bottom: 1em;
border-radius: 5px;

.formatted-value {
span {
display: block;
font-size: 18px;
font-weight: 500;
color: #000 !important;
font-size: 13px;
font-weight: normal;
}
}
}

.data-entity {
display: inline;
}
.land-data,
.data {
padding-right: 10px;

span {
font-size: 50px;
font-weight: 700;
line-height: 46px;
}
}

.data-wrapper {
&.brown {
background-color: @tileBackgroundColor;
.land-data-content,
.data-content {
font-size: 14px;
font-weight: 300;

span {
color: @darkBrown;
}
}
span {
display: block;
font-size: 18px;
font-weight: 500;
}

&.green {
background-color: @tileBackgroundColor;
color: @darkGreen;
.data-entity {
display: inline;
}
}

.data-content {
color: initial;
.data-wrapper {
&.brown {
background-color: @tileBackgroundColor;

span {
color: @darkGreen;
}
}
span {
color: @darkBrown;
}
}

&.blue {
background-color: @tileBackgroundColor;
color: @darkBlue;
&.green {
background-color: @tileBackgroundColor;
color: @darkGreen;

.data-content {
color: initial;
.data-content {
color: initial;

span {
color: @darkBlue;
}
span {
color: @darkGreen;
}
}
}

&.purple {
background-color: @tileBackgroundColor;
color: @purple;
&.blue {
background-color: @tileBackgroundColor;
color: @darkBlue;

.data-content {
color: initial;
.data-content {
color: initial;

span {
color: @purple;
}
span {
color: @darkBlue;
}
}
}

.ui.list .item span {
float: right;
}
&.purple {
background-color: @tileBackgroundColor;
color: @purple;

.ui.bulleted.list > .item {
padding: 7px 0;
font-size: 14px;
.data-content {
color: initial;

a {
color: @textColor;
text-decoration: underline;
span {
color: @purple;
}
}
}
}

ul.ui.list li:before,
.ui.bulleted.list .list > .item:before,
.ui.bulleted.list > .item:before {
top: 10px;
width: 8px;
height: 8px;
background-color: @darkBrown;
border-radius: 50%;
content: '';
}
.ui.list .item span {
float: right;
}

.forest-comparation {
.land-data-wrapper {
margin-bottom: 0;
background-color: @tileBackgroundColor;
.ui.bulleted.list > .item {
padding: 7px 0;
font-size: 14px;

span {
color: @darkBrown;
}
}
a {
color: @textColor;
text-decoration: underline;
}
}

@tileBackgroundColor: #f6f6f5;
@darkBlue: #002d54;
ul.ui.list li:before,
.ui.bulleted.list .list > .item:before,
.ui.bulleted.list > .item:before {
top: 10px;
width: 8px;
height: 8px;
background-color: @darkBrown;
border-radius: 50%;
content: '';
}

.forest-area-block {
.land-data-wrapper.eu28-data {
background-color: @tileBackgroundColor;
color: @darkGreen;
.forest-comparation {
.land-data-wrapper {
margin-bottom: 0;
background-color: @tileBackgroundColor;

.land-data-content {
color: initial;
span {
color: @darkBrown;
}
}
}

span {
color: @darkGreen;
}
}
@tileBackgroundColor: #f6f6f5;
@darkBlue: #002d54;

&.purple {
color: @purple;
.forest-area-block {
.land-data-wrapper.eu28-data {
background-color: @tileBackgroundColor;
color: @darkGreen;

.land-data-content {
color: initial;
.land-data-content {
color: initial;

span {
color: @purple;
}
}
span {
color: @darkGreen;
}
}

.land-data-wrapper.eea39-data {
background-color: @tileBackgroundColor;
color: @darkBlue;
&.purple {
color: @purple;

.land-data-content {
color: initial;

span {
color: @darkBlue;
color: @purple;
}
}
}
}

.coverage-data {
display: flex;
margin: 1em 0;
color: #fff;
font-size: 16px;
.land-data-wrapper.eea39-data {
background-color: @tileBackgroundColor;
color: @darkBlue;

.land-data-content {
color: initial;

span {
display: block;
margin-bottom: 0.2em;
font-size: 28px;
color: @darkBlue;
}
}
}

.map-wrapper {
padding: 5px;
border: 1px solid @darkGreen;
border-radius: 5px;
}
.coverage-data {
display: flex;
margin: 1em 0;
color: #fff;
font-size: 16px;

.map-buttons {
margin-top: 2em;
span {
display: block;
margin-bottom: 0.2em;
font-size: 28px;
}
}
}

.map-wrapper {
padding: 5px;
border: 1px solid @darkGreen;
border-radius: 5px;
}

.map-buttons {
margin-top: 2em;
}

.forest-patch-size-distribution {
.square {
display: inline-block;
Expand Down

0 comments on commit 26d2e5e

Please sign in to comment.