Browse Source

Adding initial setup of time_tracking_app

Luiserebii 5 months ago
parent
commit
25d259c4fe
Signed by: Luiserebii <luis@serebii.io> GPG Key ID: 3B7E2D68E27CBBCF
100 changed files with 42223 additions and 0 deletions
  1. 3
    0
      .gitignore
  2. 3
    0
      fullstack-react-projects/time_tracking_app/.gitignore
  3. 32
    0
      fullstack-react-projects/time_tracking_app/.test.bats
  4. 19
    0
      fullstack-react-projects/time_tracking_app/README.md
  5. 22
    0
      fullstack-react-projects/time_tracking_app/data.json
  6. 45
    0
      fullstack-react-projects/time_tracking_app/nightwatch.conf.js
  7. 2760
    0
      fullstack-react-projects/time_tracking_app/package-lock.json
  8. 32
    0
      fullstack-react-projects/time_tracking_app/package.json
  9. BIN
      fullstack-react-projects/time_tracking_app/public/favicon.ico
  10. 32
    0
      fullstack-react-projects/time_tracking_app/public/index.html
  11. 1
    0
      fullstack-react-projects/time_tracking_app/public/js/app.js
  12. 93
    0
      fullstack-react-projects/time_tracking_app/public/js/client.js
  13. 56
    0
      fullstack-react-projects/time_tracking_app/public/js/helpers.js
  14. 252
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/accordion.css
  15. 610
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/accordion.js
  16. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/accordion.min.css
  17. 10
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/accordion.min.js
  18. 275
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/ad.css
  19. 10
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/ad.min.css
  20. 1167
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/api.js
  21. 10
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/api.min.js
  22. 124
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/breadcrumb.css
  23. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/breadcrumb.min.css
  24. 3450
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/button.css
  25. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/button.min.css
  26. 964
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/card.css
  27. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/card.min.css
  28. 625
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/checkbox.css
  29. 831
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/checkbox.js
  30. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/checkbox.min.css
  31. 10
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/checkbox.min.js
  32. 270
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/comment.css
  33. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/comment.min.css
  34. 147
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/container.css
  35. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/container.min.css
  36. 200
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/dimmer.css
  37. 708
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/dimmer.js
  38. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/dimmer.min.css
  39. 10
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/dimmer.min.js
  40. 260
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/divider.css
  41. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/divider.min.css
  42. 1417
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/dropdown.css
  43. 3741
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/dropdown.js
  44. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/dropdown.min.css
  45. 11
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/dropdown.min.js
  46. 166
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/embed.css
  47. 696
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/embed.js
  48. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/embed.min.css
  49. 10
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/embed.min.js
  50. 296
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/feed.css
  51. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/feed.min.css
  52. 1031
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/flag.css
  53. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/flag.min.css
  54. 1067
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/form.css
  55. 1558
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/form.js
  56. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/form.min.css
  57. 10
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/form.min.js
  58. 2002
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/grid.css
  59. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/grid.min.css
  60. 721
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/header.css
  61. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/header.min.css
  62. 3142
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/icon.css
  63. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/icon.min.css
  64. 306
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/image.css
  65. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/image.min.css
  66. 510
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/input.css
  67. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/input.min.css
  68. 475
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/item.css
  69. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/item.min.css
  70. 1307
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/label.css
  71. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/label.min.css
  72. 951
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/list.css
  73. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/list.min.css
  74. 347
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/loader.css
  75. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/loader.min.css
  76. 2002
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/menu.css
  77. 1
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/menu.min.css
  78. 477
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/message.css
  79. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/message.min.css
  80. 502
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/modal.css
  81. 913
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/modal.js
  82. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/modal.min.css
  83. 10
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/modal.min.js
  84. 147
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/nag.css
  85. 507
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/nag.js
  86. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/nag.min.css
  87. 10
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/nag.min.js
  88. 733
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/popup.css
  89. 1475
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/popup.js
  90. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/popup.min.css
  91. 10
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/popup.min.js
  92. 516
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/progress.css
  93. 931
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/progress.js
  94. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/progress.min.css
  95. 10
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/progress.min.js
  96. 152
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/rail.css
  97. 9
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/rail.min.css
  98. 263
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/rating.css
  99. 508
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/rating.js
  100. 0
    0
      fullstack-react-projects/time_tracking_app/public/semantic-dist/components/rating.min.css

+ 3
- 0
.gitignore View File

@@ -0,0 +1,3 @@
1
+*.swo
2
+*.swp
3
+node_modules/

+ 3
- 0
fullstack-react-projects/time_tracking_app/.gitignore View File

@@ -0,0 +1,3 @@
1
+reports/
2
+tests_output/
3
+npm-debug.log.*

+ 32
- 0
fullstack-react-projects/time_tracking_app/.test.bats View File

@@ -0,0 +1,32 @@
1
+#!/usr/bin/env bats
2
+DIR=$(dirname $BATS_TEST_FILENAME)
3
+TEST_NAME=$(basename $DIR)
4
+PORT=3000
5
+
6
+load "${BOOK_ROOT}/scripts/bats/fullstack.bats"
7
+load "${BOOK_ROOT}/scripts/bats-support/load.bash"
8
+load "${BOOK_ROOT}/scripts/bats-assert/load.bash"
9
+
10
+@test "${TEST_NAME} e2e passses" {
11
+  cd $DIR
12
+  run_npm_cmd run-e2e $TEST_TMP_DIR
13
+  run cat ${TEST_TMP_DIR}/log.txt
14
+  assert_output --partial 'OK.'
15
+}
16
+
17
+setup() {
18
+  echo "travis_fold:start:bats_${TEST_NAME}"
19
+  cd $DIR
20
+  TEST_TMP_DIR="$(mktemp -d -t fullstackXXX)"
21
+  kill_react_scripts || :
22
+  kill_by_port $PORT
23
+  true
24
+}
25
+
26
+teardown() {
27
+  cd $DIR
28
+  kill_react_scripts || :
29
+  kill_by_port $PORT
30
+  echo "travis_fold:end:bats_${TEST_NAME}"
31
+  true
32
+}

+ 19
- 0
fullstack-react-projects/time_tracking_app/README.md View File

