Redid CSS for editWork div

This commit is contained in:
Kenneth Jao 2016-09-05 15:45:21 -04:00
parent cd73f4533e
commit baace551fe
6 changed files with 50 additions and 47 deletions

View File

@ -1,5 +1,5 @@
<template name="admin"> <template name="admin">
<div id="{{user}}adminBanner" style="{{banner}}{{textColor}}"> <div id="{{userProfile}}adminBanner" style="{{banner}}{{textColor}}">
<ul id="adminTabs"> <ul id="adminTabs">
<li id="aClasses" style="background-color:{{divColor 'adminButtons'}};margin-left:0">Classes</li> <li id="aClasses" style="background-color:{{divColor 'adminButtons'}};margin-left:0">Classes</li>
<li id="aUsers" style="background-color:{{divColor 'adminButtons'}}">Users</li> <li id="aUsers" style="background-color:{{divColor 'adminButtons'}}">Users</li>

View File

@ -435,9 +435,17 @@ input, textarea {
} }
#editWork { #editWork {
position: absolute; width: 40%;
top: 50%; margin: auto;
left: 50%; margin-top: 5%;
}
#editWorkCont {
width: 100%;
height: 100%;
position: relative;
display: table;
} }
#workTypeBar { #workTypeBar {
@ -445,8 +453,13 @@ input, textarea {
height: 2%; height: 2%;
} }
#workNameDiv {
padding: 4% 4% 0 3.5%;
}
#workName { #workName {
font-weight: 400; font-weight: 400;
font-size: 200%;
} }
.workTitle, .prefTitle { .workTitle, .prefTitle {
@ -464,6 +477,11 @@ input, textarea {
display: none; display: none;
} }
#workNamerestrict, #workDescrestrict {
margin-top: 1.5%;
float: right;
}
.workOptions, .prefOptions { .workOptions, .prefOptions {
box-shadow: 2px 2px 5px 3px #666; box-shadow: 2px 2px 5px 3px #666;
@ -498,21 +516,26 @@ input, textarea {
box-shadow: inset 0 0 0 99999px rgba(0,0,0,0.1); box-shadow: inset 0 0 0 99999px rgba(0,0,0,0.1);
} }
#workInfoContainer, #workToggle {
height: 100%;
display: table-cell;
vertical-align: top;
}
#workInfoContainer { #workInfoContainer {
width: 70%; width: 70%;
padding: 2%; margin-right: 3%;
display: inline-block; float: left;
} }
#workToggle { #workToggle {
width: 25%; width: 27%;
height: 100%;
display: inline-block;
float: right; float: right;
vertical-align: top;
} }
#workInfoNmCont { #workInfoNmCont {
padding: 3%; padding: 3% 0 3% 7%;
} }
#workInfoNmCont div { #workInfoNmCont div {
@ -521,7 +544,8 @@ input, textarea {
.datepicker { .datepicker {
box-shadow: 2px 2px 5px 3px #666; box-shadow: 2px 2px 5px 3px #666;
background-color: rgba(255,255,255,0.7); color: #000;
background-color: rgba(250,250,250,0.85);
position: absolute; position: absolute;
} }
@ -539,18 +563,18 @@ input, textarea {
filter: none; filter: none;
} }
#workSubmit { #workSubmit, #workDelete {
font-weight: 200; font-weight: 200;
font-size: 140%; font-size: 140%;
padding: 4%; padding: 2%;
background-color: rgba(0,0,0,0.25); background-color: rgba(0,0,0,0.25);
text-align: center; text-align: center;
cursor: pointer; cursor: pointer;
position: absolute; position: absolute;
left: -91%; right: 3%;
bottom: 7%; bottom: 3%;
-webkit-transition: background-color 0.4s ease; -webkit-transition: background-color 0.4s ease;
-moz-transition: background-color 0.4s ease; -moz-transition: background-color 0.4s ease;
@ -558,7 +582,7 @@ input, textarea {
transition: background-color 0.4s ease; transition: background-color 0.4s ease;
} }
#workSubmit:hover { #workSubmit:hover, #workDelete:hover {
background-color: rgba(0,0,0,0.15); background-color: rgba(0,0,0,0.15);
} }
@ -818,6 +842,7 @@ input, textarea {
} }
#workComment { #workComment {
width: 99%;
margin-bottom: 3%; margin-bottom: 3%;
} }
@ -868,7 +893,9 @@ input, textarea {
} }
.doneUser { .doneUser {
padding: 12%; font-size: 110%;
margin: 0;
padding: 6% 6% 6% 10%;
background-color: rgba(0,0,0,0.1); background-color: rgba(0,0,0,0.1);
overflow-y: auto; overflow-y: auto;
@ -928,23 +955,3 @@ input, textarea {
box-shadow: inset 0 0 0 99999px rgba(0,0,0,0.15); box-shadow: inset 0 0 0 99999px rgba(0,0,0,0.15);
} }
#workDelete {
margin-bottom: 0;
padding: 4%;
background-color: rgba(0,0,0,0.1);
position: absolute;
bottom: 8%;
right: 5%;
cursor: pointer;
-webkit-transition: background-color 0.4s ease;
-moz-transition: background-color 0.4s ease;
-ms-transition: background-color 0.4s ease;
transition: background-color 0.4s ease;
}
#workDelete:hover {
background-color: rgba(0,0,0,0.15);
}

