@eeacms/volto-bise-policy 1.0.0

package/theme/extras/pluggables.less

@@ -0,0 +1,191 @@
+.style-preview {
+  line-height: 1.5em;
+}
+
+.border-block {
+  padding: 0.7rem;
+  border: 1px solid rgba(0, 0, 0, 0.2);
+
+  p {
+    margin-bottom: 0 !important;
+  }
+}
+
+.horizontal-line {
+  padding-bottom: 1rem;
+  border-bottom: 2px solid #dadada;
+}
+
+.divided-block,
+.shaded-block {
+  padding: 1rem 0.8rem;
+  border-top: 1px solid rgba(0, 0, 0, 0.2);
+  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
+
+  p {
+    margin-bottom: 0 !important;
+  }
+}
+
+.shaded-block {
+  box-shadow: 0 7px 9px -12px rgba(0, 0, 0, 0.6),
+    0 -7px 9px -12px rgba(0, 0, 0, 0.6);
+}
+
+.rounded-block.style-preview {
+  position: relative;
+  padding: 1rem 0.8rem;
+
+  &:after {
+    position: absolute;
+    top: 0;
+    right: 0;
+    left: 0;
+    width: 65px;
+    height: 65px;
+    border: 1px solid #ddd;
+    border-radius: 100%;
+    content: '';
+  }
+}
+
+.marginless {
+  margin: 0;
+  margin-top: 0;
+  margin-right: 0;
+  margin-bottom: 0;
+  margin-left: 0;
+}
+
+div#view .ui.container > {
+  .marginless {
+    margin: 0;
+    margin-top: 0;
+    margin-right: 0;
+    margin-bottom: 0;
+    margin-left: 0;
+  }
+}
+
+.padded {
+  padding: 1em;
+}
+
+.rounded-block {
+  padding: 1rem;
+  text-align: center;
+
+  .image {
+    position: relative;
+    display: inline-block;
+    overflow: hidden;
+    width: 100%;
+    border-radius: 100%;
+    // box-shadow: 0 5px 10px -2px rgba(0, 0, 0, 0.6);
+
+    &:after {
+      display: block;
+      padding-bottom: 100%;
+      content: '';
+    }
+
+    img {
+      position: absolute;
+      top: 50%;
+      left: 50%;
+      max-width: none !important;
+      height: 100% !important;
+      transform: translate(-50%, -50%);
+    }
+  }
+}
+
+.mobile-reversed {
+  @media only screen and (max-width: @largestMobileScreen) {
+    > div.columns-view {
+      > div.column-grid {
+        flex-direction: column-reverse;
+      }
+    }
+  }
+}
+
+.relevant-link {
+  padding: 1.5rem 2rem;
+  border: 1px solid #e8e8e8;
+  background: #fff;
+  border-radius: 12px;
+  color: #04a87d;
+
+  a {
+    color: #04a87d;
+
+    &:hover {
+      color: #04a87d;
+      opacity: 0.9;
+    }
+  }
+}
+
+ul.n2k-list {
+  padding-left: 28px;
+  margin: 0;
+  margin-bottom: 1rem;
+
+  li {
+    position: relative;
+  }
+
+  li::marker {
+    content: '';
+  }
+
+  li:before {
+    position: absolute;
+    top: 50%;
+    left: -28px;
+    width: 18px;
+    height: 18px;
+    background: url(../assets/icons/plus.png);
+    background-repeat: no-repeat;
+    background-size: cover;
+    content: '';
+    opacity: 1;
+    transform: translateY(-50%);
+  }
+}
+
+.n2k-green-border {
+  padding: 1rem;
+  border: 1px solid #72a34a;
+  margin-bottom: 1rem;
+  border-radius: 10px;
+
+  > * {
+    margin-bottom: 0 !important;
+  }
+}
+
+.n2k-circle {
+  position: relative;
+  margin-bottom: 1rem;
+  background-color: #72a34a;
+  border-radius: 50%;
+  color: #fff;
+  text-align: center;
+
+  > *,
+  svg {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    padding: 2rem;
+    transform: translate(-50%, -50%);
+  }
+
+  &:before {
+    display: block;
+    padding-top: 100%; /* initial ratio of 1:1*/
+    content: '';
+  }
+}