@@ -0,0 +1,19 @@
1
+### Running the app
2
+
3
+1. Ensure you have `npm` installed.
4
+
5
+Follow the instructions for your platform [here](https://github.com/npm/npm).
6
+
7
+2. Install all dependencies:
8
+
9
+````
10
+npm install
11
+````
12
+
13
+3. Boot the HTTP server
14
+
15
+````
16
+npm run server
17
+````
18
+
19
+The server is now running at [localhost:3000](localhost:3000)

+ 22
- 0
fullstack-react-projects/time_tracking_app/data.json View File

@@ -0,0 +1,22 @@
1
+[
2
+    {
3
+        "title": "Mow the lawn",
4
+        "project": "House Chores",
5
+        "elapsed": 5456099,
6
+        "id": "0a4a79cb-b06d-4cb1-883d-549a1e3b66d7"
7
+    },
8
+    {
9
+        "title": "Ponder origins of universe",
10
+        "project": "Life Chores",
11
+        "id": "2c43306e-5b44-4ff8-8753-33c35adbd06f",
12
+        "elapsed": 11750,
13
+        "runningSince": 1456225941911
14
+    },
15
+    {
16
+        "title": "nm ",
17
+        "project": "mkln",
18
+        "id": "b8b0815d-a9c8-46c3-802f-68b3a678ebf2",
19
+        "elapsed": 0,
20
+        "runningSince": null
21
+    }
22
+]

+ 45
- 0
fullstack-react-projects/time_tracking_app/nightwatch.conf.js View File

@@ -0,0 +1,45 @@
1
+const jar = require("selenium-server-standalone-jar");
2
+
3
+module.exports = {
4
+  src_folders: ["tests/e2e"],
5
+  custom_commands_path: "",
6
+  custom_assertions_path: "",
7
+  page_objects_path: "",
8
+  globals_path: "",
9
+
10
+  selenium: {
11
+    start_process: true,
12
+    server_path: jar.path,
13
+    log_path: "",
14
+    port: 4444,
15
+    cli_args: {
16
+      "webdriver.chrome.driver": "",
17
+      "webdriver.gecko.driver": "node_modules/chromedriver/chromedriver",
18
+      "webdriver.edge.driver": ""
19
+    }
20
+  },
21
+
22
+  test_settings: {
23
+    default: {
24
+      launch_url: "http://localhost:3000",
25
+      selenium_port: 4444,
26
+      selenium_host: "localhost",
27
+      silent: true,
28
+      screenshots: {
29
+        enabled: false,
30
+        path: ""
31
+      },
32
+      desiredCapabilities: {
33
+        browserName: "chrome",
34
+        chromeOptions: {
35
+          args: ["--disable-dev-shm-usage", "--no-sandbox"]
36
+        },
37
+        javascriptEnabled: true,
38
+        acceptSslCerts: true
39
+      },
40
+      globals: {
41
+        waitForConditionTimeout: 10000
42
+      }
43
+    }
44
+  }
45
+};

+ 2760
- 0
fullstack-react-projects/time_tracking_app/package-lock.json
File diff suppressed because it is too large
View File


+ 32
- 0
fullstack-react-projects/time_tracking_app/package.json View File

@@ -0,0 +1,32 @@
1
+{
2
+  "name": "timers_app",
3
+  "version": "1.1.0",
4
+  "author": "Fullstack.io",
5
+  "scripts": {
6
+    "go": "open http://localhost:3000; npm run server",
7
+    "e2e": "nightwatch; npm run reset-data;",
8
+    "run-e2e": "concurrently -s first -k \"npm start\" \"sleep 15; npm run e2e\"",
9
+    "reset-data": "cp data.json.pristine data.json",
10
+    "test": "npm run reset-data; ./node_modules/.bin/concurrently -k 'npm run server' 'npm run e2e'",
11
+    "server": "babel-node server.js",
12
+    "start": "npm run server"
13
+  },
14
+  "babel": {
15
+    "presets": [
16
+      "es2015"
17
+    ]
18
+  },
19
+  "private": true,
20
+  "dependencies": {
21
+    "babel-cli": "6.22.2",
22
+    "babel-core": "6.22.1",
23
+    "babel-preset-es2015": "6.22.0",
24
+    "body-parser": "1.14.1",
25
+    "express": "4.13.3",
26
+    "fs": "0.0.2",
27
+    "path": "0.12.7"
28
+  },
29
+  "devDependencies": {
30
+    "concurrently": "2.2.0"
31
+  }
32
+}

BIN
fullstack-react-projects/time_tracking_app/public/favicon.ico View File


+ 32
- 0
fullstack-react-projects/time_tracking_app/public/index.html View File

@@ -0,0 +1,32 @@
1
+<!DOCTYPE html>
2
+<html>
3
+
4
+  <head>
5
+    <meta charset="utf-8">
6
+    <title>Project Two: Timers</title>
7
+    <!-- Import Semantic to style our stuff -->
8
+    <link rel="stylesheet" href="./semantic-dist/semantic.css" />
9
+    <link rel="stylesheet" href="style.css" />
10
+    <script src="vendor/babel-standalone.js"></script>
11
+    <script src="vendor/react.js"></script>
12
+    <script src="vendor/react-dom.js"></script>
13
+    <script src="vendor/uuid.js"></script>
14
+    <script src="vendor/fetch.js"></script>
15
+  </head>
16
+
17
+  <body>
18
+    <div id="main" class="main ui">
19
+      <h1 class="ui dividing centered header">Timers</h1>
20
+      <div id="content"></div>
21
+    </div>
22
+    <script type="text/babel" src="./js/client.js"></script>
23
+    <script type="text/babel" src="./js/helpers.js"></script>
24
+  <!-- React stuff... I think this is what activates the mounting of our app in the above-->  
25
+  <script
26
+      type="text/babel"
27
+      data-plugins="transform-class-properties"
28
+      src="./js/app.js"
29
+    ></script>
30
+  </body>
31
+
32
+</html>

+ 1
- 0
fullstack-react-projects/time_tracking_app/public/js/app.js View File

@@ -0,0 +1 @@
1
+

+ 93
- 0
fullstack-react-projects/time_tracking_app/public/js/client.js View File

@@ -0,0 +1,93 @@
1
+/* eslint-disable no-console */
2
+/* eslint-disable no-undef */
3
+window.client = (function () {
4
+  function getTimers(success) {
5
+    return fetch('/api/timers', {
6
+      headers: {
7
+        Accept: 'application/json',
8
+      },
9
+    }).then(checkStatus)
10
+      .then(parseJSON)
11
+      .then(success);
12
+  }
13
+
14
+  function createTimer(data) {
15
+    return fetch('/api/timers', {
16
+      method: 'post',
17
+      body: JSON.stringify(data),
18
+      headers: {
19
+        'Accept': 'application/json',
20
+        'Content-Type': 'application/json',
21
+      },
22
+    }).then(checkStatus);
23
+  }
24
+
25
+  function updateTimer(data) {
26
+    return fetch('/api/timers', {
27
+      method: 'put',
28
+      body: JSON.stringify(data),
29
+      headers: {
30
+        'Accept': 'application/json',
31
+        'Content-Type': 'application/json',
32
+      },
33
+    }).then(checkStatus);
34
+  }
35
+
36
+  function deleteTimer(data) {
37
+    return fetch('/api/timers', {
38
+      method: 'delete',
39
+      body: JSON.stringify(data),
40
+      headers: {
41
+        'Accept': 'application/json',
42
+        'Content-Type': 'application/json',
43
+      },
44
+    }).then(checkStatus);
45
+  }
46
+
47
+  function startTimer(data) {
48
+    return fetch('/api/timers/start', {
49
+      method: 'post',
50
+      body: JSON.stringify(data),
51
+      headers: {
52
+        'Accept': 'application/json',
53
+        'Content-Type': 'application/json',
54
+      },
55
+    }).then(checkStatus);
56
+  }
57
+
58
+  function stopTimer(data) {
59
+    return fetch('/api/timers/stop', {
60
+      method: 'post',
61
+      body: JSON.stringify(data),
62
+      headers: {
63
+        'Accept': 'application/json',
64
+        'Content-Type': 'application/json',
65
+      },
66
+    }).then(checkStatus);
67
+  }
68
+
69
+  function checkStatus(response) {
70
+    if (response.status >= 200 && response.status < 300) {
71
+      return response;
72
+    } else {
73
+      const error = new Error(`HTTP Error ${response.statusText}`);
74
+      error.status = response.statusText;
75
+      error.response = response;
76
+      console.log(error);
77
+      throw error;
78
+    }
79
+  }
80
+
81
+  function parseJSON(response) {
82
+    return response.json();
83
+  }
84
+
85
+  return {
86
+    getTimers,
87
+    createTimer,
88
+    updateTimer,
89
+    startTimer,
90
+    stopTimer,
91
+    deleteTimer,
92
+  };
93
+}());

+ 56
- 0
fullstack-react-projects/time_tracking_app/public/js/helpers.js View File

@@ -0,0 +1,56 @@
1
+window.helpers = (function () {
2
+  function newTimer(attrs = {}) {
3
+    const timer = {
4
+      title: attrs.title || 'Timer',
5
+      project: attrs.project || 'Project',
6
+      id: uuid.v4(), // eslint-disable-line no-undef
7
+      elapsed: 0,
8
+    };
9
+
10
+    return timer;
11
+  }
12
+
13
+  function findById(array, id, cb) {
14
+    array.forEach((el) => {
15
+      if (el.id === id) {
16
+        cb(el);
17
+        return;
18
+      }
19
+    });
20
+  }
21
+
22
+  function renderElapsedString(elapsed, runningSince) {
23
+    let totalElapsed = elapsed;
24
+    if (runningSince) {
25
+      totalElapsed += Date.now() - runningSince;
26
+    }
27
+    return millisecondsToHuman(totalElapsed);
28
+  }
29
+
30
+  function millisecondsToHuman(ms) {
31
+    const seconds = Math.floor((ms / 1000) % 60);
32
+    const minutes = Math.floor((ms / 1000 / 60) % 60);
33
+    const hours = Math.floor(ms / 1000 / 60 / 60);
34
+
35
+    const humanized = [
36
+      pad(hours.toString(), 2),
37
+      pad(minutes.toString(), 2),
38
+      pad(seconds.toString(), 2),
39
+    ].join(':');
40
+
41
+    return humanized;
42
+  }
43
+
44
+  function pad(numberString, size) {
45
+    let padded = numberString;
46
+    while (padded.length < size) padded = `0${padded}`;
47
+    return padded;
48
+  }
49
+
50
+  return {
51
+    millisecondsToHuman,
52
+    newTimer,
53
+    findById,
54
+    renderElapsedString,
55
+  };
56
+}());

+ 252
- 0
fullstack-react-projects/time_tracking_app/public/semantic-dist/components/accordion.css View File

@@ -0,0 +1,252 @@
1
+/*!
2
+ * # Semantic UI 2.2.7 - Accordion
3
+ * http://github.com/semantic-org/semantic-ui/
4
+ *
5
+ *
6
+ * Released under the MIT license
7
+ * http://opensource.org/licenses/MIT
8
+ *
9
+ */
10
+
11
+
12
+/*******************************
13
+            Accordion
14
+*******************************/
15
+
16
+.ui.accordion,
17
+.ui.accordion .accordion {
18
+  max-width: 100%;
19
+}
20
+.ui.accordion .accordion {
21
+  margin: 1em 0em 0em;
22
+  padding: 0em;
23
+}
24
+
25
+/* Title */
26
+.ui.accordion .title,
27
+.ui.accordion .accordion .title {
28
+  cursor: pointer;
29
+}
30
+
31
+/* Default Styling */
32
+.ui.accordion .title:not(.ui) {
33
+  padding: 0.5em 0em;
34
+  font-family: 'Lato', 'Helvetica Neue', Arial, Helvetica, sans-serif;
35
+  font-size: 1em;
36
+  color: rgba(0, 0, 0, 0.87);
37
+}
38
+
39
+/* Content */
40
+.ui.accordion .title ~ .content,
41
+.ui.accordion .accordion .title ~ .content {
42
+  display: none;
43
+}
44
+
45
+/* Default Styling */
46
+.ui.accordion:not(.styled) .title ~ .content:not(.ui),
47
+.ui.accordion:not(.styled) .accordion .title ~ .content:not(.ui) {
48
+  margin: '';
49
+  padding: 0.5em 0em 1em;
50
+}
51
+.ui.accordion:not(.styled) .title ~ .content:not(.ui):last-child {
52
+  padding-bottom: 0em;
53
+}
54
+
55
+/* Arrow */
56
+.ui.accordion .title .dropdown.icon,
57
+.ui.accordion .accordion .title .dropdown.icon {
58
+  display: inline-block;
59
+  float: none;
60
+  opacity: 1;
61
+  width: 1.25em;
62
+  height: 1em;
63
+  margin: 0em 0.25rem 0em 0rem;
64
+  padding: 0em;
65
+  font-size: 1em;
66
+  -webkit-transition: opacity 0.1s ease, -webkit-transform 0.1s ease;
67
+  transition: opacity 0.1s ease, -webkit-transform 0.1s ease;
68
+  transition: transform 0.1s ease, opacity 0.1s ease;
69
+  transition: transform 0.1s ease, opacity 0.1s ease, -webkit-transform 0.1s ease;
70
+  vertical-align: baseline;
71
+  -webkit-transform: none;
72
+          transform: none;
73
+}
74
+
75
+/*--------------
76
+    Coupling
77
+---------------*/
78
+
79
+
80
+/* Menu */
81
+.ui.accordion.menu .item .title {
82
+  display: block;
83
+  padding: 0em;
84
+}
85
+.ui.accordion.menu .item .title > .dropdown.icon {
86
+  float: right;
87
+  margin: 0.21425em 0em 0em 1em;
88
+  -webkit-transform: rotate(180deg);
89
+          transform: rotate(180deg);
90
+}
91
+
92
+/* Header */
93
+.ui.accordion .ui.header .dropdown.icon {
94
+  font-size: 1em;
95
+  margin: 0em 0.25rem 0em 0rem;
96
+}
97
+
98
+
99
+/*******************************
100
+            States
101
+*******************************/
102
+
103
+.ui.accordion .active.title .dropdown.icon,
104
+.ui.accordion .accordion .active.title .dropdown.icon {
105
+  -webkit-transform: rotate(90deg);
106
+          transform: rotate(90deg);
107
+}
108
+.ui.accordion.menu .item .active.title > .dropdown.icon {
109
+  -webkit-transform: rotate(90deg);
110
+          transform: rotate(90deg);
111
+}
112
+
113
+
114
+/*******************************
115
+            Types
116
+*******************************/
117
+
118
+
119
+/*--------------
120
+     Styled
121
+---------------*/
122
+
123
+.ui.styled.accordion {
124
+  width: 600px;
125
+}
126
+.ui.styled.accordion,
127
+.ui.styled.accordion .accordion {
128
+  border-radius: 0.28571429rem;
129
+  background: #FFFFFF;
130
+  box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15), 0px 0px 0px 1px rgba(34, 36, 38, 0.15);
131
+}
132
+.ui.styled.accordion .title,
133
+.ui.styled.accordion .accordion .title {
134
+  margin: 0em;
135
+  padding: 0.75em 1em;
136
+  color: rgba(0, 0, 0, 0.4);
137
+  font-weight: bold;
138
+  border-top: 1px solid rgba(34, 36, 38, 0.15);
139
+  -webkit-transition: background 0.1s ease, color 0.1s ease;
140
+  transition: background 0.1s ease, color 0.1s ease;
141
+}
142
+.ui.styled.accordion > .title:first-child,
143
+.ui.styled.accordion .accordion .title:first-child {
144
+  border-top: none;
145
+}
146
+
147
+/* Content */
148
+.ui.styled.accordion .content,
149
+.ui.styled.accordion .accordion .content {
150
+  margin: 0em;
151
+  padding: 0.5em 1em 1.5em;
152
+}
153
+.ui.styled.accordion .accordion .content {
154
+  padding: 0em;
155
+  padding: 0.5em 1em 1.5em;
156
+}
157
+
158
+/* Hover */
159
+.ui.styled.accordion .title:hover,
160
+.ui.styled.accordion .active.title,
161
+.ui.styled.accordion .accordion .title:hover,
162
+.ui.styled.accordion .accordion .active.title {
163
+  background: transparent;
164
+  color: rgba(0, 0, 0, 0.87);
165
+}
166
+.ui.styled.accordion .accordion .title:hover,
167
+.ui.styled.accordion .accordion .active.title {
168
+  background: transparent;
169
+  color: rgba(0, 0, 0, 0.87);
170
+}
171
+
172
+/* Active */
173
+.ui.styled.accordion .active.title {
174
+  background: transparent;
175
+  color: rgba(0, 0, 0, 0.95);
176
+}
177
+.ui.styled.accordion .accordion .active.title {
178
+  background: transparent;
179
+  color: rgba(0, 0, 0, 0.95);
180
+}
181
+
182
+
183
+/*******************************
184
+            States
185
+*******************************/
186
+
187
+
188
+/*--------------
189
+     Active
190
+---------------*/
191
+
192
+.ui.accordion .active.content,
193
+.ui.accordion .accordion .active.content {
194
+  display: block;
195
+}
196
+
197
+
198
+/*******************************
199
+           Variations
200
+*******************************/
201
+
202
+
203
+/*--------------
204
+     Fluid
205
+---------------*/
206
+
207
+.ui.fluid.accordion,
208
+.ui.fluid.accordion .accordion {
209
+  width: 100%;
210
+}
211
+
212
+/*--------------
213
+     Inverted
214
+---------------*/
215
+
216
+.ui.inverted.accordion .title:not(.ui) {
217
+  color: rgba(255, 255, 255, 0.9);
218
+}
219
+
220
+
221
+/*******************************
222
+         Theme Overrides
223
+*******************************/
224
+
225
+@font-face {
226
+  font-family: 'Accordion';
227
+  src: url(data:application/x-font-ttf;charset=utf-8;base64,AAEAAAALAIAAAwAwT1MvMggjB5AAAAC8AAAAYGNtYXAPfOIKAAABHAAAAExnYXNwAAAAEAAAAWgAAAAIZ2x5Zryj6HgAAAFwAAAAyGhlYWT/0IhHAAACOAAAADZoaGVhApkB5wAAAnAAAAAkaG10eAJuABIAAAKUAAAAGGxvY2EAjABWAAACrAAAAA5tYXhwAAgAFgAAArwAAAAgbmFtZfC1n04AAALcAAABPHBvc3QAAwAAAAAEGAAAACAAAwIAAZAABQAAAUwBZgAAAEcBTAFmAAAA9QAZAIQAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADw2gHg/+D/4AHgACAAAAABAAAAAAAAAAAAAAAgAAAAAAACAAAAAwAAABQAAwABAAAAFAAEADgAAAAKAAgAAgACAAEAIPDa//3//wAAAAAAIPDZ//3//wAB/+MPKwADAAEAAAAAAAAAAAAAAAEAAf//AA8AAQAAAAAAAAAAAAIAADc5AQAAAAABAAAAAAAAAAAAAgAANzkBAAAAAAEAAAAAAAAAAAACAAA3OQEAAAAAAQASAEkAtwFuABMAADc0PwE2FzYXFh0BFAcGJwYvASY1EgaABQgHBQYGBQcIBYAG2wcGfwcBAQcECf8IBAcBAQd/BgYAAAAAAQAAAEkApQFuABMAADcRNDc2MzIfARYVFA8BBiMiJyY1AAUGBwgFgAYGgAUIBwYFWwEACAUGBoAFCAcFgAYGBQcAAAABAAAAAQAAqWYls18PPPUACwIAAAAAAM/9o+4AAAAAz/2j7gAAAAAAtwFuAAAACAACAAAAAAAAAAEAAAHg/+AAAAIAAAAAAAC3AAEAAAAAAAAAAAAAAAAAAAAGAAAAAAAAAAAAAAAAAQAAAAC3ABIAtwAAAAAAAAAKABQAHgBCAGQAAAABAAAABgAUAAEAAAAAAAIAAAAAAAAAAAAAAAAAAAAAAAAADgCuAAEAAAAAAAEADAAAAAEAAAAAAAIADgBAAAEAAAAAAAMADAAiAAEAAAAAAAQADABOAAEAAAAAAAUAFgAMAAEAAAAAAAYABgAuAAEAAAAAAAoANABaAAMAAQQJAAEADAAAAAMAAQQJAAIADgBAAAMAAQQJAAMADAAiAAMAAQQJAAQADABOAAMAAQQJAAUAFgAMAAMAAQQJAAYADAA0AAMAAQQJAAoANABaAHIAYQB0AGkAbgBnAFYAZQByAHMAaQBvAG4AIAAxAC4AMAByAGEAdABpAG4AZ3JhdGluZwByAGEAdABpAG4AZwBSAGUAZwB1AGwAYQByAHIAYQB0AGkAbgBnAEYAbwBuAHQAIABnAGUAbgBlAHIAYQB0AGUAZAAgAGIAeQAgAEkAYwBvAE0AbwBvAG4ALgADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA) format('truetype'), url(data:application/font-woff;charset=utf-8;base64,d09GRk9UVE8AAASwAAoAAAAABGgAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABDRkYgAAAA9AAAAS0AAAEtFpovuE9TLzIAAAIkAAAAYAAAAGAIIweQY21hcAAAAoQAAABMAAAATA984gpnYXNwAAAC0AAAAAgAAAAIAAAAEGhlYWQAAALYAAAANgAAADb/0IhHaGhlYQAAAxAAAAAkAAAAJAKZAedobXR4AAADNAAAABgAAAAYAm4AEm1heHAAAANMAAAABgAAAAYABlAAbmFtZQAAA1QAAAE8AAABPPC1n05wb3N0AAAEkAAAACAAAAAgAAMAAAEABAQAAQEBB3JhdGluZwABAgABADr4HAL4GwP4GAQeCgAZU/+Lix4KABlT/4uLDAeLa/iU+HQFHQAAAHkPHQAAAH4RHQAAAAkdAAABJBIABwEBBw0PERQZHnJhdGluZ3JhdGluZ3UwdTF1MjB1RjBEOXVGMERBAAACAYkABAAGAQEEBwoNVp38lA78lA78lA77lA773Z33bxWLkI2Qj44I9xT3FAWOj5CNkIuQi4+JjoePiI2Gi4YIi/uUBYuGiYeHiIiHh4mGi4aLho2Ijwj7FPcUBYeOiY+LkAgO+92L5hWL95QFi5CNkI6Oj4+PjZCLkIuQiY6HCPcU+xQFj4iNhouGi4aJh4eICPsU+xQFiIeGiYaLhouHjYePiI6Jj4uQCA74lBT4lBWLDAoAAAAAAwIAAZAABQAAAUwBZgAAAEcBTAFmAAAA9QAZAIQAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADw2gHg/+D/4AHgACAAAAABAAAAAAAAAAAAAAAgAAAAAAACAAAAAwAAABQAAwABAAAAFAAEADgAAAAKAAgAAgACAAEAIPDa//3//wAAAAAAIPDZ//3//wAB/+MPKwADAAEAAAAAAAAAAAAAAAEAAf//AA8AAQAAAAEAADfYOJZfDzz1AAsCAAAAAADP/aPuAAAAAM/9o+4AAAAAALcBbgAAAAgAAgAAAAAAAAABAAAB4P/gAAACAAAAAAAAtwABAAAAAAAAAAAAAAAAAAAABgAAAAAAAAAAAAAAAAEAAAAAtwASALcAAAAAUAAABgAAAAAADgCuAAEAAAAAAAEADAAAAAEAAAAAAAIADgBAAAEAAAAAAAMADAAiAAEAAAAAAAQADABOAAEAAAAAAAUAFgAMAAEAAAAAAAYABgAuAAEAAAAAAAoANABaAAMAAQQJAAEADAAAAAMAAQQJAAIADgBAAAMAAQQJAAMADAAiAAMAAQQJAAQADABOAAMAAQQJAAUAFgAMAAMAAQQJAAYADAA0AAMAAQQJAAoANABaAHIAYQB0AGkAbgBnAFYAZQByAHMAaQBvAG4AIAAxAC4AMAByAGEAdABpAG4AZ3JhdGluZwByAGEAdABpAG4AZwBSAGUAZwB1AGwAYQByAHIAYQB0AGkAbgBnAEYAbwBuAHQAIABnAGUAbgBlAHIAYQB0AGUAZAAgAGIAeQAgAEkAYwBvAE0AbwBvAG4ALgADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA) format('woff');
228
+  font-weight: normal;
229
+  font-style: normal;
230
+}
231
+
232
+/* Dropdown Icon */
233
+.ui.accordion .title .dropdown.icon,
234
+.ui.accordion .accordion .title .dropdown.icon {
235
+  font-family: Accordion;
236
+  line-height: 1;
237
+  -webkit-backface-visibility: hidden;
238
+          backface-visibility: hidden;
239
+  font-weight: normal;
240
+  font-style: normal;
241
+  text-align: center;
242
+}
243
+.ui.accordion .title .dropdown.icon:before,
244
+.ui.accordion .accordion .title .dropdown.icon:before {
245
+  content: '\f0da' /*rtl:'\f0d9'*/;
246
+}
247
+
248
+
249
+/*******************************
250
+        User Overrides
251
+*******************************/
252
+

+ 610
- 0
fullstack-react-projects/time_tracking_app/public/semantic-dist/components/accordion.js View File

@@ -0,0 +1,610 @@
1
+/*!
2
+ * # Semantic UI 2.2.7 - Accordion
3
+ * http://github.com/semantic-org/semantic-ui/
4
+ *
5
+ *
6
+ * Released under the MIT license
7
+ * http://opensource.org/licenses/MIT
8
+ *
9
+ */
10
+
11
+;(function ($, window, document, undefined) {
12
+
13
+"use strict";
14
+
15
+window = (typeof window != 'undefined' && window.Math == Math)
16
+  ? window
17
+  : (typeof self != 'undefined' && self.Math == Math)
18
+    ? self
19
+    : Function('return this')()
20
+;
21
+
22
+$.fn.accordion = function(parameters) {
23
+  var
24
+    $allModules     = $(this),
25
+
26
+    time            = new Date().getTime(),
27
+    performance     = [],
28
+
29
+    query           = arguments[0],
30
+    methodInvoked   = (typeof query == 'string'),
31
+    queryArguments  = [].slice.call(arguments, 1),
32
+
33
+    requestAnimationFrame = window.requestAnimationFrame
34
+      || window.mozRequestAnimationFrame
35
+      || window.webkitRequestAnimationFrame
36
+      || window.msRequestAnimationFrame
37
+      || function(callback) { setTimeout(callback, 0); },
38
+
39
+    returnedValue
40
+  ;
41
+  $allModules
42
+    .each(function() {
43
+      var
44
+        settings        = ( $.isPlainObject(parameters) )
45
+          ? $.extend(true, {}, $.fn.accordion.settings, parameters)
46
+          : $.extend({}, $.fn.accordion.settings),
47
+
48
+        className       = settings.className,
49
+        namespace       = settings.namespace,
50
+        selector        = settings.selector,
51
+        error           = settings.error,
52
+
53
+        eventNamespace  = '.' + namespace,
54
+        moduleNamespace = 'module-' + namespace,
55
+        moduleSelector  = $allModules.selector || '',
56
+
57
+        $module  = $(this),
58
+        $title   = $module.find(selector.title),
59
+        $content = $module.find(selector.content),
60
+
61
+        element  = this,
62
+        instance = $module.data(moduleNamespace),
63
+        observer,
64
+        module
65
+      ;
66
+
67
+      module = {
68
+
69
+        initialize: function() {
70
+          module.debug('Initializing', $module);
71
+          module.bind.events();
72
+          if(settings.observeChanges) {
73
+            module.observeChanges();
74
+          }
75
+          module.instantiate();
76
+        },
77
+
78
+        instantiate: function() {
79
+          instance = module;
80
+          $module
81
+            .data(moduleNamespace, module)
82
+          ;
83
+        },
84
+
85
+        destroy: function() {
86
+          module.debug('Destroying previous instance', $module);
87
+          $module
88
+            .off(eventNamespace)
89
+            .removeData(moduleNamespace)
90
+          ;
91
+        },
92
+
93
+        refresh: function() {
94
+          $title   = $module.find(selector.title);
95
+          $content = $module.find(selector.content);
96
+        },
97
+
98
+        observeChanges: function() {
99
+          if('MutationObserver' in window) {
100
+            observer = new MutationObserver(function(mutations) {
101
+              module.debug('DOM tree modified, updating selector cache');
102
+              module.refresh();
103
+            });
104
+            observer.observe(element, {
105
+              childList : true,
106
+              subtree   : true
107
+            });
108
+            module.debug('Setting up mutation observer', observer);
109
+          }
110
+        },
111
+
112
+        bind: {
113
+          events: function() {
114
+            module.debug('Binding delegated events');
115
+            $module
116
+              .on(settings.on + eventNamespace, selector.trigger, module.event.click)
117
+            ;
118
+          }
119
+        },
120
+
121
+        event: {
122
+          click: function() {
123
+            module.toggle.call(this);
124
+          }
125
+        },
126
+
127
+        toggle: function(query) {
128
+          var
129
+            $activeTitle = (query !== undefined)
130
+              ? (typeof query === 'number')
131
+                ? $title.eq(query)
132
+                : $(query).closest(selector.title)
133
+              : $(this).closest(selector.title),
134
+            $activeContent = $activeTitle.next($content),
135
+            isAnimating = $activeContent.hasClass(className.animating),
136
+            isActive    = $activeContent.hasClass(className.active),
137
+            isOpen      = (isActive && !isAnimating),
138
+            isOpening   = (!isActive && isAnimating)
139
+          ;
140
+          module.debug('Toggling visibility of content', $activeTitle);
141
+          if(isOpen || isOpening) {
142
+            if(settings.collapsible) {
143
+              module.close.call($activeTitle);
144
+            }
145
+            else {
146
+              module.debug('Cannot close accordion content collapsing is disabled');
147
+            }
148
+          }
149
+          else {
150
+            module.open.call($activeTitle);
151
+          }
152
+        },
153
+
154
+        open: function(query) {
155
+          var
156
+            $activeTitle = (query !== undefined)
157
+              ? (typeof query === 'number')
158
+                ? $title.eq(query)
159
+                : $(query).closest(selector.title)
160
+              : $(this).closest(selector.title),
161
+            $activeContent = $activeTitle.next($content),
162
+            isAnimating = $activeContent.hasClass(className.animating),
163
+            isActive    = $activeContent.hasClass(className.active),
164
+            isOpen      = (isActive || isAnimating)
165
+          ;
166
+          if(isOpen) {
167
+            module.debug('Accordion already open, skipping', $activeContent);
168
+            return;
169
+          }
170
+          module.debug('Opening accordion content', $activeTitle);
171
+          settings.onOpening.call($activeContent);
172
+          if(settings.exclusive) {
173
+            module.closeOthers.call($activeTitle);
174
+          }
175
+          $activeTitle
176
+            .addClass(className.active)
177
+          ;
178
+          $activeContent
179
+            .stop(true, true)
180
+            .addClass(className.animating)
181
+          ;
182
+          if(settings.animateChildren) {
183
+            if($.fn.transition !== undefined && $module.transition('is supported')) {
184
+              $activeContent
185
+                .children()
186
+                  .transition({
187
+                    animation   : 'fade in',
188
+                    queue       : false,
189
+                    useFailSafe : true,
190
+                    debug       : settings.debug,
191
+                    verbose     : settings.verbose,
192
+                    duration    : settings.duration
193
+                  })
194
+              ;
195
+            }
196
+            else {
197
+              $activeContent
198
+                .children()
199
+                  .stop(true, true)
200
+                  .animate({
201
+                    opacity: 1
202
+                  }, settings.duration, module.resetOpacity)
203
+              ;
204
+            }
205
+          }
206
+          $activeContent
207
+            .slideDown(settings.duration, settings.easing, function() {
208
+              $activeContent
209
+                .removeClass(className.animating)
210
+                .addClass(className.active)
211
+              ;
212
+              module.reset.display.call(this);
213
+              settings.onOpen.call(this);
214
+              settings.onChange.call(this);
215
+            })
216
+          ;
217
+        },
218
+
219
+        close: function(query) {
220
+          var
221
+            $activeTitle = (query !== undefined)
222
+              ? (typeof query === 'number')
223
+                ? $title.eq(query)
224
+                : $(query).closest(selector.title)
225
+              : $(this).closest(selector.title),
226
+            $activeContent = $activeTitle.next($content),
227
+            isAnimating    = $activeContent.hasClass(className.animating),
228
+            isActive       = $activeContent.hasClass(className.active),
229
+            isOpening      = (!isActive && isAnimating),
230
+            isClosing      = (isActive && isAnimating)
231
+          ;
232
+          if((isActive || isOpening) && !isClosing) {
233
+            module.debug('Closing accordion content', $activeContent);
234
+            settings.onClosing.call($activeContent);
235
+            $activeTitle
236
+              .removeClass(className.active)
237
+            ;
238
+            $activeContent
239
+              .stop(true, true)
240
+              .addClass(className.animating)
241
+            ;
242
+            if(settings.animateChildren) {
243
+              if($.fn.transition !== undefined && $module.transition('is supported')) {
244
+                $activeContent
245
+                  .children()
246
+                    .transition({
247
+                      animation   : 'fade out',
248
+                      queue       : false,
249
+                      useFailSafe : true,
250
+                      debug       : settings.debug,
251
+                      verbose     : settings.verbose,
252
+                      duration    : settings.duration
253
+                    })
254
+                ;
255
+              }
256
+              else {
257
+                $activeContent
258
+                  .children()
259
+                    .stop(true, true)
260
+                    .animate({
261
+                      opacity: 0
262
+                    }, settings.duration, module.resetOpacity)
263
+                ;
264
+              }
265
+            }
266
+            $activeContent
267
+              .slideUp(settings.duration, settings.easing, function() {
268
+                $activeContent
269
+                  .removeClass(className.animating)
270
+                  .removeClass(className.active)
271
+                ;
272
+                module.reset.display.call(this);
273
+                settings.onClose.call(this);
274
+                settings.onChange.call(this);
275
+              })
276
+            ;
277
+          }
278
+        },
279
+
280
+        closeOthers: function(index) {
281
+          var
282
+            $activeTitle = (index !== undefined)
283
+              ? $title.eq(index)
284
+              : $(this).closest(selector.title),
285
+            $parentTitles    = $activeTitle.parents(selector.content).prev(selector.title),
286
+            $activeAccordion = $activeTitle.closest(selector.accordion),
287
+            activeSelector   = selector.title + '.' + className.active + ':visible',
288
+            activeContent    = selector.content + '.' + className.active + ':visible',
289
+            $openTitles,
290
+            $nestedTitles,
291
+            $openContents
292
+          ;
293
+          if(settings.closeNested) {
294
+            $openTitles   = $activeAccordion.find(activeSelector).not($parentTitles);
295
+            $openContents = $openTitles.next($content);
296
+          }
297
+          else {
298
+            $openTitles   = $activeAccordion.find(activeSelector).not($parentTitles);
299
+            $nestedTitles = $activeAccordion.find(activeContent).find(activeSelector).not($parentTitles);
300
+            $openTitles   = $openTitles.not($nestedTitles);
301
+            $openContents = $openTitles.next($content);
302
+          }
303
+          if( ($openTitles.length > 0) ) {
304
+            module.debug('Exclusive enabled, closing other content', $openTitles);
305
+            $openTitles
306
+              .removeClass(className.active)
307
+            ;
308
+            $openContents
309
+              .removeClass(className.animating)
310
+              .stop(true, true)
311
+            ;
312
+            if(settings.animateChildren) {
313
+              if($.fn.transition !== undefined && $module.transition('is supported')) {
314
+                $openContents
315
+                  .children()
316
+                    .transition({
317
+                      animation   : 'fade out',
318
+                      useFailSafe : true,
319
+                      debug       : settings.debug,
320
+                      verbose     : settings.verbose,
321
+                      duration    : settings.duration
322
+                    })
323
+                ;
324
+              }
325
+              else {
326
+                $openContents
327
+                  .children()
328
+                    .stop(true, true)
329
+                    .animate({
330
+                      opacity: 0
331
+                    }, settings.duration, module.resetOpacity)
332
+                ;
333
+              }
334
+            }
335
+            $openContents
336
+              .slideUp(settings.duration , settings.easing, function() {
337
+                $(this).removeClass(className.active);
338
+                module.reset.display.call(this);
339
+              })
340
+            ;
341
+          }
342
+        },
343
+
344
+        reset: {
345
+
346
+          display: function() {
347
+            module.verbose('Removing inline display from element', this);
348
+            $(this).css('display', '');
349
+            if( $(this).attr('style') === '') {
350
+              $(this)
351
+                .attr('style', '')
352
+                .removeAttr('style')
353
+              ;
354
+            }
355
+          },
356
+
357
+          opacity: function() {
358
+            module.verbose('Removing inline opacity from element', this);
359
+            $(this).css('opacity', '');
360
+            if( $(this).attr('style') === '') {
361
+              $(this)
362
+                .attr('style', '')
363
+                .removeAttr('style')
364
+              ;
365
+            }
366
+          },
367
+
368
+        },
369
+
370
+        setting: function(name, value) {
371
+          module.debug('Changing setting', name, value);
372
+          if( $.isPlainObject(name) ) {
373
+            $.extend(true, settings, name);
374
+          }
375
+          else if(value !== undefined) {
376
+            if($.isPlainObject(settings[name])) {
377
+              $.extend(true, settings[name], value);
378
+            }
379
+            else {
380
+              settings[name] = value;
381
+            }
382
+          }
383
+          else {
384
+            return settings[name];
385
+          }
386
+        },
387
+        internal: function(name, value) {
388
+          module.debug('Changing internal', name, value);
389
+          if(value !== undefined) {
390
+            if( $.isPlainObject(name) ) {
391
+              $.extend(true, module, name);
392
+            }
393
+            else {
394
+              module[name] = value;
395
+            }
396
+          }
397
+          else {
398
+            return module[name];
399
+          }
400
+        },
401
+        debug: function() {
402
+          if(!settings.silent && settings.debug) {
403
+            if(settings.performance) {
404
+              module.performance.log(arguments);
405
+            }
406
+            else {
407
+              module.debug = Function.prototype.bind.call(console.info, console, settings.name + ':');
408
+              module.debug.apply(console, arguments);
409
+            }
410
+          }
411
+        },
412
+        verbose: function() {
413
+          if(!settings.silent && settings.verbose && settings.debug) {
414
+            if(settings.performance) {
415
+              module.performance.log(arguments);
416
+            }
417
+            else {
418
+              module.verbose = Function.prototype.bind.call(console.info, console, settings.name + ':');
419
+              module.verbose.apply(console, arguments);
420
+            }
421
+          }
422
+        },
423
+        error: function() {
424
+          if(!settings.silent) {
425
+            module.error = Function.prototype.bind.call(console.error, console, settings.name + ':');
426
+            module.error.apply(console, arguments);
427
+          }
428
+        },
429
+        performance: {
430
+          log: function(message) {
431
+            var
432
+              currentTime,
433
+              executionTime,
434
+              previousTime
435
+            ;
436
+            if(settings.performance) {
437
+              currentTime   = new Date().getTime();
438
+              previousTime  = time || currentTime;
439
+              executionTime = currentTime - previousTime;
440
+              time          = currentTime;
441
+              performance.push({
442
+                'Name'           : message[0],
443
+                'Arguments'      : [].slice.call(message, 1) || '',
444
+                'Element'        : element,
445
+                'Execution Time' : executionTime
446
+              });
447
+            }
448
+            clearTimeout(module.performance.timer);
449
+            module.performance.timer = setTimeout(module.performance.display, 500);
450
+          },
451
+          display: function() {
452
+            var
453
+              title = settings.name + ':',
454
+              totalTime = 0
455
+            ;
456
+            time = false;
457
+            clearTimeout(module.performance.timer);
458
+            $.each(performance, function(index, data) {
459
+              totalTime += data['Execution Time'];
460
+            });
461
+            title += ' ' + totalTime + 'ms';
462
+            if(moduleSelector) {
463
+              title += ' \'' + moduleSelector + '\'';
464
+            }
465
+            if( (console.group !== undefined || console.table !== undefined) && performance.length > 0) {
466
+              console.groupCollapsed(title);
467
+              if(console.table) {
468
+                console.table(performance);
469
+              }
470
+              else {
471
+                $.each(performance, function(index, data) {
472
+                  console.log(data['Name'] + ': ' + data['Execution Time']+'ms');
473
+                });
474
+              }
475
+              console.groupEnd();
476
+            }
477
+            performance = [];
478
+          }
479
+        },
480
+        invoke: function(query, passedArguments, context) {
481
+          var
482
+            object = instance,
483
+            maxDepth,
484
+            found,
485
+            response
486
+          ;
487
+          passedArguments = passedArguments || queryArguments;
488
+          context         = element         || context;
489
+          if(typeof query == 'string' && object !== undefined) {
490
+            query    = query.split(/[\. ]/);
491
+            maxDepth = query.length - 1;
492
+            $.each(query, function(depth, value) {
493
+              var camelCaseValue = (depth != maxDepth)
494
+                ? value + query[depth + 1].charAt(0).toUpperCase() + query[depth + 1].slice(1)
495
+                : query
496
+              ;
497
+              if( $.isPlainObject( object[camelCaseValue] ) && (depth != maxDepth) ) {
498
+                object = object[camelCaseValue];
499
+              }
500
+              else if( object[camelCaseValue] !== undefined ) {
501
+                found = object[camelCaseValue];
502
+                return false;
503
+              }
504
+              else if( $.isPlainObject( object[value] ) && (depth != maxDepth) ) {
505
+                object = object[value];
506
+              }
507
+              else if( object[value] !== undefined ) {
508
+                found = object[value];
509
+                return false;
510
+              }
511
+              else {
512
+                module.error(error.method, query);
513
+                return false;
514
+              }
515
+            });
516
+          }
517
+          if ( $.isFunction( found ) ) {
518
+            response = found.apply(context, passedArguments);
519
+          }
520
+          else if(found !== undefined) {
521
+            response = found;
522
+          }
523
+          if($.isArray(returnedValue)) {
524
+            returnedValue.push(response);
525
+          }
526
+          else if(returnedValue !== undefined) {
527
+            returnedValue = [returnedValue, response];
528
+          }
529
+          else if(response !== undefined) {
530
+            returnedValue = response;
531
+          }
532
+          return found;
533
+        }
534
+      };
535
+      if(methodInvoked) {
536
+        if(instance === undefined) {
537
+          module.initialize();
538
+        }
539
+        module.invoke(query);
540
+      }
541
+      else {
542
+        if(instance !== undefined) {
543
+          instance.invoke('destroy');
544
+        }
545
+        module.initialize();
546
+      }
547
+    })
548
+  ;
549
+  return (returnedValue !== undefined)
550
+    ? returnedValue
551
+    : this
552
+  ;
553
+};
554
+
555
+$.fn.accordion.settings = {
556
+
557
+  name            : 'Accordion',
558
+  namespace       : 'accordion',
559
+
560
+  silent          : false,
561
+  debug           : false,
562
+  verbose         : false,
563
+  performance     : true,
564
+
565
+  on              : 'click', // event on title that opens accordion
566
+
567
+  observeChanges  : true,  // whether accordion should automatically refresh on DOM insertion
568
+
569
+  exclusive       : true,  // whether a single accordion content panel should be open at once
570
+  collapsible     : true,  // whether accordion content can be closed
571
+  closeNested     : false, // whether nested content should be closed when a panel is closed
572
+  animateChildren : true,  // whether children opacity should be animated
573
+
574
+  duration        : 350, // duration of animation
575
+  easing          : 'easeOutQuad', // easing equation for animation
576
+
577
+
578
+  onOpening       : function(){}, // callback before open animation
579
+  onOpen          : function(){}, // callback after open animation
580
+  onClosing       : function(){}, // callback before closing animation
581
+  onClose         : function(){}, // callback after closing animation
582
+  onChange        : function(){}, // callback after closing or opening animation
583
+
584
+  error: {
585
+    method : 'The method you called is not defined'
586
+  },
587
+
588
+  className   : {
589
+    active    : 'active',
590
+    animating : 'animating'
591
+  },
592
+
593
+  selector    : {
594
+    accordion : '.accordion',
595
+    title     : '.title',
596
+    trigger   : '.title',
597
+    content   : '.content'
598
+  }
599
+
600
+};
601
+
602
+// Adds easing
603
+$.extend( $.easing, {
604
+  easeOutQuad: function (x, t, b, c, d) {
605
+    return -c *(t/=d)*(t-2) + b;
606
+  }
607
+});
608
+
609
+})( jQuery, window, document );
610
+

+ 9
- 0
fullstack-react-projects/time_tracking_app/public/semantic-dist/components/accordion.min.css
File diff suppressed because it is too large
View File


+ 10
- 0
fullstack-react-projects/time_tracking_app/public/semantic-dist/components/accordion.min.js
File diff suppressed because it is too large
View File


+ 275
- 0
fullstack-react-projects/time_tracking_app/public/semantic-dist/components/ad.css View File

@@ -0,0 +1,275 @@
1
+/*!
2
+ * # Semantic UI 2.2.7 - Ad
3
+ * http://github.com/semantic-org/semantic-ui/
4
+ *
5
+ *
6
+ * Copyright 2013 Contributors
7
+ * Released under the MIT license
8
+ * http://opensource.org/licenses/MIT
9
+ *
10
+ */
11
+
12
+
13
+/*******************************
14
+         Advertisement
15
+*******************************/
16
+
17
+.ui.ad {
18
+  display: block;
19
+  overflow: hidden;
20
+  margin: 1em 0em;
21
+}
22
+.ui.ad:first-child {
23
+  margin: 0em;
24
+}
25
+.ui.ad:last-child {
26
+  margin: 0em;
27
+}
28
+.ui.ad iframe {
29
+  margin: 0em;
30
+  padding: 0em;
31
+  border: none;
32
+  overflow: hidden;
33
+}
34
+
35
+/*--------------
36
+     Common
37
+---------------*/
38
+
39
+
40
+/* Leaderboard */
41
+.ui.leaderboard.ad {
42
+  width: 728px;
43
+  height: 90px;
44
+}
45
+
46
+/* Medium Rectangle */
47
+.ui[class*="medium rectangle"].ad {
48
+  width: 300px;
49
+  height: 250px;
50
+}
51
+
52
+/* Large Rectangle */
53
+.ui[class*="large rectangle"].ad {
54
+  width: 336px;
55
+  height: 280px;
56
+}
57
+
58
+/* Half Page */
59
+.ui[class*="half page"].ad {
60
+  width: 300px;
61
+  height: 600px;
62
+}
63
+
64
+/*--------------
65
+     Square
66
+---------------*/
67
+
68
+
69
+/* Square */
70
+.ui.square.ad {
71
+  width: 250px;
72
+  height: 250px;
73
+}
74
+
75
+/* Small Square */
76
+.ui[class*="small square"].ad {
77
+  width: 200px;
78
+  height: 200px;
79
+}
80
+
81
+/*--------------
82
+    Rectangle
83
+---------------*/
84
+
85
+
86
+/* Small Rectangle */
87
+.ui[class*="small rectangle"].ad {
88
+  width: 180px;
89
+  height: 150px;
90
+}
91
+
92
+/* Vertical Rectangle */
93
+.ui[class*="vertical rectangle"].ad {
94
+  width: 240px;
95
+  height: 400px;
96
+}
97
+
98
+/*--------------
99
+     Button
100
+---------------*/
101
+
102
+.ui.button.ad {
103
+  width: 120px;
104
+  height: 90px;
105
+}
106
+.ui[class*="square button"].ad {
107
+  width: 125px;
108
+  height: 125px;
109
+}
110
+.ui[class*="small button"].ad {
111
+  width: 120px;
112
+  height: 60px;
113
+}
114
+
115
+/*--------------
116
+   Skyscrapers
117
+---------------*/
118
+
119
+
120
+/* Skyscraper */
121
+.ui.skyscraper.ad {
122
+  width: 120px;
123
+  height: 600px;
124
+}
125
+
126
+/* Wide Skyscraper */
127
+.ui[class*="wide skyscraper"].ad {
128
+  width: 160px;
129
+}
130
+
131
+/*--------------
132
+     Banners
133
+---------------*/
134
+
135
+
136
+/* Banner */
137
+.ui.banner.ad {
138
+  width: 468px;
139
+  height: 60px;
140
+}
141
+
142
+/* Vertical Banner */
143
+.ui[class*="vertical banner"].ad {
144
+  width: 120px;
145
+  height: 240px;
146
+}
147
+
148
+/* Top Banner */
149
+.ui[class*="top banner"].ad {
150
+  width: 930px;
151
+  height: 180px;
152
+}
153
+
154
+/* Half Banner */
155
+.ui[class*="half banner"].ad {
156
+  width: 234px;
157
+  height: 60px;
158
+}
159
+
160
+/*--------------
161
+    Boards
162
+---------------*/
163
+
164
+
165
+/* Leaderboard */
166
+.ui[class*="large leaderboard"].ad {
167
+  width: 970px;
168
+  height: 90px;
169
+}
170
+
171
+/* Billboard */
172
+.ui.billboard.ad {
173
+  width: 970px;
174
+  height: 250px;
175
+}
176
+
177
+/*--------------
178
+    Panorama
179
+---------------*/
180
+
181
+
182
+/* Panorama */
183
+.ui.panorama.ad {
184
+  width: 980px;
185
+  height: 120px;
186
+}
187
+
188
+/*--------------
189
+     Netboard
190
+---------------*/
191
+
192
+
193
+/* Netboard */
194
+.ui.netboard.ad {
195
+  width: 580px;
196
+  height: 400px;
197
+}
198
+
199
+/*--------------
200
+     Mobile
201
+---------------*/
202
+
203
+
204
+/* Large Mobile Banner */
205
+.ui[class*="large mobile banner"].ad {
206
+  width: 320px;
207
+  height: 100px;
208
+}
209
+
210
+/* Mobile Leaderboard */
211
+.ui[class*="mobile leaderboard"].ad {
212
+  width: 320px;
213
+  height: 50px;
214
+}
215
+
216
+
217
+/*******************************
218
+             Types
219
+*******************************/
220
+
221
+
222
+/* Mobile Sizes */
223
+.ui.mobile.ad {
224
+  display: none;
225
+}
226
+@media only screen and (max-width: 767px) {
227
+  .ui.mobile.ad {
228
+    display: block;
229
+  }
230
+}
231
+
232
+
233
+/*******************************
234
+           Variations
235
+*******************************/
236
+
237
+.ui.centered.ad {
238
+  margin-left: auto;
239
+  margin-right: auto;
240
+}
241
+.ui.test.ad {
242
+  position: relative;
243
+  background: #545454;
244
+}
245
+.ui.test.ad:after {
246
+  position: absolute;
247
+  top: 50%;
248
+  left: 50%;
249
+  width: 100%;
250
+  text-align: center;
251
+  -webkit-transform: translateX(-50%) translateY(-50%);
252
+          transform: translateX(-50%) translateY(-50%);
253
+  content: 'Ad';
254
+  color: #FFFFFF;
255
+  font-size: 1em;
256
+  font-weight: bold;
257
+}
258
+.ui.mobile.test.ad:after {
259
+  font-size: 0.85714286em;
260
+}
261
+.ui.test.ad[data-text]:after {
262
+  content: attr(data-text);
263
+}
264
+
265
+
266
+/*******************************
267
+         Theme Overrides
268
+*******************************/
269
+
270
+
271
+
272
+/*******************************
273
+    User Variable Overrides
274
+*******************************/
275
+

+ 10
- 0
fullstack-react-projects/time_tracking_app/public/semantic-dist/components/ad.min.css View File

@@ -0,0 +1,10 @@
1
+/*!
2
+ * # Semantic UI 2.2.7 - Ad
3
+ * http://github.com/semantic-org/semantic-ui/
4
+ *
5
+ *
6
+ * Copyright 2013 Contributors
7
+ * Released under the MIT license
8
+ * http://opensource.org/licenses/MIT
9
+ *
10
+ */.ui.ad{display:block;overflow:hidden;margin:1em 0}.ui.ad:first-child,.ui.ad:last-child{margin:0}.ui.ad iframe{margin:0;padding:0;border:none;overflow:hidden}.ui.leaderboard.ad{width:728px;height:90px}.ui[class*="medium rectangle"].ad{width:300px;height:250px}.ui[class*="large rectangle"].ad{width:336px;height:280px}.ui[class*="half page"].ad{width:300px;height:600px}.ui.square.ad{width:250px;height:250px}.ui[class*="small square"].ad{width:200px;height:200px}.ui[class*="small rectangle"].ad{width:180px;height:150px}.ui[class*="vertical rectangle"].ad{width:240px;height:400px}.ui.button.ad{width:120px;height:90px}.ui[class*="square button"].ad{width:125px;height:125px}.ui[class*="small button"].ad{width:120px;height:60px}.ui.skyscraper.ad{width:120px;height:600px}.ui[class*="wide skyscraper"].ad{width:160px}.ui.banner.ad{width:468px;height:60px}.ui[class*="vertical banner"].ad{width:120px;height:240px}.ui[class*="top banner"].ad{width:930px;height:180px}.ui[class*="half banner"].ad{width:234px;height:60px}.ui[class*="large leaderboard"].ad{width:970px;height:90px}.ui.billboard.ad{width:970px;height:250px}.ui.panorama.ad{width:980px;height:120px}.ui.netboard.ad{width:580px;height:400px}.ui[class*="large mobile banner"].ad{width:320px;height:100px}.ui[class*="mobile leaderboard"].ad{width:320px;height:50px}.ui.mobile.ad{display:none}@media only screen and (max-width:767px){.ui.mobile.ad{display:block}}.ui.centered.ad{margin-left:auto;margin-right:auto}.ui.test.ad{position:relative;background:#545454}.ui.test.ad:after{position:absolute;top:50%;left:50%;width:100%;text-align:center;-webkit-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%);content:'Ad';color:#FFF;font-size:1em;font-weight:700}.ui.mobile.test.ad:after{font-size:.85714286em}.ui.test.ad[data-text]:after{content:attr(data-text)}

+ 1167
- 0
fullstack-react-projects/time_tracking_app/public/semantic-dist/components/api.js
File diff suppressed because it is too large
View File


+ 10
- 0
fullstack-react-projects/time_tracking_app/public/semantic-dist/components/api.min.js
File diff suppressed because it is too large
View File


+ 124
- 0
fullstack-react-projects/time_tracking_app/public/semantic-dist/components/breadcrumb.css View File

@@ -0,0 +1,124 @@
1
+/*!
2
+ * # Semantic UI 2.2.7 - Breadcrumb
3
+ * http://github.com/semantic-org/semantic-ui/
4
+ *
5
+ *
6
+ * Released under the MIT license
7
+ * http://opensource.org/licenses/MIT
8
+ *
9
+ */
10
+
11
+
12
+/*******************************
13
+           Breadcrumb
14
+*******************************/
15
+
16
+.ui.breadcrumb {
17
+  line-height: 1;
18
+  display: inline-block;
19
+  margin: 0em 0em;
20
+  vertical-align: middle;
21
+}
22
+.ui.breadcrumb:first-child {
23
+  margin-top: 0em;
24
+}
25
+.ui.breadcrumb:last-child {
26
+  margin-bottom: 0em;
27
+}
28
+
29
+
30
+/*******************************
31
+          Content
32
+*******************************/
33
+
34
+
35
+/* Divider */
36
+.ui.breadcrumb .divider {
37
+  display: inline-block;
38
+  opacity: 0.7;
39
+  margin: 0em 0.21428571rem 0em;
40
+  font-size: 0.92857143em;
41
+  color: rgba(0, 0, 0, 0.4);
42
+  vertical-align: baseline;
43
+}
44
+
45
+/* Link */
46
+.ui.breadcrumb a {
47
+  color: #4183C4;
48
+}
49
+.ui.breadcrumb a:hover {
50
+  color: #1e70bf;
51
+}
52
+
53
+/* Icon Divider */
54
+.ui.breadcrumb .icon.divider {
55
+  font-size: 0.85714286em;
56
+  vertical-align: baseline;
57
+}
58
+
59
+/* Section */
60
+.ui.breadcrumb a.section {
61
+  cursor: pointer;
62
+}
63
+.ui.breadcrumb .section {
64
+  display: inline-block;
65
+  margin: 0em;
66
+  padding: 0em;
67
+}
68
+
69
+/* Loose Coupling */
70
+.ui.breadcrumb.segment {
71
+  display: inline-block;
72
+  padding: 0.78571429em 1em;
73
+}
74
+
75
+
76
+/*******************************
77
+            States
78
+*******************************/
79
+
80
+.ui.breadcrumb .active.section {
81
+  font-weight: bold;
82
+}
83
+
84
+
85
+/*******************************
86
+           Variations
87
+*******************************/
88
+
89
+.ui.mini.breadcrumb {
90
+  font-size: 0.78571429rem;
91
+}
92
+.ui.tiny.breadcrumb {
93
+  font-size: 0.85714286rem;
94
+}
95
+.ui.small.breadcrumb {
96
+  font-size: 0.92857143rem;
97
+}
98
+.ui.breadcrumb {
99
+  font-size: 1rem;
100
+}
101
+.ui.large.breadcrumb {
102
+  font-size: 1.14285714rem;
103
+}
104
+.ui.big.breadcrumb {
105
+  font-size: 1.28571429rem;
106
+}
107
+.ui.huge.breadcrumb {
108
+  font-size: 1.42857143rem;
109
+}
110
+.ui.massive.breadcrumb {
111
+  font-size: 1.71428571rem;
112
+}
113
+
114
+
115
+/*******************************
116
+         Theme Overrides
117
+*******************************/
118
+
119
+
120
+
121
+/*******************************
122
+         Site Overrides
123
+*******************************/
124
+

+ 9
- 0
fullstack-react-projects/time_tracking_app/public/semantic-dist/components/breadcrumb.min.css View File

@@ -0,0 +1,9 @@
1
+/*!
2
+ * # Semantic UI 2.2.7 - Breadcrumb
3
+ * http://github.com/semantic-org/semantic-ui/
4
+ *
5
+ *
6
+ * Released under the MIT license
7
+ * http://opensource.org/licenses/MIT
8
+ *
9
+ */.ui.breadcrumb{line-height:1;display:inline-block;margin:0;vertical-align:middle}.ui.breadcrumb:first-child{margin-top:0}.ui.breadcrumb:last-child{margin-bottom:0}.ui.breadcrumb .divider{display:inline-block;opacity:.7;margin:0 .21428571rem;font-size:.92857143em;color:rgba(0,0,0,.4);vertical-align:baseline}.ui.breadcrumb a{color:#4183C4}.ui.breadcrumb a:hover{color:#1e70bf}.ui.breadcrumb .icon.divider{font-size:.85714286em;vertical-align:baseline}.ui.breadcrumb a.section{cursor:pointer}.ui.breadcrumb .section{display:inline-block;margin:0;padding:0}.ui.breadcrumb.segment{display:inline-block;padding:.78571429em 1em}.ui.breadcrumb .active.section{font-weight:700}.ui.mini.breadcrumb{font-size:.78571429rem}.ui.tiny.breadcrumb{font-size:.85714286rem}.ui.small.breadcrumb{font-size:.92857143rem}.ui.breadcrumb{font-size:1rem}.ui.large.breadcrumb{font-size:1.14285714rem}.ui.big.breadcrumb{font-size:1.28571429rem}.ui.huge.breadcrumb{font-size:1.42857143rem}.ui.massive.breadcrumb{font-size:1.71428571rem}

+ 3450
- 0
fullstack-react-projects/time_tracking_app/public/semantic-dist/components/button.css
File diff suppressed because it is too large
View File


+ 9
- 0
fullstack-react-projects/time_tracking_app/public/semantic-dist/components/button.min.css
File diff suppressed because it is too large
View File


+ 964
- 0
fullstack-react-projects/time_tracking_app/public/semantic-dist/components/card.css View File

@@ -0,0 +1,964 @@
1
+/*!
2
+ * # Semantic UI 2.2.7 - Item
3
+ * http://github.com/semantic-org/semantic-ui/
4
+ *
5
+ *
6
+ * Released under the MIT license
7
+ * http://opensource.org/licenses/MIT
8
+ *
9
+ */
10
+
11
+
12
+/*******************************
13
+            Standard
14
+*******************************/
15
+
16
+
17
+/*--------------
18
+      Card
19
+---------------*/
20
+
21
+.ui.cards > .card,
22
+.ui.card {
23
+  max-width: 100%;
24
+  position: relative;
25
+  display: -webkit-box;
26
+  display: -ms-flexbox;
27
+  display: flex;
28
+  -webkit-box-orient: vertical;
29
+  -webkit-box-direction: normal;
30
+      -ms-flex-direction: column;
31
+          flex-direction: column;
32
+  width: 290px;
33
+  min-height: 0px;
34
+  background: #FFFFFF;
35
+  padding: 0em;
36
+  border: none;
37
+  border-radius: 0.28571429rem;
38
+  box-shadow: 0px 1px 3px 0px #D4D4D5, 0px 0px 0px 1px #D4D4D5;
39
+  -webkit-transition: box-shadow 0.1s ease, -webkit-transform 0.1s ease;
40
+  transition: box-shadow 0.1s ease, -webkit-transform 0.1s ease;
41
+  transition: box-shadow 0.1s ease, transform 0.1s ease;
42
+  transition: box-shadow 0.1s ease, transform 0.1s ease, -webkit-transform 0.1s ease;
43
+  z-index: '';
44
+}
45
+.ui.card {
46
+  margin: 1em 0em;
47
+}
48
+.ui.cards > .card a,
49
+.ui.card a {
50
+  cursor: pointer;
51
+}
52
+.ui.card:first-child {
53
+  margin-top: 0em;
54
+}
55
+.ui.card:last-child {
56
+  margin-bottom: 0em;
57
+}
58
+
59
+/*--------------
60
+      Cards
61
+---------------*/
62
+
63
+.ui.cards {
64
+  display: -webkit-box;
65
+  display: -ms-flexbox;
66
+  display: flex;
67
+  margin: -0.875em -0.5em;
68
+  -ms-flex-wrap: wrap;
69
+      flex-wrap: wrap;
70
+}
71
+.ui.cards > .card {
72
+  display: -webkit-box;
73
+  display: -ms-flexbox;
74
+  display: flex;
75
+  margin: 0.875em 0.5em;
76
+  float: none;
77
+}
78
+
79
+/* Clearing */
80
+.ui.cards:after,
81
+.ui.card:after {
82
+  display: block;
83
+  content: ' ';
84
+  height: 0px;
85
+  clear: both;
86
+  overflow: hidden;
87
+  visibility: hidden;
88
+}
89
+
90
+/* Consecutive Card Groups Preserve Row Spacing */
91
+.ui.cards ~ .ui.cards {
92
+  margin-top: 0.875em;
93
+}
94
+
95
+/*--------------
96
+  Rounded Edges
97
+---------------*/
98
+
99
+.ui.cards > .card > :first-child,
100
+.ui.card > :first-child {
101
+  border-radius: 0.28571429rem 0.28571429rem 0em 0em !important;
102
+  border-top: none !important;
103
+}
104
+.ui.cards > .card > :last-child,
105
+.ui.card > :last-child {
106
+  border-radius: 0em 0em 0.28571429rem 0.28571429rem !important;
107
+}
108
+.ui.cards > .card > :only-child,
109
+.ui.card > :only-child {
110
+  border-radius: 0.28571429rem !important;
111
+}
112
+
113
+/*--------------
114
+     Images
115
+---------------*/
116
+
117
+.ui.cards > .card > .image,
118
+.ui.card > .image {
119
+  position: relative;
120
+  display: block;
121
+  -webkit-box-flex: 0;
122
+      -ms-flex: 0 0 auto;
123
+          flex: 0 0 auto;
124
+  padding: 0em;
125
+  background: rgba(0, 0, 0, 0.05);
126
+}
127
+.ui.cards > .card > .image > img,
128
+.ui.card > .image > img {
129
+  display: block;
130
+  width: 100%;
131
+  height: auto;
132
+  border-radius: inherit;
133
+}
134
+.ui.cards > .card > .image:not(.ui) > img,
135
+.ui.card > .image:not(.ui) > img {
136
+  border: none;
137
+}
138
+
139
+/*--------------
140
+     Content
141
+---------------*/
142
+
143
+.ui.cards > .card > .content,
144
+.ui.card > .content {
145
+  -webkit-box-flex: 1;
146
+      -ms-flex-positive: 1;
147
+          flex-grow: 1;
148
+  border: none;
149
+  border-top: 1px solid rgba(34, 36, 38, 0.1);
150
+  background: none;
151
+  margin: 0em;
152
+  padding: 1em 1em;
153
+  box-shadow: none;
154
+  font-size: 1em;
155
+  border-radius: 0em;
156
+}
157
+.ui.cards > .card > .content:after,
158
+.ui.card > .content:after {
159
+  display: block;
160
+  content: ' ';
161
+  height: 0px;
162
+  clear: both;
163
+  overflow: hidden;
164
+  visibility: hidden;
165
+}
166
+.ui.cards > .card > .content > .header,
167
+.ui.card > .content > .header {
168
+  display: block;
169
+  margin: '';
170
+  font-family: 'Lato', 'Helvetica Neue', Arial, Helvetica, sans-serif;
171
+  color: rgba(0, 0, 0, 0.85);
172
+}
173
+
174
+/* Default Header Size */
175
+.ui.cards > .card > .content > .header:not(.ui),
176
+.ui.card > .content > .header:not(.ui) {
177
+  font-weight: bold;
178
+  font-size: 1.28571429em;
179
+  margin-top: -0.21425em;
180
+  line-height: 1.2857em;
181
+}
182
+.ui.cards > .card > .content > .meta + .description,
183
+.ui.cards > .card > .content > .header + .description,
184
+.ui.card > .content > .meta + .description,
185
+.ui.card > .content > .header + .description {
186
+  margin-top: 0.5em;
187
+}
188
+
189
+/*----------------
190
+ Floated Content
191
+-----------------*/
192
+
193
+.ui.cards > .card [class*="left floated"],
194
+.ui.card [class*="left floated"] {
195
+  float: left;
196
+}
197
+.ui.cards > .card [class*="right floated"],
198
+.ui.card [class*="right floated"] {
199
+  float: right;
200
+}
201
+
202
+/*--------------
203
+     Aligned
204
+---------------*/
205
+
206
+.ui.cards > .card [class*="left aligned"],
207
+.ui.card [class*="left aligned"] {
208
+  text-align: left;
209
+}
210
+.ui.cards > .card [class*="center aligned"],
211
+.ui.card [class*="center aligned"] {
212
+  text-align: center;
213
+}
214
+.ui.cards > .card [class*="right aligned"],
215
+.ui.card [class*="right aligned"] {
216
+  text-align: right;
217
+}
218
+
219
+/*--------------
220
+  Content Image
221
+---------------*/
222
+
223
+.ui.cards > .card .content img,
224
+.ui.card .content img {
225
+  display: inline-block;
226
+  vertical-align: middle;
227
+  width: '';
228
+}
229
+.ui.cards > .card img.avatar,
230
+.ui.cards > .card .avatar img,
231
+.ui.card img.avatar,
232
+.ui.card .avatar img {
233
+  width: 2em;
234
+  height: 2em;
235
+  border-radius: 500rem;
236
+}
237
+
238
+/*--------------
239
+   Description
240
+---------------*/
241
+
242
+.ui.cards > .card > .content > .description,
243
+.ui.card > .content > .description {
244
+  clear: both;
245
+  color: rgba(0, 0, 0, 0.68);
246
+}
247
+
248
+/*--------------
249
+    Paragraph
250
+---------------*/
251
+
252
+.ui.cards > .card > .content p,
253
+.ui.card > .content p {
254
+  margin: 0em 0em 0.5em;
255
+}
256
+.ui.cards > .card > .content p:last-child,
257
+.ui.card > .content p:last-child {
258
+  margin-bottom: 0em;
259
+}
260
+
261
+/*--------------
262
+      Meta
263
+---------------*/
264
+
265
+.ui.cards > .card .meta,
266
+.ui.card .meta {
267
+  font-size: 1em;
268
+  color: rgba(0, 0, 0, 0.4);
269
+}
270
+.ui.cards > .card .meta *,
271
+.ui.card .meta * {
272
+  margin-right: 0.3em;
273
+}
274
+.ui.cards > .card .meta :last-child,
275
+.ui.card .meta :last-child {
276
+  margin-right: 0em;
277
+}
278
+.ui.cards > .card .meta [class*="right floated"],
279
+.ui.card .meta [class*="right floated"] {
280
+  margin-right: 0em;
281
+  margin-left: 0.3em;
282
+}
283
+
284
+/*--------------
285
+      Links
286
+---------------*/
287
+
288
+
289
+/* Generic */
290
+.ui.cards > .card > .content a:not(.ui),
291
+.ui.card > .content a:not(.ui) {
292
+  color: '';
293
+  -webkit-transition: color 0.1s ease;
294
+  transition: color 0.1s ease;
295
+}
296
+.ui.cards > .card > .content a:not(.ui):hover,
297
+.ui.card > .content a:not(.ui):hover {
298
+  color: '';
299
+}
300
+
301
+/* Header */
302
+.ui.cards > .card > .content > a.header,
303
+.ui.card > .content > a.header {
304
+  color: rgba(0, 0, 0, 0.85);
305
+}
306
+.ui.cards > .card > .content > a.header:hover,
307
+.ui.card > .content > a.header:hover {
308
+  color: #1e70bf;
309
+}
310
+
311
+/* Meta */
312
+.ui.cards > .card .meta > a:not(.ui),
313
+.ui.card .meta > a:not(.ui) {
314
+  color: rgba(0, 0, 0, 0.4);
315
+}
316
+.ui.cards > .card .meta > a:not(.ui):hover,
317
+.ui.card .meta > a:not(.ui):hover {
318
+  color: rgba(0, 0, 0, 0.87);
319
+}
320
+
321
+/*--------------
322
+     Buttons
323
+---------------*/
324
+
325
+.ui.cards > .card > .buttons,
326
+.ui.card > .buttons,
327
+.ui.cards > .card > .button,
328
+.ui.card > .button {
329
+  margin: 0px -1px;
330
+  width: calc(100% +  2px );
331
+}
332
+
333
+/*--------------
334
+      Dimmer
335
+---------------*/
336
+
337
+.ui.cards > .card .dimmer,
338
+.ui.card .dimmer {
339
+  background-color: '';
340
+  z-index: 10;
341
+}
342
+
343
+/*--------------
344
+     Labels
345
+---------------*/
346
+
347
+
348
+/*-----Star----- */
349
+
350
+
351
+/* Icon */
352
+.ui.cards > .card > .content .star.icon,
353
+.ui.card > .content .star.icon {
354
+  cursor: pointer;
355
+  opacity: 0.75;
356
+  -webkit-transition: color 0.1s ease;
357
+  transition: color 0.1s ease;
358
+}
359
+.ui.cards > .card > .content .star.icon:hover,
360
+.ui.card > .content .star.icon:hover {
361
+  opacity: 1;
362
+  color: #FFB70A;
363
+}
364
+.ui.cards > .card > .content .active.star.icon,
365
+.ui.card > .content .active.star.icon {
366
+  color: #FFE623;
367
+}
368
+
369
+/*-----Like----- */
370
+
371
+
372
+/* Icon */
373
+.ui.cards > .card > .content .like.icon,
374
+.ui.card > .content .like.icon {
375
+  cursor: pointer;
376
+  opacity: 0.75;
377
+  -webkit-transition: color 0.1s ease;
378
+  transition: color 0.1s ease;
379
+}
380
+.ui.cards > .card > .content .like.icon:hover,
381
+.ui.card > .content .like.icon:hover {
382
+  opacity: 1;
383
+  color: #FF2733;
384
+}
385
+.ui.cards > .card > .content .active.like.icon,
386
+.ui.card > .content .active.like.icon {
387
+  color: #FF2733;
388
+}
389
+
390
+/*----------------
391
+  Extra Content
392
+-----------------*/
393
+
394
+.ui.cards > .card > .extra,
395
+.ui.card > .extra {
396
+  max-width: 100%;
397
+  min-height: 0em !important;
398
+  -webkit-box-flex: 0;
399
+      -ms-flex-positive: 0;
400
+          flex-grow: 0;
401
+  border-top: 1px solid rgba(0, 0, 0, 0.05) !important;
402
+  position: static;
403
+  background: none;
404
+  width: auto;
405
+  margin: 0em 0em;
406
+  padding: 0.75em 1em;
407
+  top: 0em;
408
+  left: 0em;
409
+  color: rgba(0, 0, 0, 0.4);
410
+  box-shadow: none;
411
+  -webkit-transition: color 0.1s ease;
412
+  transition: color 0.1s ease;
413
+}
414
+.ui.cards > .card > .extra a:not(.ui),
415
+.ui.card > .extra a:not(.ui) {
416
+  color: rgba(0, 0, 0, 0.4);
417
+}
418
+.ui.cards > .card > .extra a:not(.ui):hover,
419
+.ui.card > .extra a:not(.ui):hover {
420
+  color: #1e70bf;
421
+}
422
+
423
+
424
+/*******************************
425
+           Variations
426
+*******************************/
427
+
428
+
429
+/*-------------------
430
+       Raised
431
+--------------------*/
432
+
433
+.ui.raised.cards > .card,
434
+.ui.raised.card {
435
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 4px 0px rgba(34, 36, 38, 0.12), 0px 2px 10px 0px rgba(34, 36, 38, 0.15);
436
+}
437
+.ui.raised.cards a.card:hover,
438
+.ui.link.cards .raised.card:hover,
439
+a.ui.raised.card:hover,
440
+.ui.link.raised.card:hover {
441
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 4px 0px rgba(34, 36, 38, 0.15), 0px 2px 10px 0px rgba(34, 36, 38, 0.25);
442
+}
443
+.ui.raised.cards > .card,
444
+.ui.raised.card {
445
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 4px 0px rgba(34, 36, 38, 0.12), 0px 2px 10px 0px rgba(34, 36, 38, 0.15);
446
+}
447
+
448
+/*-------------------
449
+       Centered
450
+--------------------*/
451
+
452
+.ui.centered.cards {
453
+  -webkit-box-pack: center;
454
+      -ms-flex-pack: center;
455
+          justify-content: center;
456
+}
457
+.ui.centered.card {
458
+  margin-left: auto;
459
+  margin-right: auto;
460
+}
461
+
462
+/*-------------------
463
+        Fluid
464
+--------------------*/
465
+
466
+.ui.fluid.card {
467
+  width: 100%;
468
+  max-width: 9999px;
469
+}
470
+
471
+/*-------------------
472
+        Link
473
+--------------------*/
474
+
475
+.ui.cards a.card,
476
+.ui.link.cards .card,
477
+a.ui.card,
478
+.ui.link.card {
479
+  -webkit-transform: none;
480
+          transform: none;
481
+}
482
+.ui.cards a.card:hover,
483
+.ui.link.cards .card:hover,
484
+a.ui.card:hover,
485
+.ui.link.card:hover {
486
+  cursor: pointer;
487
+  z-index: 5;
488
+  background: #FFFFFF;
489
+  border: none;
490
+  box-shadow: 0px 1px 3px 0px #BCBDBD, 0px 0px 0px 1px #D4D4D5;
491
+  -webkit-transform: translateY(-3px);
492
+          transform: translateY(-3px);
493
+}
494
+
495
+/*-------------------
496
+       Colors
497
+--------------------*/
498
+
499
+
500
+/* Red */
501
+.ui.red.cards > .card,
502
+.ui.cards > .red.card,
503
+.ui.red.card {
504
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #DB2828, 0px 1px 3px 0px #D4D4D5;
505
+}
506
+.ui.red.cards > .card:hover,
507
+.ui.cards > .red.card:hover,
508
+.ui.red.card:hover {
509
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #d01919, 0px 1px 3px 0px #BCBDBD;
510
+}
511
+
512
+/* Orange */
513
+.ui.orange.cards > .card,
514
+.ui.cards > .orange.card,
515
+.ui.orange.card {
516
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #F2711C, 0px 1px 3px 0px #D4D4D5;
517
+}
518
+.ui.orange.cards > .card:hover,
519
+.ui.cards > .orange.card:hover,
520
+.ui.orange.card:hover {
521
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #f26202, 0px 1px 3px 0px #BCBDBD;
522
+}
523
+
524
+/* Yellow */
525
+.ui.yellow.cards > .card,
526
+.ui.cards > .yellow.card,
527
+.ui.yellow.card {
528
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #FBBD08, 0px 1px 3px 0px #D4D4D5;
529
+}
530
+.ui.yellow.cards > .card:hover,
531
+.ui.cards > .yellow.card:hover,
532
+.ui.yellow.card:hover {
533
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #eaae00, 0px 1px 3px 0px #BCBDBD;
534
+}
535
+
536
+/* Olive */
537
+.ui.olive.cards > .card,
538
+.ui.cards > .olive.card,
539
+.ui.olive.card {
540
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #B5CC18, 0px 1px 3px 0px #D4D4D5;
541
+}
542
+.ui.olive.cards > .card:hover,
543
+.ui.cards > .olive.card:hover,
544
+.ui.olive.card:hover {
545
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #a7bd0d, 0px 1px 3px 0px #BCBDBD;
546
+}
547
+
548
+/* Green */
549
+.ui.green.cards > .card,
550
+.ui.cards > .green.card,
551
+.ui.green.card {
552
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #21BA45, 0px 1px 3px 0px #D4D4D5;
553
+}
554
+.ui.green.cards > .card:hover,
555
+.ui.cards > .green.card:hover,
556
+.ui.green.card:hover {
557
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #16ab39, 0px 1px 3px 0px #BCBDBD;
558
+}
559
+
560
+/* Teal */
561
+.ui.teal.cards > .card,
562
+.ui.cards > .teal.card,
563
+.ui.teal.card {
564
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #00B5AD, 0px 1px 3px 0px #D4D4D5;
565
+}
566
+.ui.teal.cards > .card:hover,
567
+.ui.cards > .teal.card:hover,
568
+.ui.teal.card:hover {
569
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #009c95, 0px 1px 3px 0px #BCBDBD;
570
+}
571
+
572
+/* Blue */
573
+.ui.blue.cards > .card,
574
+.ui.cards > .blue.card,
575
+.ui.blue.card {
576
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #2185D0, 0px 1px 3px 0px #D4D4D5;
577
+}
578
+.ui.blue.cards > .card:hover,
579
+.ui.cards > .blue.card:hover,
580
+.ui.blue.card:hover {
581
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #1678c2, 0px 1px 3px 0px #BCBDBD;
582
+}
583
+
584
+/* Violet */
585
+.ui.violet.cards > .card,
586
+.ui.cards > .violet.card,
587
+.ui.violet.card {
588
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #6435C9, 0px 1px 3px 0px #D4D4D5;
589
+}
590
+.ui.violet.cards > .card:hover,
591
+.ui.cards > .violet.card:hover,
592
+.ui.violet.card:hover {
593
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #5829bb, 0px 1px 3px 0px #BCBDBD;
594
+}
595
+
596
+/* Purple */
597
+.ui.purple.cards > .card,
598
+.ui.cards > .purple.card,
599
+.ui.purple.card {
600
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #A333C8, 0px 1px 3px 0px #D4D4D5;
601
+}
602
+.ui.purple.cards > .card:hover,
603
+.ui.cards > .purple.card:hover,
604
+.ui.purple.card:hover {
605
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #9627ba, 0px 1px 3px 0px #BCBDBD;
606
+}
607
+
608
+/* Pink */
609
+.ui.pink.cards > .card,
610
+.ui.cards > .pink.card,
611
+.ui.pink.card {
612
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #E03997, 0px 1px 3px 0px #D4D4D5;
613
+}
614
+.ui.pink.cards > .card:hover,
615
+.ui.cards > .pink.card:hover,
616
+.ui.pink.card:hover {
617
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #e61a8d, 0px 1px 3px 0px #BCBDBD;
618
+}
619
+
620
+/* Brown */
621
+.ui.brown.cards > .card,
622
+.ui.cards > .brown.card,
623
+.ui.brown.card {
624
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #A5673F, 0px 1px 3px 0px #D4D4D5;
625
+}
626
+.ui.brown.cards > .card:hover,
627
+.ui.cards > .brown.card:hover,
628
+.ui.brown.card:hover {
629
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #975b33, 0px 1px 3px 0px #BCBDBD;
630
+}
631
+
632
+/* Grey */
633
+.ui.grey.cards > .card,
634
+.ui.cards > .grey.card,
635
+.ui.grey.card {
636
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #767676, 0px 1px 3px 0px #D4D4D5;
637
+}
638
+.ui.grey.cards > .card:hover,
639
+.ui.cards > .grey.card:hover,
640
+.ui.grey.card:hover {
641
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #838383, 0px 1px 3px 0px #BCBDBD;
642
+}
643
+
644
+/* Black */
645
+.ui.black.cards > .card,
646
+.ui.cards > .black.card,
647
+.ui.black.card {
648
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #1B1C1D, 0px 1px 3px 0px #D4D4D5;
649
+}
650
+.ui.black.cards > .card:hover,
651
+.ui.cards > .black.card:hover,
652
+.ui.black.card:hover {
653
+  box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #27292a, 0px 1px 3px 0px #BCBDBD;
654
+}
655
+
656
+/*--------------
657
+   Card Count
658
+---------------*/
659
+
660
+.ui.one.cards {
661
+  margin-left: 0em;
662
+  margin-right: 0em;
663
+}
664
+.ui.one.cards > .card {
665
+  width: 100%;
666
+}
667
+.ui.two.cards {
668
+  margin-left: -1em;
669
+  margin-right: -1em;
670
+}
671
+.ui.two.cards > .card {
672
+  width: calc( 50%  -  2em );
673
+  margin-left: 1em;
674
+  margin-right: 1em;
675
+}
676
+.ui.three.cards {
677
+  margin-left: -1em;
678
+  margin-right: -1em;
679
+}
680
+.ui.three.cards > .card {
681
+  width: calc( 33.33333333%  -  2em );
682
+  margin-left: 1em;
683
+  margin-right: 1em;
684
+}
685
+.ui.four.cards {
686
+  margin-left: -0.75em;
687
+  margin-right: -0.75em;
688
+}
689
+.ui.four.cards > .card {
690
+  width: calc( 25%  -  1.5em );
691
+  margin-left: 0.75em;
692
+  margin-right: 0.75em;
693
+}
694
+.ui.five.cards {
695
+  margin-left: -0.75em;
696
+  margin-right: -0.75em;
697
+}
698
+.ui.five.cards > .card {
699
+  width: calc( 20%  -  1.5em );
700
+  margin-left: 0.75em;
701
+  margin-right: 0.75em;
702
+}
703
+.ui.six.cards {
704
+  margin-left: -0.75em;
705
+  margin-right: -0.75em;
706
+}
707
+.ui.six.cards > .card {
708
+  width: calc( 16.66666667%  -  1.5em );
709
+  margin-left: 0.75em;
710
+  margin-right: 0.75em;
711
+}
712
+.ui.seven.cards {
713
+  margin-left: -0.5em;
714
+  margin-right: -0.5em;
715
+}
716
+.ui.seven.cards > .card {
717
+  width: calc( 14.28571429%  -  1em );
718
+  margin-left: 0.5em;
719
+  margin-right: 0.5em;
720
+}
721
+.ui.eight.cards {
722
+  margin-left: -0.5em;
723
+  margin-right: -0.5em;
724
+}
725
+.ui.eight.cards > .card {
726
+  width: calc( 12.5%  -  1em );
727
+  margin-left: 0.5em;
728
+  margin-right: 0.5em;
729
+  font-size: 11px;
730
+}
731
+.ui.nine.cards {
732
+  margin-left: -0.5em;
733
+  margin-right: -0.5em;
734
+}
735
+.ui.nine.cards > .card {
736
+  width: calc( 11.11111111%  -  1em );
737
+  margin-left: 0.5em;
738
+  margin-right: 0.5em;
739
+  font-size: 10px;
740
+}
741
+.ui.ten.cards {
742
+  margin-left: -0.5em;
743
+  margin-right: -0.5em;
744
+}
745
+.ui.ten.cards > .card {
746
+  width: calc( 10%  -  1em );
747
+  margin-left: 0.5em;
748
+  margin-right: 0.5em;
749
+}
750
+
751
+/*-------------------
752
+      Doubling
753
+--------------------*/
754
+
755
+
756
+/* Mobile Only */
757
+@media only screen and (max-width: 767px) {
758
+  .ui.two.doubling.cards {
759
+    margin-left: 0em;
760
+    margin-right: 0em;
761
+  }
762
+  .ui.two.doubling.cards .card {
763
+    width: 100%;
764
+    margin-left: 0em;
765
+    margin-right: 0em;
766
+  }
767
+  .ui.three.doubling.cards {
768
+    margin-left: -1em;
769
+    margin-right: -1em;
770
+  }
771
+  .ui.three.doubling.cards .card {
772
+    width: calc( 50%  -  2em );
773
+    margin-left: 1em;
774
+    margin-right: 1em;
775
+  }
776
+  .ui.four.doubling.cards {
777
+    margin-left: -1em;
778
+    margin-right: -1em;
779
+  }
780
+  .ui.four.doubling.cards .card {
781
+    width: calc( 50%  -  2em );
782
+    margin-left: 1em;
783
+    margin-right: 1em;
784
+  }
785
+  .ui.five.doubling.cards {
786
+    margin-left: -1em;
787
+    margin-right: -1em;
788
+  }
789
+  .ui.five.doubling.cards .card {
790
+    width: calc( 50%  -  2em );
791
+    margin-left: 1em;
792
+    margin-right: 1em;
793
+  }
794
+  .ui.six.doubling.cards {
795
+    margin-left: -1em;
796
+    margin-right: -1em;
797
+  }
798
+  .ui.six.doubling.cards .card {
799
+    width: calc( 50%  -  2em );
800
+    margin-left: 1em;
801
+    margin-right: 1em;
802
+  }
803
+  .ui.seven.doubling.cards {
804
+    margin-left: -1em;
805
+    margin-right: -1em;
806
+  }
807
+  .ui.seven.doubling.cards .card {
808
+    width: calc( 33.33333333%  -  2em );
809
+    margin-left: 1em;
810
+    margin-right: 1em;
811
+  }
812
+  .ui.eight.doubling.cards {
813
+    margin-left: -1em;
814
+    margin-right: -1em;
815
+  }
816
+  .ui.eight.doubling.cards .card {
817
+    width: calc( 33.33333333%  -  2em );
818
+    margin-left: 1em;
819
+    margin-right: 1em;
820
+  }
821
+  .ui.nine.doubling.cards {
822
+    margin-left: -1em;
823
+    margin-right: -1em;
824
+  }
825
+  .ui.nine.doubling.cards .card {
826
+    width: calc( 33.33333333%  -  2em );
827
+    margin-left: 1em;
828
+    margin-right: 1em;
829
+  }
830
+  .ui.ten.doubling.cards {
831
+    margin-left: -1em;
832
+    margin-right: -1em;
833
+  }
834
+  .ui.ten.doubling.cards .card {
835
+    width: calc( 33.33333333%  -  2em );
836
+    margin-left: 1em;
837
+    margin-right: 1em;
838
+  }
839
+}
840
+
841
+/* Tablet Only */
842
+@media only screen and (min-width: 768px) and (max-width: 991px) {
843
+  .ui.two.doubling.cards {
844
+    margin-left: 0em;
845
+    margin-right: 0em;
846
+  }
847
+  .ui.two.doubling.cards .card {
848
+    width: 100%;
849
+    margin-left: 0em;
850
+    margin-right: 0em;
851
+  }
852
+  .ui.three.doubling.cards {
853
+    margin-left: -1em;
854
+    margin-right: -1em;
855
+  }
856
+  .ui.three.doubling.cards .card {
857
+    width: calc( 50%  -  2em );
858
+    margin-left: 1em;
859
+    margin-right: 1em;
860
+  }
861
+  .ui.four.doubling.cards {
862
+    margin-left: -1em;
863
+    margin-right: -1em;
864
+  }
865
+  .ui.four.doubling.cards .card {
866
+    width: calc( 50%  -  2em );
867
+    margin-left: 1em;
868
+    margin-right: 1em;
869
+  }
870
+  .ui.five.doubling.cards {