New/bestuur

app/components/header-nav.hbs

@@ -29,9 +29,12 @@
                 {{t "component.headerNav.aboutUs"}}
               </dd.button>
               <dd.menu class="public-about-us-dropdown" @renderInPlace={{true}} as |ddm|>
-                <!-- put links to other pages here -->
+                {{! put links to other pages here }}
+                <LinkTo @route='public.board' class="dropdown-item btn btn-primary">
+                  {{t 'mixin.menuItems.board'}}
+                </LinkTo>
                 <LinkTo @route='public.flux' class="dropdown-item btn btn-primary">
-                  Sociëteit Flux
+                  {{t 'mixin.menuItems.flux'}}
                 </LinkTo>
                 <LinkTo @route='public.room-forum' class="dropdown-item btn btn-primary">
                   {{t 'mixin.menuItems.roomForum'}}

app/components/public/index/about-alpha.hbs

@@ -2,7 +2,7 @@
   <h1 class="public-title">{{t 'component.public.index.aboutAlpha.intro-title'}}</h1>
   <hr class="public-title-border border border-secondary bg-secondary border-3 opacity-100" />
 
-  <p class="mt-3 text-center about-text">{{t 'component.public.index.aboutAlpha.intro'}}</p>
+  <p class="mt-3 text-center public-text">{{t 'component.public.index.aboutAlpha.intro'}}</p>
 
   <div class="mt-3 row">
     <div class="about-v col-12 col-md-4 mt-5">

app/router.js

@@ -269,6 +269,7 @@ Router.map(function () {
   this.route('public', function () {
     this.route('room-forum');
     this.route('flux');
+    this.route('board');
   });
 
   return true;

app/routes/public/board.js

@@ -0,0 +1,3 @@
+import Route from '@ember/routing/route';
+
+export default class PublicBoardRoute extends Route {}

app/styles/app.scss

@@ -73,6 +73,7 @@
 @import 'routes/polls';
 @import 'routes/public';
 @import 'routes/sog/name-trainer';
+@import 'routes/public/board';
 
 // Import package style
 @import 'ember-power-select/themes/bootstrap';

app/styles/components/public/card.scss

@@ -1,4 +1,22 @@
 .circle-card {
+  /* Responsive: horizontal becomes vertical on small screens */
+  @media (width <= 768px) {
+    &.horizontal {
+      flex-direction: column;
+      align-items: center;
+
+      .card-image {
+        margin-right: 0;
+        margin-bottom: 1.5rem;
+      }
+
+      .content {
+        align-items: center;
+        text-align: center;
+      }
+    }
+  }
+
   display: flex;
 
 
@@ -56,26 +74,7 @@
     .card-text {
       margin-top: 1rem;
       text-align: justify;
-      line-height: 1.6rem;
-      font-size: 1.3rem;
-    }
-  }
-
-  /* Responsive: horizontal becomes vertical on small screens */
-  @media (width <= 768px) {
-    &.horizontal {
-      flex-direction: column;
-      align-items: center;
-
-      .card-image {
-        margin-right: 0;
-        margin-bottom: 1.5rem;
-      }
-
-      .content {
-        align-items: center;
-        text-align: center;
-      }
+      font-size: 1.5rem;
     }
   }
 }

app/styles/components/public/header.scss

@@ -25,7 +25,7 @@
     border-bottom: 4px solid $brand-secondary;
     height: 100%;
     object-fit: cover;
-    object-position: bottom;
+    object-position: center;
   }
 
   .header-overlay {
@@ -60,4 +60,4 @@
       text-transform: uppercase;
     }
   }
-}
+}

app/styles/routes/public.scss

@@ -4,18 +4,19 @@
     text-align: center;
     font-family: "Libre Franklin", sans-serif;
     font-size: 3rem;
-  
+
     &.public-title-smaller {
       margin-bottom: 0.8rem;
       font-size: 2.5rem;
     }
   }
 
   .public-text {
+    width: 80vw;
     font-size: 1.5rem;
     hyphens: none;
   }