View File

@ -4,7 +4,7 @@
</head> </head>
<template name="main"> <template name="main">
<header style="background-color:{{user}}{{divColor 'header'}}{{textColor}}{{defaultMode}}{{refetchEvents}}"> <header style="background-color:{{userProfile}}{{divColor 'header'}}{{textColor}}{{defaultMode}}{{refetchEvents}}">
<div id="aboveBar"> <div id="aboveBar">
<i class="fa fa-bars" aria-hidden="true" style="color:{{iconColor 'menu'}}"></i> <i class="fa fa-bars" aria-hidden="true" style="color:{{iconColor 'menu'}}"></i>
<h1>Hourglass</h1><h2>{{schoolName}}</h2> <h1>Hourglass</h1><h2>{{schoolName}}</h2>
@ -115,10 +115,9 @@
<div class="overlay"> <div class="overlay">
<div id="editWork"> <div id="editWork">
<div id="editWorkCont" style="{{workCenter}};background-color:{{divColor 'header'}}"> <div id="editWorkCont" style="background-color:{{divColor 'header'}};border-top:10px solid {{workType}}">
<div id="workTypeBar" style="background-color:{{workType}}"></div>
<div id="workInfoContainer"> <div id="workInfoContainer">
<div> <div id="workNameDiv">
<span id="workNamerestrict">{{commentLength}}</span> <span id="workNamerestrict">{{commentLength}}</span>
<span class="change req" id="workName" restrict="50">{{work 'name'}}</span> <span class="change req" id="workName" restrict="50">{{work 'name'}}</span>
</div> </div>
@ -263,7 +262,5 @@
</template> </template>
<template name="doneUsers"> <template name="doneUsers">
<div class="doneUser"> <p class="doneUser">{{user}}</p>
<p>{{user}}</p>
</div>
</template> </template>

View File

@ -50,7 +50,7 @@ Session.set("classDispHover", null); // Stores current hovered filter.
Session.set("refetchEvents", null); // Stores whether to get calendar events again. Session.set("refetchEvents", null); // Stores whether to get calendar events again.
Session.set("commentRestrict", ""); // Stores text for comment character restriction. Session.set("commentRestrict", ""); // Stores text for comment character restriction.
Template.registerHelper('user', () => { Template.registerHelper('userProfile', () => {
if(Meteor.user() === undefined || Meteor.user() === null) return; if(Meteor.user() === undefined || Meteor.user() === null) return;
Session.set("user", Meteor.user().profile); Session.set("user", Meteor.user().profile);
return; return;

View File

@ -161,7 +161,6 @@
#cardColRight { #cardColRight {
width: 60%; width: 60%;
float: right; float: right;
text-align: right;
} }
.card { .card {

View File

@ -1,5 +1,5 @@
<template name="profile"> <template name="profile">
<div id="mainpage{{user}}" onclick="window.location='/'"><h2>Main Page</h2></div> <div id="mainpage{{userProfile}}" onclick="window.location='/'"><h2>Main Page</h2></div>
<div id="logout2" onclick='document.getElementById("login-buttons-logout").click();'><h2>Logout</h2></div> <div id="logout2" onclick='document.getElementById("login-buttons-logout").click();'><h2>Logout</h2></div>
<div id="profPage" style="background-color:{{divColor 'header'}};{{textColor}}{{loadNew}}"> <div id="profPage" style="background-color:{{divColor 'header'}};{{textColor}}{{loadNew}}">
<div id="profMainContainer"> <div id="profMainContainer">