package/theme/extras/stylemenu.less

@@ -0,0 +1,48 @@
+.primary-big-text {
+  font-size: 45px;
+  line-height: 45px;
+}
+
+.medium-text {
+  font-size: 30px;
+  line-height: 30px;
+}
+
+.small-text {
+  font-size: 20px;
+  line-height: 20px;
+}
+
+.white-text {
+  color: #fff;
+}
+
+.primary-text,
+.vivid-green-text {
+  color: @primaryColor;
+}
+
+.secondary-text,
+.light-green-text {
+  color: @secondaryColor;
+}
+
+.dark-green-text {
+  color: @bottleGreen;
+}
+
+.blue-text {
+  color: @blue-5;
+}
+
+.red-text {
+  color: @red;
+}
+
+.yellow-text {
+  color: @orange;
+}
+
+.grey-text {
+  color: @tertiaryColor;
+}

package/theme/extras/tocnav.less

@@ -0,0 +1,158 @@
+.toc-navigation {
+  border-top: 1px solid #efe9db;
+  margin-top: 2em !important;
+  padding-top: 1.5em !important;
+
+  .sidebar-wrapper {
+    padding-right: 0 !important;
+  }
+
+  .toc-sidebar {
+    position: sticky;
+    top: 0;
+    overflow-y: auto;
+    padding-right: 0;
+    padding-left: 0;
+  }
+
+  .toc-nav {
+    .toc-nav-header {
+      display: block;
+      padding: 0.8em 0.8em;
+      font-weight: bold;
+      border-left: 3px solid transparent;
+    }
+
+    .link-h2.selected,
+    .link-h2:hover {
+      background-color: #f7f4ed;
+      border-left: 3px solid @secondaryColor !important;
+    }
+
+    .link-h2.selected + .toc-description,
+    .link-h2:hover + .toc-description {
+      background-color: #f7f4ed;
+      border-left: 3px solid @secondaryColor !important;
+    }
+
+    .link-h2 + .toc-description {
+      padding-left: 1em;
+      padding-right: 0.5em;
+    }
+
+    .link-h3 {
+      padding: 0.8em 0.8em 0.8em 1.7em;
+    }
+
+    .link-h3.selected,
+    .link-h3:hover {
+      background-color: #f5f5f5;
+      border-left: 3px solid #f4ce62 !important;
+    }
+
+    .link-h3.selected + .toc-description,
+    .link-h3:hover + .toc-description {
+      background-color: #f5f5f5;
+      border-left: 3px solid #f4ce62 !important;
+    }
+
+    .link-h3 + .toc-description {
+      padding-left: 1.7em;
+    }
+
+    .toc-description {
+      display: block;
+      font-size: 13px;
+      color: #748284;
+      padding: 0 0.5em 0.8em 1em;
+      border-left: 3px solid transparent;
+    }
+  }
+
+  .toc-content {
+    border-left: 1px solid #efe9db;
+    padding-left: 1.5em !important;
+
+    > div:first-child h2 {
+      margin-top: 0.5em;
+    }
+
+    h2,
+    h3 {
+      margin: 1.5em 0 0.5em 0;
+    }
+
+    h4 {
+      margin-bottom: 1em;
+      color: #444;
+    }
+  }
+}
+
+// Table of contents - horizontal menu
+.table-of-contents.horizontalMenu {
+  .ui.menu {
+    border: none;
+    float: right;
+    box-shadow: none;
+    background-color: transparent;
+    margin-top: 1rem;
+
+    .item {
+      a {
+        font-size: 18px;
+        color: @textColor;
+      }
+
+      &:last-child {
+        &:before {
+          width: 0;
+        }
+      }
+    }
+  }
+
+  &:after {
+    content: '';
+    visibility: hidden;
+    display: block;
+    height: 0;
+    clear: both;
+  }
+}
+
+@media only screen and (min-width: 769px) {
+  .table-of-contents.horizontalMenu {
+    .ui.menu {
+      .item {
+        &:not(:last-child) {
+          &:before {
+            top: 6px;
+            height: 60%;
+            background: rgba(34, 36, 38, 0.8);
+          }
+        }
+      }
+    }
+  }
+}
+
+@media only screen and (max-width: 768px) {
+  .table-of-contents.horizontalMenu {
+    margin-top: 1em;
+
+    .ui.menu {
+      display: block;
+      float: none;
+
+      .item {
+        padding-left: 0;
+        display: block;
+
+        &:before {
+          width: 0;
+        }
+      }
+    }
+  }
+}

