table on topology views add and start router controller

[VSoRC/.git] / styles / cards.css

diff --git a/styles/cards.css b/styles/cards.css
new file mode 100644 (file)
index 0000000..405579c
--- /dev/null
+++ b/styles/cards.css
@@ -0,0 +1,151 @@
+/*\r
+    Copyright (c) Maen Artimy, 2018\r
+*/\r
+\r
+.card {\r
+       background-color: transparent;\r
+       float: left;\r
+    /*box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);*/\r
+    transition: 0.3s;\r
+    width: 430px;\r
+    font-size: 14px;\r
+    margin: 0px 10px 20px 10px;\r
+}\r
+\r
+.card:nth-of-type(even) {\r
+    clear: right;\r
+ }\r
+\r
+.card .header {\r
+    border-style: solid;\r
+    border-color: var(--scolor-3);\r
+    border-width: 2px 0 2px 0;\r
+       padding: 0px 16px;\r
+}\r
+\r
+.container {\r
+    overflow-x: auto;\r
+}\r
+\r
+.card .container {\r
+       width: 100%;\r
+       transition: 1s;\r
+       /*overflow: auto;*/\r
+\r
+       height: 150px;\r
+    padding: 8px 16px;\r
+}\r
+\r
+.card.bar {\r
+    padding: 0px 16px;\r
+}\r
+\r
+.card.bar button {\r
+       margin: 2px 8px;\r
+}\r
+\r
+.card.wide {\r
+       float: none;\r
+    width: 1100px; /*needs to be fixed*/\r
+}\r
+\r
+.card.wide .container{\r
+    height: auto;\r
+    padding: 8px 16px;\r
+}\r
+\r
+.card:hover {\r
+    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);\r
+}\r
+\r
+.card .header button {\r
+    background-color: transparent;\r
+    color: black;\r
+    cursor: pointer;\r
+    padding: 18px;\r
+    width: 100%;\r
+    border: none;\r
+    text-align: left;\r
+    outline: none;\r
+    font-size: 15px;\r
+    transition: 0.4s;\r
+}\r
+\r
+.card .header button::after {\r
+    content: '\002B';\r
+    color: black;\r
+    font-weight: bold;\r
+    float: right;\r
+    margin-left: 5px;\r
+}\r
+\r
+.card .header button.active::after {\r
+    content: "\2212";\r
+}\r
+\r
+.card .header h1 {\r
+       color: var(--scolor-4);\r
+       float: left;\r
+       font-size: 16px;\r
+       display: block;\r
+}\r
+\r
+/*temp*/\r
+.card.wide .header h1 {\r
+    /*float: none;*/\r
+    float: left;\r
+}\r
+\r
+.card ul {\r
+    list-style-type: none;\r
+    margin: 0;\r
+    padding: 0;\r
+}\r
+.card li {\r
+    padding: 2px;\r
+    margin-bottom: 2px;\r
+       border-bottom: 1px solid lightgray;\r
+}\r
+.card li::before {\r
+       content: "# ";\r
+}\r
+.card li.selected::before{\r
+       content: "#>";\r
+}\r
+\r
+.card li:hover {\r
+    background-color: #EEE;\r
+}\r
+\r
+.card .footing {\r
+    padding-bottom: 5px;\r
+    color: red;\r
+}\r
+/*\r
+Card top navigation\r
+probably not all are used.\r
+*/\r
+\r
+/* Add a black background color to the top navigation */\r
+.topnav {\r
+    /*background-color: #333;*/\r
+    background-color: transparent;\r
+    overflow: hidden;\r
+}\r
+\r
+/* Style the links inside the navigation bar */\r
+.topnav a {\r
+    float: right;\r
+    /*display: inline-block;*/\r
+    color: var(--scolor-3);\r
+    text-align: center;\r
+    padding: 12px 8px;\r
+    text-decoration: none;\r
+       font-size: 16px;\r
+}\r
+\r
+/* Add a color to the active/current link */\r
+.topnav a.active {\r
+    background-color: #4CAF50;\r
+    color: var(--scolor-3);\r
+}\r