X-Git-Url: https://git.josue.xyz/?a=blobdiff_plain;f=styles%2Fframes.css;fp=styles%2Fframes.css;h=96a5b9bca60cde0a882b7a005e10ecdde43f6108;hb=dbac5cb460f04625bc2a9e414e51900c9777d3ae;hp=0000000000000000000000000000000000000000;hpb=6c19fe21cbfc617146dd8df2ffd48e430155bebb;p=VSoRC%2F.git

diff --git a/styles/frames.css b/styles/frames.css
new file mode 100644
index 0000000..96a5b9b
--- /dev/null
+++ b/styles/frames.css
@@ -0,0 +1,180 @@
+
+/** New frames **/
+.tableframe {
+	background-color: white;
+    width: 1100px; /*needs to be fixed*/
+    font-size: 14px;
+    margin: 0px 10px 20px 10px;
+}
+
+.tableframe .container{
+    padding: 8px 16px;
+    height: auto;
+    overflow: auto;
+}
+
+.tableframe .header {
+    border-style: solid;
+    border-color: var(--scolor-3);
+    border-width: 2px 0 2px 0;
+    padding: 0px 16px;
+}
+
+.tableframe .header h1 {
+    display: inline-block;
+    width: 500px;
+    margin-left: 25px;
+}
+
+
+.tableframe .hiddenrow {
+    display: none;
+}
+
+.header .alert {
+    color: red;
+}
+
+.tableframe .header .tablebtn {
+	padding: 5px 0px;
+    margin: 5px 5px 5px 0px;
+    border: none;
+    background-color: inherit;
+    cursor: pointer;
+}
+
+/************ Dropdown menu for tables *********/
+/*.tableframe .header */
+.dropdown {
+    float: right;
+    position: relative;
+}
+
+.dropdown button {
+	padding: 5px 0px;
+    margin: 5px 0px;
+    border: none;
+    background: inherit;
+	cursor: pointer;
+}
+
+/*.dropdown button {
+	padding: 5px 15px;
+    margin: 5px 0px;
+	background-color: var(--tcolor-2);
+	border: none;
+	color: var(--tcolor-4);
+	cursor: pointer;
+	border-radius: 4px;
+    width: 80px;
+}*/
+
+/*
+.dropdown button:hover {
+    background-color: var(--tcolor-0);
+    color: white;
+}*/
+
+/* Dropdown Content (Hidden by Default) */
+.dropdown-content {
+    display: none;
+    position: absolute;
+    min-width: 80px;
+    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+    z-index: 1;
+    right: -15px;
+    top: 30px;
+    border-radius: 4px;
+    border: 2px solid var(--tcolor-4);
+    background-color: white;
+}
+
+/* Links inside the dropdown */
+.dropdown-content a {
+    color: var(--tcolor-4);
+    padding: 5px 15px;
+    text-decoration: none;
+    display: block;
+}
+
+/* Change color of dropdown links on hover */
+.dropdown-content a:hover {
+    background-color: var(--tcolor-0);
+    border-radius: 2px;
+    color: white;
+}
+
+.dropdown:hover .dropdown-content {
+    display: block;
+}
+
+/* Dropdown Content (Hidden by Default) 
+.dropdown-content {
+    display: none;
+    position: absolute;
+	background-color: var(--tcolor-2);
+    min-width: 80px;
+    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+    z-index: 1;
+    right: 0;
+    border-radius: 4px;
+}
+
+/* Links inside the dropdown 
+.dropdown-content a {
+    color: var(--tcolor-4);
+    padding: 5px 15px;
+    text-decoration: none;
+    display: block;
+}
+
+/* Change color of dropdown links on hover 
+.dropdown-content a:hover {
+    background-color: var(--tcolor-0);
+    border-radius: 4px;
+    color: white;
+}
+
+.dropdown:hover .dropdown-content {
+    display: block;
+}
+*/
+
+/******************** icons ***********/
+.icon {
+    background: url('../img/all_icons.svg') no-repeat;
+}
+
+.icon-menu {
+    width: 16px; /* Icon width */
+    height: 16px; /* Icon height */
+    display: inline-block; /* Display icon as inline block */
+    background-position: -16px 0px; /* Icon background position in sprite */
+
+}
+
+.icon-move {
+    width: 16px; /* Icon width */
+    height: 16px; /* Icon height */
+    display: inline-block; /* Display icon as inline block */
+    background-position: 0px 0px; /* Icon background position in sprite */
+
+}
+
+.icon-minimize {
+    width: 16px; /* Icon width */
+    height: 16px; /* Icon height */
+    display: inline-block; /* Display icon as inline block */
+    background-position: -32px 0px; /* Icon background position in sprite */
+}
+
+.icon-maximize {
+    width: 16px; /* Icon width */
+    height: 16px; /* Icon height */
+    display: inline-block; /* Display icon as inline block */
+    background-position: -48px 0px; /* Icon background position in sprite */
+}
+
+.active-tab{
+    content: url('../img/all_icons.svg');
+}
\ No newline at end of file