package/theme/globals/site.overrides

@@ -0,0 +1,78 @@
+/*******************************
+        Global Overrides
+*******************************/
+
+@import '../extras/keyfacts.less';
+@import '../extras/factsheets.less';
+@import '../extras/pluggables.less';
+@import '../extras/stylemenu.less';
+@import '../extras/tocnav.less';
+
+a {
+  color: @linkColor;
+
+  &:visited {
+    color:  @linkColor;
+  }
+
+  &:active {
+    color: @linkActiveColor;
+  }
+
+  &:hover {
+    color: @linkHoverColor;
+  }
+}
+
+p.has--clear--both:empty {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+
+.contenttype-bise_factsheet {
+  #main {
+    h1,
+    h2,
+    h3,
+    h4,
+    h5,
+    h6 {
+      margin-top: 1.5em;
+    }
+
+    h2,
+    h3,
+    h4,
+    h5,
+    h6 {
+      text-decoration: underline;
+      // border-bottom: 2px solid @darkSecondaryColor;
+    }
+
+    h2 {
+      // border-bottom: 2px solid @secondaryColor;
+    }
+
+    .column-blocks-wrapper {
+      display: flex;
+      align-items: center;
+
+      > div {
+        width: 100%;
+      }
+    }
+  }
+}
+
+.subsite.subsite-natura2000 {
+  &.contenttype-lrf {
+    .ui.basic.segment.content-area {
+      padding-top: 0;
+      margin-top: 0;
+    }
+  }
+
+  .subsite-logo {
+    background-color: red;
+  }
+}

package/theme/globals/site.variables

@@ -0,0 +1,22 @@
+/*******************************
+         Site Settings
+*******************************/
+
+@import '@eeacms/volto-bise-policy/../theme/tokens/tokens';
+
+/*-------------------
+    Brand Colors
+--------------------*/
+
+@primaryColor: @green-6;
+@secondaryColor: @green-4;
+
+@lightPrimaryColor: @green-5;
+@lightSecondaryColor: @green-4;
+
+@darkPrimaryColor: @green-6;
+@darkSecondaryColor: @green-6;
+
+@linkColor: @secondaryColor;
+@linkHoverColor: @primaryColor;
+@linkActiveColor: @linkHoverColor;

package/theme/theme.config