-  
+
   .public-title-border {
     width: 30vw;
   }
@@ -24,4 +25,23 @@
     text-align: center;
     font-size: 1.2rem;
   }
-}
+
+  .red-container{
+    position: relative;
+    left: 50%;
+    margin-left: -50vw;
+    background: linear-gradient(90deg, rgba(0 0 0 / 40%) 0%, $brand-secondary 100%), $brand-secondary;
+    padding: 1rem;
+    width: 100vw;
+    max-width: 100vw;
+
+
+    .public-title,.public-title-smaller{
+      color: $brand-cream;
+    }
+
+    .public-title-border{
+      border-color: $brand-primary-dark;
+    }
+  }
+}

app/styles/routes/public/board.scss

@@ -0,0 +1,9 @@
+.board{
+  .members{
+    .member{
+      margin: 2rem 0;
+      padding: 0 5%;
+    }
+  }
+}
+

app/templates/public/board.hbs

@@ -0,0 +1,77 @@
+<div class="public">
+  <Public::Header
+    @imageUrl="/images/public/board/banner.jpeg"
+    @title="{{t 'template.public.board.header'}}"
+  />
+  <div class="board row my-4 d-flex flex-column align-items-center">
+    <h1 class="public-title">{{t 'template.public.board.senaat'}}</h1>
+    <hr class="public-title-border border border-secondary bg-secondary border-3 opacity-100" />
+    <p class="mt-3 text-center public-text">{{t 'template.public.board.intro'}}</p>
+    <p class="text-center public-text"><i>{{t 'template.public.board.slogan'}}</i></p>
+    <div class="members row">
+      <div class="member col-12 col-md-6" >
+        <Public::Card
+          @imgurl="/images/public/board/Stefan.jpg"
+          @title="{{t 'template.public.board.chair'}}"
+          @subtitle="{{t 'template.public.board.chair-name'}}"
+          @text="{{t 'template.public.board.chair-story'}}"
+        />
+      </div>
+      <div class="member col-12 col-md-6">
+        <Public::Card
+          @imgurl="/images/public/board/Jesse.jpg"
+          @title="{{t 'template.public.board.secretary'}}"
+          @subtitle="{{t 'template.public.board.secretary-name'}}"
+          @text="{{t 'template.public.board.secretary-story'}}"
+        />
+      </div>
+      <div class="member col-12 col-md-6">
+        <Public::Card
+          @imgurl="/images/public/board/Niels.jpg"
+          @title="{{t 'template.public.board.treasurer'}}"
+          @subtitle="{{t 'template.public.board.treasurer-name'}}"
+          @text="{{t 'template.public.board.treasurer-story'}}"
+        />
+      </div>
+      <div class="member col-12 col-md-6">
+        <Public::Card
+          @imgurl="/images/public/board/Alina.jpg"
+          @title="{{t 'template.public.board.assessor1'}}"
+          @subtitle="{{t 'template.public.board.assessor1-name'}}"
+          @text="{{t 'template.public.board.assessor1-story'}}"
+        />
+      </div>
+    </div>
+    <a class="text-center" href="{{t 'template.public.board.photographer-url'}}">{{t 'template.public.board.photographer'}}</a>
+  </div>
+  <div class="red-container row d-flex flex-column align-items-center">
+    <h1 class="public-title">{{t 'template.public.board.previous-boards'}}</h1>
+    <hr class="public-title-border border border-primary bg-primary border-3 opacity-100" />
+    <div class="previous-boards row px-10">
+      <div class="previous-board col-12 col-sm-6 col-md-4 p-3">
+        <h3 class="public-title-smaller text-center">{{t 'template.public.board.old-boards.board1'}}</h3>
+        <img src="/images/public/board/XLIV.jpeg">
+      </div>
+      <div class="previous-board col-12 col-sm-6 col-md-4 p-3">
+        <h3 class="public-title-smaller text-center">{{t 'template.public.board.old-boards.board2'}}</h3>
+        <img src="/images/public/board/XLIII.jpeg">
+      </div>
+      <div class="previous-board col-12 col-sm-6 col-md-4 p-3">
+        <h3 class="public-title-smaller text-center">{{t 'template.public.board.old-boards.board3'}}</h3>
+        <img src="/images/public/board/XLII.jpeg">
+      </div>
+      <div class="previous-board col-12 col-sm-6 col-md-4 p-3">
+        <h3 class="public-title-smaller text-center">{{t 'template.public.board.old-boards.board4'}}</h3>
+        <img src="/images/public/board/XLI.jpeg">
+      </div>
+      <div class="previous-board col-12 col-sm-6 col-md-4 p-3">
+        <h3 class="public-title-smaller text-center">{{t 'template.public.board.old-boards.board5'}}</h3>
+        <img src="/images/public/board/XL.jpeg">
+      </div>
+      <div class="previous-board col-12 col-sm-6 col-md-4 p-3">
+        <h3 class="public-title-smaller text-center">{{t 'template.public.board.old-boards.board6'}}</h3>
+        <img src="/images/public/board/XXXIX.jpeg">
+      </div>
+    </div>
+  </div>
+</div>

