bientot pret

oldscss/helpers/button.scss

@@ -0,0 +1,45 @@
+.button {
+  line-height: 1.15 !important;
+  display: flex;
+  box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.2);
+  color: white;
+  .button-text {
+    padding: 10px;
+    border-radius: 2px;
+  }
+  .button-icon {
+    box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.2);
+    padding: 10px;
+    border-radius: 2px;
+  }
+  transition: opacity 0.2s;
+  text-decoration: none;
+  border-radius: 2px;
+}
+
+.button-primary {
+  background-color: #3498db;
+  .button-icon {
+    background-color: #2980b9;
+  }
+}
+
+.button:hover {
+  opacity: 0.8;
+  cursor: pointer;
+  transition: opacity 0.2s;
+}
+
+.button.disabled {
+  opacity: 0.5;
+  filter: grayscale(100);
+  transform: none !important;
+}
+
+@media (max-width: $responsive-small) {
+  .button.mobile-icon {
+    .button-text {
+      display: none;
+    }
+  }
+}

oldscss/helpers/card.scss

@@ -0,0 +1,88 @@
+$card-border-radius: 5px;
+.card {
+  margin-bottom: 1em;
+  .card-title {
+    border-top-left-radius: $card-border-radius;
+    border-top-right-radius: $card-border-radius;
+    padding: 10px 10px 10px 15px;
+    font-weight: bold;
+    font-size: 1.2em;
+    .fa {
+      margin-right: 0.2em;
+    }
+  }
+  .card-text {
+    box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.2);
+    padding: 10px 15px 20px 15px;
+  }
+  .card-actions {
+    border-bottom-left-radius: $card-border-radius;
+    border-bottom-right-radius: $card-border-radius;
+    display: flex;
+    justify-content: flex-end;
+    padding: 10px 15px 10px 15px;
+    font-weight: bold;
+
+    .card-action {
+      opacity: 0.8;
+      text-decoration: none;
+      color: inherit;
+    }
+    .card-action:hover {
+      cursor: pointer;
+      opacity: 1;
+    }
+  }
+}
+
+.card.no-actions {
+  .card-text {
+    border-bottom-left-radius: $card-border-radius;
+    border-bottom-right-radius: $card-border-radius;
+  }
+}
+
+.card.card-green {
+  color: #2f3640;
+  .card-title {
+    background-color: #27ae60;
+  }
+  .card-text {
+    background-color: #2ecc71;
+  }
+  .card-actions {
+    background-color: #27ae60;
+  }
+}
+
+.card.card-purple {
+  color: #f5f6fa;
+  a {
+    color: #f5f6fa;
+  }
+  .card-title {
+    background-color: #8e44ad;
+  }
+  .card-text {
+    background-color: #9b59b6;
+  }
+  .card-actions {
+    background-color: #8e44ad;
+  }
+}
+
+.card.card-blue {
+  color: #f5f6fa;
+  a {
+    color: #f5f6fa;
+  }
+  .card-title {
+    background-color: #2980b9;
+  }
+  .card-text {
+    background-color: #3498db;
+  }
+  .card-actions {
+    background-color: #2980b9;
+  }
+}

oldscss/helpers/container.scss

@@ -0,0 +1,11 @@
+@media (max-width: $responsive-medium) {
+  .container {
+    width: 94% !important;
+  }
+}
+
+@media (max-width: $responsive-interlarge) {
+  .container {
+    width: 90% !important;
+  }
+}

oldscss/helpers/divider.scss

@@ -0,0 +1,6 @@
+.divider {
+  //margin-top: 3vh;
+  border-bottom: 1px solid #a4b0be;
+  border-radius: 1px;
+  //margin-bottom: 5vh;
+}

oldscss/helpers/link.scss

@@ -0,0 +1,24 @@
+a:focus, a:active {
+  outline:0 !important;
+}
+
+.link {
+  color: inherit;
+  transition: opacity 0.2s;
+  text-decoration: none;
+}
+
+.link:hover {
+  text-decoration: none;
+  opacity: 0.8;
+  transition: opacity 0.2s;
+  cursor: pointer;
+}
+
+.link.link-primary {
+  color: $primary-color;
+}
+
+.link.no-opacity:hover {
+  opacity: 1 !important;
+}