@@ -0,0 +1,135 @@
+/*
+
+████████╗██╗  ██╗███████╗███╗   ███╗███████╗███████╗
+╚══██╔══╝██║  ██║██╔════╝████╗ ████║██╔════╝██╔════╝
+   ██║   ███████║█████╗  ██╔████╔██║█████╗  ███████╗
+   ██║   ██╔══██║██╔══╝  ██║╚██╔╝██║██╔══╝  ╚════██║
+   ██║   ██║  ██║███████╗██║ ╚═╝ ██║███████╗███████║
+   ╚═╝   ╚═╝  ╚═╝╚══════╝╚═╝     ╚═╝╚══════╝╚══════╝
+
+*/
+
+/*******************************
+        Theme Selection
+*******************************/
+
+/* To override a theme for an individual element
+   specify theme name below
+*/
+
+/* Global */
+@site        : 'eea';
+@reset       : 'eea';
+
+/* Elements */
+@button      : 'eea';
+@container   : 'eea';
+@divider     : 'eea';
+@flag        : 'eea';
+@header      : 'eea';
+@icon        : 'eea';
+@image       : 'eea';
+@input       : 'eea';
+@label       : 'eea';
+@list        : 'eea';
+@loader      : 'eea';
+@placeholder : 'eea';
+@rail        : 'eea';
+@reveal      : 'eea';
+@segment     : 'eea';
+@step        : 'eea';
+
+/* Collections */
+@breadcrumb  : 'eea';
+@form        : 'eea';
+@grid        : 'eea';
+@menu        : 'eea';
+@message     : 'eea';
+@table       : 'eea';
+
+/* Modules */
+@accordion   : 'eea';
+@checkbox    : 'eea';
+@dimmer      : 'eea';
+@dropdown    : 'eea';
+@embed       : 'eea';
+@modal       : 'eea';
+@nag         : 'eea';
+@popup       : 'eea';
+@progress    : 'eea';
+@rating      : 'eea';
+@search      : 'eea';
+@shape       : 'eea';
+@sidebar     : 'eea';
+@sticky      : 'eea';
+@tab         : 'eea';
+@transition  : 'eea';
+
+/* Views */
+@ad          : 'eea';
+@card        : 'eea';
+@comment     : 'eea';
+@feed        : 'eea';
+@item        : 'eea';
+@statistic   : 'eea';
+
+/* Extras */
+@main        : 'eea';
+@custom      : 'eea';
+/* EEA Design system custom components */
+@blockquote             : 'eea';
+@pullquote              : 'eea';
+@banner                 : 'eea';
+@timeline               : 'eea';
+@footer                 : 'eea';
+@header                 : 'eea';
+@tag                    : 'eea';
+@tags                   : 'eea';
+@tagList                : 'eea';
+@contextNavigation      : 'eea';
+@inpageNavigation       : 'eea';
+@avatar                 : 'eea';
+@divider                : 'eea';
+@testimonial            : 'eea';
+@avatarGrid             : 'eea';
+@keyContent             : 'eea';
+@publicationCard        : 'eea';
+@contentBox             : 'eea';
+@reverseCardGrid        : 'eea';
+@relatedContent         : 'eea';
+@share                  : 'eea';
+@faqContent             : 'eea';
+@reportCard             : 'eea';
+@faqFilter              : 'eea';
+@contentAccordion       : 'eea';
+@downloadLabeledIcon    : 'eea';
+@newTabLabeledIcon      : 'eea';
+@labeledIconGroup       : 'eea';
+@languageLabeledIcon    : 'eea';
+@callout                : 'eea';
+@quote                  : 'eea';
+@hero                   : 'eea';
+
+/*******************************
+            Folders
+*******************************/
+
+/* Path to theme packages */
+@themesFolder: '~volto-themes';
+
+/* Path to site override folder */
+@siteFolder: '../../theme';
+
+/*******************************
+         Import Theme
+*******************************/
+@import (multiple) "~eea-volto-theme-folder/theme.less";
+
+@fontPath: "~volto-themes/default/assets/fonts";
+
+.loadAddonOverrides() {
+  @import (optional) "@{siteFolder}/@{addon}/@{addontype}s/@{addonelement}.overrides";
+}
+
+
+/* End Config */

package/theme/tokens/colors.less

@@ -0,0 +1,15 @@
+@green-0: #C8FFF8;
+@green-1: #85FFF1;
+@green-2: #00F5D8;
+@green-3: #00CCB4;
+@green-4: #00A390; // @secondaryColor
+@green-5: #007B6C;
+@green-6: #005248; // @primaryColor
+
+@yellow-0: #FEF6CD;
+@yellow-1: #FBEC9B;
+@yellow-2: #FAD936;
+@yellow-3: #FAC50D;
+@yellow-4: #FDAF20;
+@yellow-5: #FF9933;
+@yellow-6: #C35527;

package/theme/tokens/tokens.less

@@ -0,0 +1 @@
+@import 'colors.less';