tests/unit/routes/public/board-test.js

@@ -0,0 +1,11 @@
+import { module, test } from 'qunit';
+import { setupTest } from 'ember-qunit';
+
+module('Unit | Route | public/board', function (hooks) {
+  setupTest(hooks);
+
+  test('it exists', function (assert) {
+    let route = this.owner.lookup('route:public/board');
+    assert.ok(route);
+  });
+});

translations/en.yaml

@@ -85,6 +85,34 @@ template:
   photos:
     show:
       photographer: Photo uploaded by
+  public:
+    board:
+      header: General Board
+      intro: In the coming year, we, the XLVth senate, will be responsible for Alpha and all its activities. We are incredibly excited about the upcoming anniversary year. We are going to experience many wonderful things and will make sure we enjoy them as much as possible, as reflected in the Bible verse we will carry with us next year':'
+      slogan: Young people, enjoy your youth! Be happy with what's good! While you're young, let your mind guide your life, and do as you think best. But remember that God will judge you for all your thoughts and actions. Ecclesiastes 11:9 FBV
+      senaat: The 45th board of C.S.V.Alpha
+      chair: Chairman
+      chair-name: Stefan Zwiers
+      chair-story: Hi, I'm Stefan and this year I can call myself Praeses. I'm a third-year student in Enschede, studied IDE for six months, and after switching programs, I've now completed a year of Creative Business. Within Alpha, I'm ultimately responsible for everything that happens within the association. I also chair meetings, ensure that policies are properly implemented, give speeches, and guide committees and other board members in their tasks.
+      secretary: Abactis
+      secretary-name: Jesse Emmens
+      secretary-story: Hey everyone, I'm Jesse and I'll be taking on the role of Abactis this year. I'm currently a third-year student in Enschede, 20 years old, and normally study Advanced Technology. This year, I'll be responsible for emails, letters, and meeting minutes at Alpha. I'll also be handling Flux's finances and am responsible for several committees and external relations.
+      treasurer: Queastor
+      treasurer-name: Niels Brouwer
+      treasurer-story: Hi, my name is Niels, and this year I'll be taking on the wonderful role of Quaestor. I'm currently a third-year Creative Technology student in Enschede, and after two incredibly enjoyable years at Alpha, I'm taking a break from my studies to dedicate a year to this wonderful association and further my personal development. This year, I'll be managing Alpha's finances and inventory, including supervising the treasurers' committee in budgeting and maintaining their finances. In addition to these responsibilities, I'll be involved in the maintenance of our clubhouse and the Pakkerij Management Committee on the board of the society.
+      assessor1: Assesor Internorum
+      assessor1-name: Alina Monster
+      assessor1-story: Hi, I'm Alina and I'm the Internal Affairs Assessor for our wonderful association. I'm already a fifth-year student. I studied physiotherapy for two years, but I'm now studying Health Sciences. After my board year, I'll continue with my minor and graduate with my Bachelor's degree. Within Alpha, I'm involved with student groups, a few external associations, committees, and I make sure first-year students feel comfortable within the association. I'm also responsible for member care and member solidarity within Alpha.
+      photographer: Nice photographs? our photographer
+      photographer-url: https://shinebrightfotografie.nl/
+      previous-boards: Previous Boards
+      old-boards:
+        board1: Board XLIV
+        board2: Board XLIII
+        board3: Board XLII
+        board4: Board XLI
+        board5: Board XL
+        board6: Board XXXIX
 component:
   cards:
     articleCard:
