sites
/
thelinux.pro
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

css

This commit is contained in:
Kameron Kenny 2019-07-16 08:33:31 -04:00
parent f1d7764541
commit b7e3221596
5 changed files with 148 additions and 158 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

82
punch_list/public/css/custom-large.css Normal file
View File

@ -0,0 +1,82 @@
/* Larger than tablet */
@media (min-width: 750px) {
.progress-wrapper { width: 20%; float:left; text-align:left;}
#neededBy { display: block; }
#whoami { width: 100%; }
.needby-container { width: 22%; float: left; text-align: center; }
.tags-summary { display: block; font-size: 1em; margin-left: 10px; }
a.tags-summary { color: #00BFFF; text-decoration: none; float:left;}
a.tags-summary:hover { color: #00FFFF; text-shadow: 0px 0px 23px #FFF; }
.tags-details { display: none; }
.subject {
overflow: hidden;
width: 70%;
float: left;
color: #FFF;
font-size: 2rem;
font-weight: 900; }
.column-left {
display: none;
margin-top: 100px;
margin-left: auto;
width: 30%;
height: 99%;
background-color: #000;
overflow: hidden;
float: left;
border-right: 3px solid #000;
}
.column-right { display: none; width: 10%; overflow: hidden; float: left;}
.column-middle { display: block; width: 55%; overflow: visible; margin-left:auto; margin-right:auto;}
/* Navbar */
.clock-wrapper {
display: block;
min-width: 50px; }
.clock {
display: block;
font-size: 1.8rem;
font-weight: 600;
color: #AAA;
padding: 5px;
margin-bottom: 0px; }
.navbar,
.navbar-spacer {
display: block;
width: 100%;
height: 6.5rem;
background: #222;
z-index: 99;
border-top: 0px solid #eee;
border-bottom: 1px solid #eee; }
.navbar-spacer {
display: none; }
.navbar > .container {
width: 100%; }
.navbar-list {
list-style: none;
margin-bottom: 0; }
.navbar-item {
position: relative;
float: left;
margin-bottom: 0; }
.navbar-link {
text-transform: uppercase;
font-size: 11px;
font-weight: 600;
letter-spacing: .2rem;
margin-right: 35px;
text-decoration: none;
line-height: 6.5rem;
color: #222; }
.navbar-link.active {
color: #33C3F0; }
.has-docked-nav .navbar {
position: fixed;
top: 0;
left: 0; }
.has-docked-nav .navbar-spacer {
display: block; }
/* Re-overiding the width 100% declaration to match size of % based container */
.has-docked-nav .navbar > .container {
width: 80%; }
}

53
punch_list/public/css/custom-medium.css Normal file
View File

@ -0,0 +1,53 @@
/* Larger than phone */
@media (min-width: 550px) {
.progress-wrapper { width: 20%; float:left; text-align:left;}
#neededBy { display: block; }
.subject {
overflow: hidden;
width: 70%;
float: left;
color: #FFF;
font-size: 2rem;
font-weight: 900; }
.button {
padding: 0px;
text-align: center;
text-decoration: none;
font-size: 1rem;
vertical-align: middle;
border: 1px solid #333;
background-color: #4CAF50;
margin-top: auto;
margin-bottom: auto;
margin-left: auto;
margin-right: auto;
width: 20%;
height: 40px;
float: right;}
.nav-button {
vertical-align: middle;
float: right }
.two-thirds.column { width: 68.8%; }
.column,
.columns {
background: transparent;
margin-left: 3px; }
.clock-wrapper {
display: block;
min-width: 50px;
}
.clock {
display: block;
font-size: 1.8rem;
font-weight: 600;
color: #AAA;
padding: 5px;
margin-bottom: 0px; }
.header {
background-color: #666;
text-align: center;
margin-top: 6rem; }
.punches {
text-align: left; }
}

167
punch_list/public/css/custom.css
View File

@ -1,9 +1,12 @@
/* Mobile first */
/* and generic stuff */
.progress-wrapper { width: 40%; float: left; text-align: left; }
#neededBy { display: none; } #neededBy { display: none; }
#whoami { width: 100%; } #whoami { width: 100%; }
.needby-container { width: 35%; float: left; text-align: center; }
.button:hover { color: #ddd; } .button:hover { color: #ddd; }
button:hover { color: #ddd; } button:hover { color: #ddd; }
.dropdown.menu { float:right; margin-right: 15px;} .dropdown.menu { float:right; margin-right: 15px;}
.needby-container { width: 22%; float: left; text-align: center; }
.details-container { width: 70%; } .details-container { width: 70%; }
.priority-container { width: 20%; float:left; width:10%;} .priority-container { width: 20%; float:left; width:10%;}
.priority { min-width:50px; color:steel; font-size: 35px; font-weight: 900; } .priority { min-width:50px; color:steel; font-size: 35px; font-weight: 900; }
@ -20,6 +23,12 @@ a.tags-details:hover { color: #00FFFF; text-shadow: 0px 0px 23px #FFF; }
color: #FFF; color: #FFF;
font-size: 1.5rem; font-size: 1.5rem;
font-weight: 900; } font-weight: 900; }
body {
width: 90%;
margin-left: auto;
margin-right: auto;
background: #222;
color: #AAA; }
.column-left { display: none; } .column-left { display: none; }
.column-right { display: none; } .column-right { display: none; }
.column-middle { width: 100%; overflow: auto; background: #333; padding-bottom: 200px; margin-left: auto; margin-right: auto;} .column-middle { width: 100%; overflow: auto; background: #333; padding-bottom: 200px; margin-left: auto; margin-right: auto;}
@ -85,12 +94,6 @@ i {
.edit-row { padding-top: 5px; } .edit-row { padding-top: 5px; }
.edit-text-box { width: 100%; min-height: 200px; font-size: 12px; } .edit-text-box { width: 100%; min-height: 200px; font-size: 12px; }
.ui-widget textarea { font-size: 12px; } .ui-widget textarea { font-size: 12px; }
body {
width: 90%;
margin-left: auto;
margin-right: auto;
background: #222;
color: #AAA; }
textarea { textarea {
font-size: 12px; font-size: 12px;
background: #111; background: #111;
@ -285,153 +288,3 @@ textarea {
.punches { .punches {
text-align: left; } text-align: left; }
/* Larger than phone */
@media (min-width: 550px) {
#neededBy { display: block; }
.subject {
overflow: hidden;
width: 70%;
float: left;
color: #FFF;
font-size: 2rem;
font-weight: 900; }
.button {
padding: 0px;
text-align: center;
text-decoration: none;
font-size: 1rem;
vertical-align: middle;
border: 1px solid #333;
background-color: #4CAF50;
margin-top: auto;
margin-bottom: auto;
margin-left: auto;
margin-right: auto;
width: 20%;
height: 40px;
float: right;}
.nav-button {
vertical-align: middle;
float: right }
.two-thirds.column { width: 68.8%; }
.column,
.columns {
background: transparent;
margin-left: 3px; }
.clock-wrapper {
display: block;
min-width: 50px;
}
.clock {
display: block;
font-size: 1.8rem;
font-weight: 600;
color: #AAA;
padding: 5px;
margin-bottom: 0px; }
.header {
background-color: #666;
text-align: center;
margin-top: 6rem; }
.punches {
text-align: left; }
}
/* Larger than tablet */
@media (min-width: 750px) {
#neededBy { display: block; }
.tags-summary { display: block; font-size: 1em; margin-left: 10px; }
a.tags-summary { color: #00BFFF; text-decoration: none; float:left;}
a.tags-summary:hover { color: #00FFFF; text-shadow: 0px 0px 23px #FFF; }
.tags-details { display: none; }
.subject {
overflow: hidden;
width: 70%;
float: left;
color: #FFF;
font-size: 2rem;
font-weight: 900; }
body { margin-left: auto;
margin-right: auto;
width: 90%; }
.column-left {
display: none;
margin-top: 100px;
margin-left: auto;
width: 30%;
height: 99%;
background-color: #000;
overflow: hidden;
float: left;
border-right: 3px solid #000;
}
.column-right { display: none; width: 10%; overflow: hidden; float: left;}
.column-middle { display: block; width: 55%; overflow: visible; margin-left:auto; margin-right:auto;}
/* Navbar */
.clock-wrapper {
display: block;
min-width: 50px; }
.clock {
display: block;
font-size: 1.8rem;
font-weight: 600;
color: #AAA;
padding: 5px;
margin-bottom: 0px; }
.navbar,
.navbar-spacer {
display: block;
width: 100%;
height: 6.5rem;
background: #222;
z-index: 99;
border-top: 0px solid #eee;
border-bottom: 1px solid #eee; }
.navbar-spacer {
display: none; }
.navbar > .container {
width: 100%; }
.navbar-list {
list-style: none;
margin-bottom: 0; }
.navbar-item {
position: relative;
float: left;
margin-bottom: 0; }
.navbar-link {
text-transform: uppercase;
font-size: 11px;
font-weight: 600;
letter-spacing: .2rem;
margin-right: 35px;
text-decoration: none;
line-height: 6.5rem;
color: #222; }
.navbar-link.active {
color: #33C3F0; }
.has-docked-nav .navbar {
position: fixed;
top: 0;
left: 0; }
.has-docked-nav .navbar-spacer {
display: block; }
/* Re-overiding the width 100% declaration to match size of % based container */
.has-docked-nav .navbar > .container {
width: 80%; }
}
@media (min-width: 1500px) {
.column-left {
display: none;
margin-top: 100px;
margin-left: auto;
width: 20%;
height: 99%;
background-color: #000;
overflow: hidden;
float: left;
border-right: 3px solid #000;
}
.column-middle { display: block; width: 50%; overflow: hidden; margin-left:auto;margin-right:auto;}
.column-right { display: none; width: 25%; overflow: hidden; float: left; padding-top: 100px;}
#events-list { background-color: #000; }
}

2
punch_list/public/index.html
View File

@ -37,6 +37,8 @@
<link rel="stylesheet" href="css/normalize.css"> <link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/skeleton.css"> <link rel="stylesheet" href="css/skeleton.css">
<link rel="stylesheet" href="css/custom.css"> <link rel="stylesheet" href="css/custom.css">
<link rel="stylesheet" href="css/custom-medium.css">
<link rel="stylesheet" href="css/custom-large.css">
<!-- scripts --> <!-- scripts -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script> <script src="https://code.jquery.com/jquery-1.12.4.js"></script>

2
punch_list/public/js/myFirebase.js
View File

@ -477,7 +477,7 @@ function addPunchElement(childKey, childData) {
genPunchListItem('<div id="details-container' + childKey + '" class="container details-container"></div>', '#div-portlet' + childKey); genPunchListItem('<div id="details-container' + childKey + '" class="container details-container"></div>', '#div-portlet' + childKey);
genPunchListItem('<div id="priority' + childKey + '" class="twelve columns priority">' + childData.priority + '</div>', '#priority-container' + childKey); genPunchListItem('<div id="priority' + childKey + '" class="twelve columns priority">' + childData.priority + '</div>', '#priority-container' + childKey);
genPunchListItem('<div id="subject' + childKey + '" class="subject">' + childData.subject + '</div><div id="detail-link' + childKey + '" class="two columns u-pull-right"><a style="margin-left: 10px;" class="punch-default u-pull-right" href="#" onclick=toggleElement(\'backlog-list-content' + childKey + '\')>details</a></div>', '#details-container' + childKey); genPunchListItem('<div id="subject' + childKey + '" class="subject">' + childData.subject + '</div><div id="detail-link' + childKey + '" class="two columns u-pull-right"><a style="margin-left: 10px;" class="punch-default u-pull-right" href="#" onclick=toggleElement(\'backlog-list-content' + childKey + '\')>details</a></div>', '#details-container' + childKey);
genPunchListItem('<div id="details-col-one' + childKey + '" class="three columns"></div>', '#details-container' + childKey); genPunchListItem('<div id="details-col-one' + childKey + '" class="progress-wrapper"></div>', '#details-container' + childKey);
genPunchListItem('<div id="progress' + childKey +'" class="twelve columns ' + style + '">' + childData.progress + '</div>', '#details-col-one' + childKey); genPunchListItem('<div id="progress' + childKey +'" class="twelve columns ' + style + '">' + childData.progress + '</div>', '#details-col-one' + childKey);
genPunchListItem('<div class="twelve columns punch-default" style="color: lime" id="timer' + childKey + '"></div>', '#details-col-one' + childKey); genPunchListItem('<div class="twelve columns punch-default" style="color: lime" id="timer' + childKey + '"></div>', '#details-col-one' + childKey);
// status dropdown // status dropdown