@@ -109,23 +137,23 @@ component:
         becomeMember: Join
       aboutAlpha:
         intro-title: The Christian student association of Enschede
-        intro: 
-          C.S.V. Alpha was founded in 1980 and is the Christian social student association 
-          in Enschede, where socializing and Christian formation are combined into one unique 
-          student association. Alpha's core principle is "the message of the Bible as a 
-          guideline for life". This principle is expressed in the aspects of friendship, 
+        intro:
+          C.S.V. Alpha was founded in 1980 and is the Christian social student association
+          in Enschede, where socializing and Christian formation are combined into one unique
+          student association. Alpha's core principle is "the message of the Bible as a
+          guideline for life". This principle is expressed in the aspects of friendship,
           personal development and responsibility, the essence of the association.
         vriendschap-title: Friendship
         vriendschap-text:
-          Our own bar Flux is the ideal place to build and maintain friendships. 
+          Our own bar Flux is the ideal place to build and maintain friendships.
           Every Thursday we meet here, it is the place where drinks and good conversation go hand in hand.
         vorming-title: Personal development
-        vorming-text: At Alpha, we value personal development. This development expresses itself 
+        vorming-text: At Alpha, we value personal development. This development expresses itself
           in activities such as association evenings, sing-ins and, of course, the biweekly (bible) study.
         verantwoordelijkheid-title: Responsibility
         verantwoordelijkheid-text:
-          Alpha is an association for and by its members. That is why members are encouraged to be 
-          committed to the association, but also to their environment. This can be done, 
+          Alpha is an association for and by its members. That is why members are encouraged to be
+          committed to the association, but also to their environment. This can be done,
           for example, through committees, boards or volunteer actions.
       activities:
         title: Calendar
@@ -138,19 +166,6 @@ component:
         potential-sponsor: Also want to sponsor us? Click here
       youtube-videos:
         title: C.S.V. Alpha in short
-    board:
-      header: LANG-TODO
-      intro-title: LANG-TODO
-      intro: LANG-TODO
-      slogan: LANG-TODO
-      senaat: Board
-      old-boards: Oud Besturen
-      board-member-stories:
-        member-1: LANG-TODO
-        member-2: LANG-TODO
-        member-3: LANG-TODO
-        member-4: LANG-TODO
-        member-5: LANG-TODO
     contact:
       header: LANG-TODO
       intro: LANG-TODO
@@ -265,7 +280,7 @@ component:
     roomForum:
       header: Room forum
       intro-title: Check the available rooms in homes of our members here!
-      intro: 
+      intro:
         Members of Alpha mainly live in student housing, either in "Alpha houses" or other student houses.
         If a room becomes available in an Alpha house or in a student house of a member, you will find it here!
       location: Location
@@ -308,6 +323,7 @@ mixin:
     vacancies: Vacancies
     roomAdverts: Rooms
     roomForum: Room forum
+    flux: Flux Society
     forum: Forum
     photoAlbums: Photo-albums
     polls: Polls
@@ -316,6 +332,7 @@ mixin:
     staticPages: Information
     books: Books
     sog: SOG
+    board: General Board
 tag:
   button:
     close: Close