Skip to content

Antti Väyrynen / Moya

Go to a project
Commit 74ae472d by Ossi Pesonen
Options

Updated the moyav2 CSS styles with tables. Added a media CSS for responsive desi… 

…gn. Created meta tags for responsive design. Modified multiple XML files adding table styling.
1 parent f5ebb8fd
Inline Side-by-side
Showing with 1456 additions and 26 deletions
code/moya-web/WebContent/bill/billSummary.xhtml
......@@ -9,7 +9,7 @@
<f:event type="preRenderView" listener="#{billListView.initSummaryView}" />
</f:metadata>
<ui:define name="content">
<h:dataTable border="0" id="billSummary" value="#{billListView.billsummary}" var="sumline">
<h:dataTable border="0" id="billSummary" value="#{billListView.billsummary}" var="sumline" styleClass="moya_datatable2">
<h:column>
<f:facet name="header">
<h:outputText value="${i18n['product.name']}" />
......
code/moya-web/WebContent/bill/list.xhtml
......@@ -13,7 +13,6 @@
</f:metadata>
<ui:define name="content">
<bills:list />
<br /><br />
<p:outputPanel rendered="#{placeGroupView.useEticket}" >
<p>
<p:button outcome="/place/myEtickets" value="#{i18n['placegroup.showEticket']}" />
......
code/moya-web/WebContent/foodwave/list.xhtml
......@@ -21,7 +21,9 @@
<h1>#{i18n['user.foodwavelist.title']}</h1>
</ui:define>
<ui:define name="content">
<h:form id="foodwave" styleClass="moya_datatable3">
<foodwave:list outcome="/foodwave/listProducts" />
</h:form>
</ui:define>
</ui:composition>
......
code/moya-web/WebContent/foodwave/listProducts.xhtml
......@@ -22,9 +22,8 @@
</ui:define>
<ui:define name="content">
<!-- products:shop commitaction="#{foodWaveFoodView.commitShoppingCart()}" items="#{foodWaveFoodView.shoppingcart}" commitValue="#{i18n['productshop.commit']}" /-->
<!-- products:shop commitaction="#{foodWaveFoodView.commitShoppingCart()}" items="#{foodWaveFoodView.shoppingcart}" commitValue="#{i18n['productshop.commit']}" /-->
<foodwave:listFoods selectaction="#{foodWaveFoodView.buyFromInternet()}" items="#{foodWaveFoodView.shoppingcart}" commitValue="foodshop.buyProceedToPay"/>
</ui:define>
......
code/moya-web/WebContent/info/cardlessIncoming.xhtml
......@@ -5,6 +5,7 @@
xmlns:tools="http://java.sun.com/jsf/composite/cditools" xmlns:user="http://java.sun.com/jsf/composite/cditools/user" xmlns:infoview="http://java.sun.com/jsf/composite/cditools/infoview">
<h:body>
<ui:composition template="/resources/templates/#{sessionHandler.infoscreen}/template.xhtml">
<ui:param name="ignorenavigationleft" value="true" />
<f:metadata>
<f:viewParam name="userid" value="#{userView.userid}" />
......
code/moya-web/WebContent/place/myGroups.xhtml
......@@ -16,7 +16,7 @@
<ui:define name="content">
<h:outputText rendered="#{empty placeGroupView.groupMemberships}" value="#{i18n['placegroupview.noMemberships']}" />
<h:form rendered="#{!empty placeGroupView.groupMemberships}" id="placelistform">
<h:form rendered="#{!empty placeGroupView.groupMemberships}" id="placelistform" styleClass="moya_datatable2">
<p:dataTable value="#{placeGroupView.groupMemberships}" var="member" id="placestable">
......
code/moya-web/WebContent/poll/index.xhtml
......@@ -14,7 +14,7 @@
<ui:define name="content">
<h1>Kyselyt</h1>
<h:form>
<h:dataTable border="0" id="poll" value="#{pollView.polls}" var="poll">
<h:dataTable border="0" id="poll" value="#{pollView.polls}" styleClass="moya_datatable1" var="poll">
<h:column>
<h:outputText value="#{poll.name}" />
</h:column>
......
code/moya-web/WebContent/resources/cditools/bills/list.xhtml
......@@ -25,7 +25,7 @@
</h:form>
<h:form rendered="#{billListView.bills.rowCount gt 0}">
<h:form rendered="#{billListView.bills.rowCount gt 0}" id="billList" styleClass="moya_datatable3">
<p:dataTable styleClass="bordertable" id="billList"
value="#{billListView.bills}" var="bill"
......
code/moya-web/WebContent/resources/cditools/products/shop.xhtml
......@@ -111,16 +111,13 @@
</p:columnGroup>
</p:dataTable>
<br />
<h:panelGrid columns="3" rendered="#{productShopView.checkAllowStats}">
<h:outputText for="allowStats" value="#{i18n['bill.allowStatistics']}" />
<p><h:outputText for="allowStats" value="#{i18n['bill.allowStatistics']}" /></p>
<h:selectBooleanCheckbox id="allowStats"
value="#{productShopView.allowStatistics}" />
<h:message for="allowStats" />
<p><h:message for="allowStats" /></p>
</h:panelGrid>
<br />
<h:panelGroup rendered="#{productShopView.gatherBillInfo}">
<h2>
<p:outputLabel value="#{i18n['bill.notes.title']}" />
......@@ -128,7 +125,6 @@
<p:inputTextarea cols="50" value="#{productShopView.otherInfo}"
label="#{i18n['otherInfo']}" />
</h:panelGroup>
<br />
<!-- Paytrail needs to initialize after the ajax call is complete -->
<!-- This function is to be override by the paytrail init function -->
......
code/moya-web/WebContent/resources/cditools/user/edit.xhtml
......@@ -172,7 +172,7 @@
</ui:fragment>
<h:form>
<h:form id="userSelectableRoles">
<p:fieldset legend="#{i18n['user.userSelectableRoles']}" rendered="#{userView.showUserSelectableRoles and cc.attrs.showRoles}">
<p:panelGrid columns="2" styleClass="noBorders">
<p:selectManyCheckbox converter="#{roleConverter}" layout="pageDirection" value="#{userView.userSelectableRoles}">
......
code/moya-web/WebContent/resources/templates/moyav2/css/media.css 0 → 100644
@media screen and (max-width: 1600px) {
#header_first h1 { font-size: 24px; }
}
@media screen and (max-width: 1250px) {
#content-wrapper { overflow: visible; }
header#top #user-mode .ui-button-text {
padding: 10px !important;
background: #70cbc3 !important }
header#top #user-mode .ui-button-text:hover { background: #263238 !important; }
}
@media screen and (max-width: 1000px) {
nav#menu h3 a { font-size: 12px !important; }
body, p, label { font-size: 12px !important; }
img { max-width: 100%; height: auto; }
}
@media screen and (max-width: 900px) {
.ui-panelgrid .ui-panelgrid-cell { padding: 0; }
#main .ui-fieldset { padding: 0 !important ;}
header#top { height: auto !important; }
header#top #header_first { width: 50%; height: 100px; }
header#top #header_second { width: 45%; background: #70cbc3; height: 100px; margin-left: 0; padding-left: 5%;}
header#top #header_third { width: 47%; height: auto; margin-left: 0 !important; padding-left: 3%;}
header#top #header_fourth { width: 45%; margin-left: 0 !important; float: right; }
#content-wrapper #left-bar { width: 30% !important; }
#content-wrapper #main { width: 65%; }
#content-wrapper #main.span_10_of_10 { width: 100% !important; }
}
@media screen and (max-width: 760px) {
#main table table thead td { padding: 10px; text-align: left;}
#main table table tr { padding: 10px 0;}
#main table thead th { padding: 10px;}
#main table tr, #main table td, #main table th{ display: block; width: 100%;}
table tr:nth-child(odd) { background: #eee; }
h1 { font-size: 24px; }
h2 { font-size: 20px; }
h3 { font-size: 16px; }
h4 { font-size: 12px; }
#header_first a { padding: 15px 0; }
#header_second #event-info { padding: 15px 0; }
.grid, #content-wrapper.grid {display: block !important;}
.col { width: 100% !important; float: none !important; display: block;}
#user-login { position: inherit !important;}
#toggle-navigation { display: block !important; }
#content-wrapper #left-bar { display: none; }
#content-wrapper .col { display: block; }
#content-wrapper #left-bar #moya-logo { display: none; }
#main table thead th { font-size: 10px; word-break: break-all}
.content-padding { padding: 10px; }
#user-login .col.currentnick { width:70% !important; float: left !important; line-height: 50px; }
#user-login #log-out { width: 30% !important; float: left !important; line-height: 35px; min-height: auto; }
#user-login #log-out a { min-height: 50px; }
#logged-in { height: auto;}
#content-wrapper #left-bar { width: 100% !important; height: auto; }
header#top .col { text-align: center; height: auto !important; margin-left: 0 !important; padding-left: 0 !important; }
}
\ No newline at end of file
code/moya-web/WebContent/resources/templates/moyav2/css/print.css 0 → 100644
@media print {
}
\ No newline at end of file
code/moya-web/WebContent/resources/templates/moyav2/css/skinning.css 0 → 100644
/* This is file for styling (colors and font-sizes) */
.ui-widget {
font-size: 95% !important;
}
.bgColor1.ui-layout-unit {
}
.bgColor1 .ui-layout-unit-content {
background-image: none;
}
.bgColor1 .ui-layout-unit-header {
background-image: none;
}
.missing_i18n {
color: red;
-webkit-animation-name: blinker;
-webkit-animation-duration: 1s;
-webkit-animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
-moz-animation-name: blinker;
-moz-animation-duration: 1s;
-moz-animation-timing-function: linear;
-moz-animation-iteration-count: infinite;
animation-name: blinker;
animation-duration: 1s;
animation-timing-function: linear;
animation-iteration-count: infinite;
}
@-moz-keyframes blinker {
0% { opacity: 1.0; }
50% { opacity: 0.0; }
100% { opacity: 1.0; }
}
@-webkit-keyframes blinker {
0% { opacity: 1.0; }
50% { opacity: 0.0; }
100% { opacity: 1.0; }
}
@keyframes blinker {
0% { opacity: 1.0; }
50% { opacity: 0.0; }
100% { opacity: 1.0; }
}
code/moya-web/WebContent/resources/templates/moyav2/css/style.css 0 → 100644
/*
CSS RESET
*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}
body {
line-height:1;
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
display:block;
}
nav ul {
list-style:none;
}
blockquote, q {
quotes:none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content:'';
content:none;
}
a {
margin:0;
padding:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}
ins {
background-color:#ff9;
color:#000;
text-decoration:none;
}
mark {
background-color:#ff9;
color:#000;
font-style:italic;
font-weight:bold;
}
del {
text-decoration: line-through;
}
abbr[title], dfn[title] {
border-bottom:1px dotted;
cursor:help;
}
table {
border-collapse:collapse;
border-spacing:0;
}
hr {
display:block;
height:1px;
border:0;
border-top:1px solid #cccccc;
margin:1em 0;
padding:0;
}
input, select {
vertical-align:middle;
}
.element-invisible {
display: none;
}
/*
Globals, Structure
*/
html, body {
height: 100%;
}
body {
background: #eceff1;
font-family: 'Open Sans', arial, verdana, tahoma !important;
font-size: 16px;
font-weight: 300;
color: #263238;
line-height: 1.5;
}
p {
line-height: 1.5;
margin-bottom: 24px
}
strong {
font-weight: 700;
}
h1, h2, h3, h4, h5 {
font-family: 'Open Sans', arial, verdana, tahoma !important;
font-weight: 800;
margin-bottom: 24px;
}
a {
text-decoration: none;
color: #1fbba6;
transition: color 0.5s ease-in-out;
font-family: 'Open Sans', arial, verdana, tahoma !important;
}
a:hover {
text-decoration: none;
color: #555;
}
h1 {
font-size: 36px;
}
h2 {
font-size: 28px;
}
h3 {
font-size: 24px;
}
h4 {
font-size: 18px;
}
.clearfix {
display: block; /* Fixes some FireFox rendering quirks */
}
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
/* IE6 */
* html .clearfix {
height: 1%;
}
/* IE7 */
*:first-child + html .clearfix {
min-height: 1%;
}
/*
INPUTS
*/
label {
margin-right: 20px;
}
/* RESETTING ALL */
.ui-widget, .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
border: 0;
background: 0;
text-shadow: 0 0 0;
box-shadow: 0 0 0;
padding: 0;
margin: 0;
font-family: 'Open Sans' !important;
}
.ui-state-hover, .ui-state-focus {
box-shadow: 0 0 0;
}
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
border: 0;
background: 0;
text-shadow: 0 0 0;
box-shadow: 0 0 0;
}
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
color: #70cbc3;
}
.ui-shadow {
box-shadow: 0 0 0 !important;
}
.ui-widget-content {
background: #f9f9f9;
border: 1px solid #eee;
}
.ui-slider-handle {
border: 0;
background: #1fbba6;
}
.ui-slider-handle:hover {
background: #FFF;
}
.ui-editor textarea {
display: block;
width: 100%;
height: 100%;
min-height: 500px;
border: 1px solid #eee;
padding: 15px;
}
/* REBUILDING WITH !IMPORTANT */
#main .ui-fieldset {
border: 0 !important;
background: #F7F7F7 !important;
padding: 20px !important;
}
#main .ui-fieldset-legend {
font-size: 18px !important;
font-weight: 800 !important;
text-transform: uppercase !important;
color: #70cbc3 !important;
padding: 15px 0px !important;
background: none;
}
#main .ui-button-text {
background: #70cbc3 !important;
color: #FFF !important;
padding: 15px 20px !important;
font-family: 'Open Sans' !important;
font-weight: 300 !important;
margin: 3px !important;
transition: background 0.3s ease-in-out;
}
#main .ui-button-text:hover {
background: #263238 !important;
}
#main .container.top .ui-button-text {
background: none !important;
padding: 0 !important;
margin: 0 !important;
}
#main.ui-selectonemenu-item.ui-state-hover {
box-shadow: 0 0 0 !important;
color: #aaa !important;
}
#main .ui-button {
background: none;
border: 0;
box-shadow: 0 0 0;
color: #FFF;
transition: background 0.3s ease-in-out;
}
#main .ui-button .ui-button-text {
color: #FFF;
font-weight: 800;
text-shadow: 0 0 0;
padding: 15px 20px;
}
#main .ui-button-text-only .ui-button-text {
padding: 15px 20px;
}
#main .ui-button:hover,
#main .ui-button:focus {
box-shadow: 0 0 0;
}
#main.ui-fieldset {
background: #70cbc3;
color: #FFF;
border: 0;
text-shadow: 0 0 0;
font-family: 'Open Sans', arial, verdana, tahoma !important;
font-size: 14px;
font-weight: 800;
}
input[type=file] {
background: none !important;
border: 0 !important;
padding: 0 !important;
margin: 10px 0 !important;
}
input, textarea, .ui-inputfield, select {
box-shadow: 0 0 0 !important;
border: 1px solid #ddd !important;
margin: 10px 0 !important;
color: #555 !important;
background: #f7f7f7 !important;
padding: 5px !important;
}
textarea {
border-radius: 5px;
}
input[type=text] {
border-radius: 5px;
margin: 0 5px 0 0 !important;
min-height: 30px;
padding: 0 5px !important;
}
input[type=submit] {
background: #70cbc3 !important;
color: #FFF !important;
border: 0 !important;
padding: 10px 15px !important;
font-family: 'Open Sans';
font-weight: 300;
transition: background 0.3s ease-in-out;
min-height: 35px;
}
input[type=button] {
padding: 15px 25px !important;
background: #70cbc3 !important;
color: #FFF !important;
border: 0 !important;
transition: background 0.3s ease-in-out;
}
input[type=button]:hover,
input[type=submit]:hover {
cursor: pointer !important;
background: #263238 !important;
}
a.editorlink {
background: #70cbc3;
color: #FFF;
padding: 15px 10px;
display: inline-block;
transition: background 0.3s ease-in-out;
}
a.editorlink:hover {
background: #263238;
}
#main .moya-content form {
background: #F7F7F7;
padding: 25px;
}
.ui-datatable-header label {
color: #FFF;
text-shadow: 0 0 0;
}
/*
HEADER
*/
#content-wrapper {
position: relative;
height: 100%;
width: 100%;
overflow: hidden;
}
#container-wrapper {
position: relative;
height: 100%;
width: 100%;
}
#top {
background: #263238;
color: #FFF;
width: 100%;
height: 101px;
}
#left-bar {
background: #263238;
color: #FFF;
left: 0;
height: 100%;
width: 18.7% !important;
vertical-align: top;
}
#toggle-navigation {
background: url(../img/icons/icon-menu.png) 5% 50% no-repeat #263238;
cursor: pointer;
height: 50px;
width: 100%;
display: none;
transition: background 0.3s ease-in-out;
}
#toggle-navigation:hover {
background: url(../img/icons/icon-menu.png) 5% 50% no-repeat #70cbc3;
}
#main {
height: 100%;
}
.content-padding {
padding: 35px;
}
/*
HEADER
*/
#header_first {
background: #70cbc3;
text-align: center;
height: 101px;
}
#header_first a {
display: table;
text-align: center;
height: 100%;
width: 100%;
}
#header_first a h1 {
text-decoration: none;
color: #FFF;
display: table-cell;
vertical-align: middle;
margin-bottom: 0;
}
#header_second #event-info {
padding-top: 25px;
}
#header_second h2 {
font-size: 18px;
font-weight: 800;
color: #FFF;
margin: 0;
}
#header_second h3 {
font-size: 14px;
font-weight: 300;
color: #FFF;
margin: 0;
}
#header_first h1 a:hover {
color: #70cbc3;
}
#header_third {
position: relative;
height: 100px;
}
#header_third .ui-widget-content {
background: none;
border: 0;
}
#header_third .ui-widget-content legend {
display: none;
}
#header_fourth {
height: 100px;
position: relative;
}
#readers {
padding: 20px;
}
#readers a {
font-size: 16px;
}
/*
USER MODE AND LOGIN
*/
#user {
display: none;
}
#content-edit-links {
padding: 0 0 0 10px;
}
#user-login {
position: absolute;
top: 0;
z-index: 20;
}
#user-login .ui-fieldset-conten {
position: relative;
height: 100%;
}
#user-mode .ui-fieldset,
#user-mode .ui-fieldset {
border: 0 !important;
background: none !important;
padding: 0 !important;
}
#user-mode .ui-fieldset-legend,
#user-login .ui-fieldset-legend {
display: none;
}
#user-mode .ui-button-text {
border-radius: 25px;
background: #70cbc3 !important;
color: #FFF !important;
padding: 15px 20px 15px 50px !important;
font-family: 'Open Sans' !important;
font-weight: 300 !important;
margin: 10px 3px !important;
transition: background 0.3s ease-in-out;
}
#user-mode .ui-button-text:hover {
background: #70cbc3;
}
#user-mode .ui-button-text:focus {
border: 0 !important;
}
#user-mode #mode-user .ui-button-text {
background: url(../img/icons/icon-profile.png) center left no-repeat #70cbc3 !important;
background-position: 20px 50% !important;
}
#user-mode #mode-admin .ui-button-text {
background: url(../img/icons/icon-setting.png) center left no-repeat #70cbc3 !important;
background-position: 20px 50% !important;
}
#user-mode #mode-user .ui-button-text:hover {
background: url(../img/icons/icon-profile.png) center left no-repeat #263238 !important;
background-position: 10px 50% !important;
}
#user-mode #mode-admin .ui-button-text:hover {
background: url(../img/icons/icon-setting.png) center left no-repeat #263238 !important;
background-position: 10px 50% !important;
}
#user-login {
width: 100%;
}
#user-login #not-logged {
top: 100px;
background: #263238;
}
#user-login fieldset.ui-widget-content {
border: 0;
background: 0;
color: #FFF;
}
#user-login a {
color: #FFF;
}
#user-login .login {
padding: 20px;
}
#user-login label {
display: block;
color: #aaa;
font-size: 12px;
font-family: 'Open Sans';
}
#user-login #login-form-submit-button {
display: block;
}
#user-login #login-form-submit-button .ui-button-text {
background: #70cbc3 !important;
color: #FFF !important;
padding: 15px 20px !important;
font-family: 'Open Sans' !important;
font-weight: 300 !important;
margin: 10px 3px !important;
transition: background 0.3s ease-in-out;
display: inline-block;
}
#user-login #login-form-submit-button .ui-button-text:hover {
background: #263238 !important;
}
#user-login #login-form-username-field,
#user-login #login-form-password-field {
margin-bottom: 10px;
display: block;
}
#user-login #login-form-username-field input,
#user-login #login-form-password-field input {
border-bottom: 0;
font-size: 12px;
}
#open-user-login {
display: block;
font-size: 18px;
text-align: center;
background: rgba(0,0,0,0.1);
height: 100px;
color: #FFF;
cursor: pointer;
}
#open-user-login {
transition: all 0.5s ease-in-out;
font-family: 'Open Sans' !important;
font-weight: 800 !important;
background: rgba(0,0,0,0.2);
color: #FFF;
display: table;
width: 100%;
font-size: 14px;
}
#open-user-login p {
display: table-cell;
vertical-align: middle;
}
#open-user-login:hover {
background: #263238;
}
#open-user-login.active {
background: #263238;
color: #ddd;
}
#not-logged {
display: none;
}
#user-login #log-out a {
font-size: 0;
background: url(../img/icons/icon-power.png) center center no-repeat #dc4c43;
padding: 0 15px;
height: 100%;
display: block;
transition: background 0.3s ease-in-out;
min-height: 100px;
}
#user-login #log-out a:hover {
background: url(../img/icons/icon-power.png) center center no-repeat #bc413a;
}
#logged-in {
height: 100px;
width: 100%;
}
#logged-in .currentnick {
height: 100px;
background: rgba(0,0,0,0.2);
text-align: center;
line-height: 100px;
}
/*
Languages
*/
.container.top {
margin-bottom: 25px;
padding-bottom: 25px;
background: url(../img/border-line.png) bottom repeat-x;
width: 100%;
}
.container-top .ui-button {
background: none !important;
}
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus {
background: none;
}
.ui-widget-content a {
text-decoration: none;
color: #1fbba6;
transition: color 0.5s ease-in-out;
font-family: 'Open Sans', arial, verdana, tahoma !important;
}
/*
Menu
*/
nav#menu h3 {
background: none;
border: 0;
margin: 0;
color: #FFF;
background: none;
box-shadow: 0 0 0 0;
border-radius: 0;
background: url('../img/border-line.png') bottom repeat-x;
}
nav#menu h3 a {
color: #8a959c;
padding: 20px 30px;
text-shadow: 0 0 0;
font-family: 'Open Sans', arial, verdana, tahoma !important;
font-size: 14px;
font-weight: 800;
display: block;
transition: all 0.3s ease-in-out;
background: none;
}
nav#menu h3 a:hover {
color: #FFF;
text-shadow: 0 0 0;
background: rgba(0,0,0,0.1);
}
nav#menu .ui-panelmenu-content {
background: #37474f;
border: 0;
padding: 20px;
overflow: hidden;
}
nav#menu .ui-panelmenu-content a.ui-menuitem-link {
color: #8a959c;
font-weight: 700;
transition: all 0.3s ease-in-out;
border: 0;
}
nav#menu .ui-panelmenu-content a:hover {
background: none;
color: #FFF;
box-shadow: 0 0 0;
border: 0;
padding-left: 30px;
}
#moya-logo {
padding-top: 25px;
text-align: center;
}
/*
The Grid For Content
*/
#content-wrapper.grid {
clear: both;
padding: 0px;
margin: 0px;
display: table;
}
#content-wrapper .col {
display: table-cell;
float: none;
margin: 0;
position: relative;
}
#content-wrapper .col:first-child { padding: 0; }
#content-wrapper .span_10_of_10 {
width: 100%;
}
#content-wrapper .span_9_of_10 {
width: 90%;
}
#content-wrapper .span_8_of_10 {
width: 80%;
}
#content-wrapper .span_7_of_10 {
width: 70%;
}
#content-wrapper .span_6_of_10 {
width: 60%;
}
#content-wrapper .span_5_of_10 {
width: 50%;
}
#content-wrapper .span_4_of_10 {
width: 40%;
}
#content-wrapper .span_3_of_10 {
width: 30%;
}
#content-wrapper .span_2_of_10 {
width: 20%;
}
#content-wrapper .span_1_of_10 {
width: 10%;
}
/*
The Grid For Content
*/
#top .grid {
clear: both;
padding: 0px;
margin: 0px;
}
#top .col {
display: block;
float:left;
margin: 0 0 0 1.6%;
}
#top .col:first-child { margin-left: 0; }
#top .span_10_of_10 {
width: 100%;
}
#top .span_9_of_10 {
width: 89.84%;
}
#top .span_8_of_10 {
width: 79.68%;
}
#top .span_7_of_10 {
width: 69.52%;
}
#top .span_6_of_10 {
width: 59.36%;
}
#top .span_5_of_10 {
width: 49.2%;
}
#top .span_4_of_10 {
width: 39.04%;
}
#top .span_3_of_10 {
width: 28.88%;
}
#top .span_2_of_10 {
width: 18.72%;
}
#top .span_1_of_10 {
width: 8.56%;
}
/*
Table Styles
*/
#main table {
width: 100%;
}
#main table.ui-panelgrid {
background: none;
border-bottom: 0;
}
#main table thead th {
color: #999;
font-family: 'Open Sans', arial, verdana, tahoma !important;
font-size: 14px;
}
#main .ui-datatable thead th,
#main .ui-datatable tfoot td,
#main table.bordertable thead th{
color: #999;
border: 0;
box-shadow: 0 0 0;
text-shadow: 0 0 0;
font-family: 'Open Sans', arial, verdana, tahoma !important;
font-size: 14px;
font-weight: 800;
text-align: left;
}
#main .ui-datatable tbody td {
border: 0;
font-family: 'Open Sans', arial, verdana, tahoma !important;
font-size: 14px;
}
#main .ui-datatable tbody {
border: 0;
}
#main .ui-datatable tr {
border: 0;
}
#main table td.gridcell:last-child {
border-right: 0;
}
#main table.bordertable {
width: 100%;
}
#cardTemplates table {
width: 100%;
}
#main .ui-menu {
background: #70cbc3;
}
#main .ui-menu ul.ui-menu-list li a {
color: #FFF;
border-right: 1px solid rgba(255,255,255,0.3);
padding: 15px 20px;
}
#main .ui-menu ul.ui-menu-list li a:hover,
#main .ui-menu ul.ui-menu-list li a:focus {
background: rgba(255,255,255,0.1);
box-shadow: 0 0 0 !important;
text-shadow: 0 0 0 !important;
}
.ui-widget-header {
background: #263238;
border: 0;
padding: 10px 0;
}
.ui-widget-header span.ui-paginator-page {
color: #FFF;
}
.ui-widget-header span.ui-paginator-page.ui-state-active {
color: #999;
}
.ui-widget-header .ui-icon {
background-image: url(../img/iconset-white.png);
}
.ui-widget-header span.ui-paginator-page .ui-icon {
margin: 0 5px;
}
/*
TABLE STYLES
*/
#main .moya_datatable1 tr,
#main .moya_datatable1 table tr {
margin-bottom: 10px;
padding-bottom: 15px;
border-bottom: 1px dotted #eee;
}
#main .moya_datatable1 td,
#main .moya_datatable1 table td {
padding: 10px !important;
}
#main .moya_datatable1 tr:nth-child(even),
#main .moya_datatable1 table tr:nth-child(even){
background: #F9F9F9;
}
#main .moya_datatable1 td a,
#main .moya_datatable1 table td a {
color: #FFF;
background: #70cbc3;
padding: 7px 5px;
font-size: 12px;
transition: background 0.3s ease-in-out;
}
#main .moya_datatable1 td a:hover,
#main .moya_datatable1 table td a:hover {
background: #555;
}
#main .moya_datatable2 table table td {
border: 0 !important;
}
#main .moya_datatable2 table thead th {
background: #70cbc3;
color: #FFF;
}
#main .moya_datatable2 table tr {
margin: 5px 0 !important;
padding: 5px 0 !important;
}
#main .moya_datatable2 table td {
padding: 10px !important;
border-bottom: 1px solid #eee !important;
border-right: 1px solid #ccc !important;
}
#main .moya_datatable2 table td:last-child {
border-right: 0 !important;
}
#main .moya_datatable2 table tr:nth-child(even) {
background: #f9f9f9;
}
#main .moya_datatable2 table input {
min-height: 20px !important;
border-radius:3px;
margin: 0 3px !important;
padding: 5px 10px !important;
}
#main .moya_datatable2 table thead th {
padding: 10px !important;
}
#main .moya_datatable2 tfoot td {
border: 0 !important;
color: #000;
font-weight: 300 !important;
padding: 10px !important;
}
#main .moya_datatable2 tfoot td:last-child {
font-weight: 800 !important;
color: #000 !important;
}
#main .moya_datatable3 table table td {
border: 0 !important;
}
#main .moya_datatable3 table thead th {
background: #70cbc3;
color: #FFF;
}
#main .moya_datatable3 table tr {
margin: 5px 0 !important;
padding: 5px 0 !important;
}
#main .moya_datatable3 table td {
padding: 10px !important;
border-bottom: 1px solid #eee !important;
border-right: 1px solid #ccc !important;
}
#main .moya_datatable3 table td:last-child {
border-right: 0 !important;
}
#main .moya_datatable3 table tr:nth-child(even) {
background: #f9f9f9;
}
#main .moya_datatable3 table input {
min-height: 20px !important;
border-radius:3px;
margin: 0 3px !important;
padding: 5px 10px !important;
}
#main .moya_datatable3 table thead th {
padding: 10px !important;
}
#main .moya_datatable3 tfoot td {
border: 0 !important;
color: #000;
font-weight: 300 !important;
padding: 10px !important;
}
#main .moya_datatable3 tfoot td:last-child {
font-weight: 800 !important;
color: #000 !important;
}
\ No newline at end of file
code/moya-web/WebContent/resources/templates/moyav2/css/tabnav.css 0 → 100644
/*
TABNAV
*/
#edit { float: left; width:100%; border-bottom: 1px solid black; }
ul#usertabnav li {
display:inline;
list-style:none;
}
ul#usertabnav li a {
display:inline-block;
text-decoration:none;
padding: 15px 20px;
background: #70cbc3;
color: #FFF;
}
ul#usertabnava:hover {text-decoration:none; color:rgb(50,50,50);}
ul#usertabnav li.active {font-weight: bold; background-color:rgba(250,250,250,0.4); color: rgba(0,0,0,1); border-radius: 12px 12px 0 0; border: 1px solid black; border-bottom: none }
\ No newline at end of file
code/moya-web/WebContent/resources/templates/moyav2/js/main.js
......@@ -10,5 +10,8 @@ $(document).ready(function() {
$('#not-logged').slideToggle(300);
$(this).toggleClass('active');
});
$('#toggle-navigation').click(function() {
$('#left-bar').slideToggle(300);
});
});
\ No newline at end of file
code/moya-web/WebContent/resources/templates/moyav2/template.xhtml 0 → 100644
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<html class="no-js" xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:tools="http://java.sun.com/jsf/composite/cditools" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:c="http://java.sun.com/jsp/jstl/core" xmlns:p="http://primefaces.org/ui">
<f:view contentType="text/html" locale="#{sessionHandler.locale}">
<h:head>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title><h:outputText value="#{layoutView.getHeader()}" /></title>
<meta name="description" content="Lippukauppa" />
<meta name="author" content="CodeCrew ry" />
<meta http-equiv="Content-Language" content="#{sessionHandler.locale}" />
<link rel="icon" href="#{request.contextPath}/resources/templates/moyav2/img/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800" />
<link rel="stylesheet" type="text/css" href="#{request.contextPath}/resources/templates/moyav2/css/print.css" />
<link rel="stylesheet" type="text/css" href="#{request.contextPath}/resources/templates/moyav2/css/skinning.css" />
<link rel="stylesheet" type="text/css" href="#{request.contextPath}/resources/templates/custom_components.css" />
<link rel="stylesheet" type="text/css" href="#{request.contextPath}/resources/templates/moyav2/css/style.css" />
<link rel="stylesheet" type="text/css" href="#{request.contextPath}/resources/templates/moyav2/css/media.css" />
<ui:insert name="headerdata" />
<script language="javascript" type="text/javascript" src="#{request.contextPath}/resources/templates/moyav2/js/main.js"></script>
<script type="text/javascript">
$(document).ready(function() {
<ui:repeat value="#{localeSelectorView.availableLocales}" var="loc" varStatus="idx">
$(
".languageSelector .ui-button:eq(#{idx.index})")
.css(
"background",
"url('#{request.contextPath}/resources/icons/flags/#{loc.locale.language}.png') no-repeat")
.css("width", "16px").css("height",
"11px").css("padding", "0")
.css("margin-right", "5px").css(
"border-radius", "0")
</ui:repeat>
$(".languageSelector .ui-button-text").text("");
});
var apina = null;
</script>
</h:head>
<h:body>
<!--[if lt IE 7]>
<p class="chromeframe">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> or <a href="http://www.google.com/chromeframe/?redirect=true">activate Google Chrome Frame</a> to improve your experience.</p>
<![endif]-->
<header id="top" class="grid clearfix">
<div id="header_first" class="col span_2_of_10">
<h:link outcome="/index">
<c:choose>
<c:when test="#{sessionHandler.isInDevelopmentMode()}">
<h1>Development</h1>
</c:when>
<c:otherwise>
<p:graphicImage rendered="#{layoutView.headerIsImage}" value="#{layoutView.headerimage}" />
<ui:fragment rendered="#{!layoutView.headerIsImage}">
<h1>
<h:outputText value="#{layoutView.headertext}" />
</h1>
</ui:fragment>
</c:otherwise>
</c:choose>
</h:link>
</div>
<div id="header_second" class="col span_3_of_10">
<div id="event-info">
<h2>26.2. - 1.3.2015</h2>
<h3>Messukeskus, Tampere</h3>
</div>
</div>
<div id="header_third" class="col span_3_of_10">
<p:fieldset legend="#{i18n['mode.title']}" rendered="#{menuView.renderTopmenuChanger}">
<div id="user-mode">
<h:form>
<span id="mode-user">
<p:button outcome="/index" value="#{i18n['mode.user']}"/>
</span>
<span id="mode-admin">
<p:button outcome="/useradmin/list" value="#{i18n['mode.admin']}"/>
</span>
</h:form></div>
</p:fieldset>
<ui:fragment rendered="#{layoutView.canManageContent}">
<div id="content-edit-links">
<h:form>
<h:outputLabel for="manageBtn" value="#{i18n['content.showContentEditLinks']}" />
<h:selectBooleanCheckbox value="#{sessionStore.manageContentLinks}" onclick="this.form.submit()" />
</h:form>
</div>
</ui:fragment>
</div>
<div id="header_fourth" class="col span_2_of_10">
<div id="user-login">
<p:fieldset rendered="#{sessionHandler.loggedIn}">
<div id="logged-in" class="grid clearfix">
<div class="currentnick col span_8_of_10">
<div class="nickname"></div>
<b><h:outputText value="#{sessionHandler.currentUser.nick}" /></b>
<div class="links">
</div>
</div>
<div id="log-out" class="col span_2_of_10 logout">
<h:link outcome="/auth/logout">
<h:outputText value="#{i18n['login.logout']}" />
</h:link>
</div>
</div>
</p:fieldset>
<p:fieldset rendered="#{!sessionHandler.loggedIn}">
<div id="open-user-login"><p>Kirjaudu</p></div>
<div id="not-logged" class="login">
<h:form>
<span id="login-form-username-field">
<p:outputLabel for="linelogin" value="Käyttäjänimi: " />
<p:inputText styleClass="form" id="linelogin" value="#{authView.login}" />
</span>
<span id="login-form-password-field">
<p:outputLabel for="linepwd" value="Salasana: " />
<p:password styleClass="form" id="linepwd" value="#{authView.password}" />
</span>
<span id="login-form-submit-button">
<p:commandButton styleClass="button" id="onelinesubmit" action="#{authView.executeLoginAction}" ajax="false" value="#{i18n['login.submit']}" />
</span>
</h:form>
<ui:fragment rendered="#{authView.canCreateUser}">
<h:link value="#{i18n['submenu.user.create']}" outcome="/user/create" />
<br />
</ui:fragment>
<h:link value="#{i18n['submenu.auth.sendResetMail']}" outcome="/auth/sendResetMail" />
</div>
</p:fieldset>
</div>
</div>
</header>
<div id="content-wrapper" class="clearfix grid">
<div id="toggle-navigation"></div>
<ui:fragment rendered="#{!ignorenavigationleft}">
<div id="left-bar" class="col span_2_of_10">
<nav id="menu">
<h:form id="mainMenu">
<p:panelMenu id="panelmenu" model="#{primeMenuView.menuModel}" />
</h:form>
<div id="readers">
<h:link style="font-size: 10px;" rendered="#{readerView.shopToOthers}" outcome="/shop/showReaderEvents" value="Readers" />
</div>
</nav>
<div id="moya-logo">
<a href="http://www.codecrew.fi"><img src="#{request.contextPath}/resources/templates/moyav2/img/moya_logo.png" alt="Moya by Codecrew" title="Moya by Codecrew"/> </a>
</div>
</div>
</ui:fragment>
<div id="main" class="#{(!ignorenavigationleft)?'col span_8_of_10':'col span_10_of_10'}">
<div class="content-padding">
<ui:fragment rendered="#{!ignorenavigationleft}">
<div class="container top">
<h:form id="selectLanguage">
<p:selectOneButton id="langselect" styleClass="languageSelector" value="#{sessionStore.locale}" immediate="true" converter="#{localeConverter}">
<f:selectItems value="#{localeSelectorView.availableLocales}" var="loc" itemValue="#{loc.locale}" itemLabel="#{loc.locale.displayName}" />
<p:ajax update="@all" event="change" />
</p:selectOneButton>
</h:form>
<h:link rendered="#{layoutView.manageContent}" styleClass="editorlink" value="#{i18n['layout.editTop']}" outcome="/pages/manage">
<f:param name="pagename" value="#{layoutView.pagepath}:top" />
</h:link>
</div>
</ui:fragment>
<ui:insert name="title" />
<p:menubar rendered="#{primeMenuView.hasSecondaryMenu}" model="#{primeMenuView.secondaryMenuModel}" />
<h:form id="messages">
<p:growl id="growl" showDetail="true" />
</h:form>
<ui:insert name="edittab" />
<ui:repeat var="cont1" value="#{menuView.getPagecontent('top')}">
<h:outputText value="#{cont1.content}" escape="false" />
</ui:repeat>
<div class="moya-content">
<ui:insert name="content" />
</div>
<ui:repeat var="cont1" value="#{menuView.getPagecontent('bottom')}">
<h:outputText value="#{cont1.content}" escape="false" />
</ui:repeat>
<h:link rendered="#{layoutView.manageContent}" styleClass="editorlink" value="#{i18n['layout.editBottom']}" outcome="/pages/manage">
<f:param name="pagename" value="#{layoutView.pagepath}:bottom" />
</h:link>
</div></div>
</div>
<h:form>
<p:confirmDialog global="true" showEffect="fade" hideEffect="explode">
<p:commandButton value="Yes" type="button" styleClass="ui-confirmdialog-yes" icon="ui-icon-check" />
<p:commandButton value="No" type="button" styleClass="ui-confirmdialog-no" icon="ui-icon-close" />
</p:confirmDialog>
</h:form>
<footer class="bgColor1"> </footer>
<script type="text/javascript">
$(function() {
// autoresize for main panels, this is magic :)
PrimeFaces.widgets.mainlayout.layout.loadCookie();
PrimeFaces.widgets.mainlayout.onclose = function() {
PrimeFaces.widgets.mainlayout.layout.saveCookie()
}
PrimeFaces.widgets.mainlayout.onopen = function() {
PrimeFaces.widgets.mainlayout.layout.saveCookie()
}
});
PrimeFaces.locales['fi'] = {
closeText : 'Sulje',
prevText : 'Edellinen',
nextText : 'Seuraava',
currentText : 'Tänään',
monthNames : [ 'Tammikuu', 'Helmikuu', 'Maaliskuu', 'Huhtikuu',
'Toukokuu', 'Kesäkuu', 'Heinäkuu', 'Elokuu', 'Syyskuu',
'Lokakuu', 'Marraskuu', 'Joulukuu' ],
monthNamesShort : [ 'Tammikuu', 'Helmikuu', 'Maaliskuu',
'Huhtikuu', 'Toukokuu', 'Kesäkuu', 'Heinäkuu',
'Elokuu', 'Syyskuu', 'Lokakuu', 'Marraskuu', 'Joulukuu' ],
dayNames : [ 'Sunnuntai', 'Maanantai', 'Tiistain',
'Keskiviikko', 'Torstai', 'Perjantai', 'Lauantai' ],
dayNamesShort : [ 'Su', 'Ma', 'Ti', 'Ke', 'To', 'Pe', 'La' ],
dayNamesMin : [ 'Su', 'Ma', 'Ti', 'Ke', 'To', 'Pe', 'La' ],
weekHeader : 'vk',
firstDay : 1,
isRTL : false,
showMonthAfterYear : false,
yearSuffix : '',
month : 'Kuukausi',
week : 'Viikko',
day : 'Päivä',
allDayText : 'Koko päivä'
};
PrimeFaces.locales['und'] = {
closeText : 'Sulje',
prevText : 'Edellinen',
nextText : 'Seuraava',
currentText : 'Tänään',
monthNames : [ 'Tammikuu', 'Helmikuu', 'Maaliskuu', 'Huhtikuu',
'Toukokuu', 'Kesäkuu', 'Heinäkuu', 'Elokuu', 'Syyskuu',
'Lokakuu', 'Marraskuu', 'Joulukuu' ],
monthNamesShort : [ 'Tammikuu', 'Helmikuu', 'Maaliskuu',
'Huhtikuu', 'Toukokuu', 'Kesäkuu', 'Heinäkuu',
'Elokuu', 'Syyskuu', 'Lokakuu', 'Marraskuu', 'Joulukuu' ],
dayNames : [ 'Sunnuntai', 'Maanantai', 'Tiistain',
'Keskiviikko', 'Torstai', 'Perjantai', 'Lauantai' ],
dayNamesShort : [ 'Su', 'Ma', 'Ti', 'Ke', 'To', 'Pe', 'La' ],
dayNamesMin : [ 'Su', 'Ma', 'Ti', 'Ke', 'To', 'Pe', 'La' ],
weekHeader : 'vk',
firstDay : 1,
isRTL : false,
showMonthAfterYear : false,
yearSuffix : '',
month : 'Kuukausi',
week : 'Viikko',
day : 'Päivä',
allDayText : 'Koko päivä'
};
</script>
<c:if test="#{sessionHandler.isInDevelopmentMode()}">
<script type="text/javascript">
$('*:contains("???"):not(:has(*))').filter(
function() {
return (this.textContent || this.innerText)
.indexOf("???") === 0;
}).addClass("missing_i18n");
</script>
</c:if>
</h:body>
</f:view>
</html>
\ No newline at end of file
code/moya-web/WebContent/shop/createBill.xhtml
......@@ -15,9 +15,8 @@
<h1>#{i18n['page.product.createBill.header']}</h1>
</ui:define>
<ui:define name="content">
<h:form id="billshopform">
<h:form id="billshopform" styleClass="moya_datatable2">
<products:shop commitaction="#{productShopView.commitBillCart()}" items="#{productShopView.shoppingcart}" commitValue="#{i18n['productshop.commit']}" />
</h:form>
</ui:define>
</ui:composition>
......
code/moya-web/WebContent/user/accountEvents.xhtml
......@@ -14,7 +14,7 @@
</ui:define>
<ui:define name="content">
<p:dataTable border="1" id="ac" value="#{userView.user.accountEvents}" var="ac">
<p:dataTable border="1" id="ac" styleClass="moya_datatable2" value="#{userView.user.accountEvents}" var="ac">
<p:column>
<f:facet name="header">
<h:outputText value="#{i18n['accountEvent.productname']}" />
......
code/moya-web/WebContent/user/invite.xhtml
......@@ -12,13 +12,10 @@
<h1>#{i18n['user.page.invite']}</h1>
</ui:define>
<ui:define name="content">
<h:form>
<h:panelGrid columns="3">
<h:outputLabel for="invite" value="#{i18n['user.invitemail']}" />
<h:inputText id="invite" value="#{inviteView.invitemail}" size="40" required="true" />
<h:message for="invite" />
</h:panelGrid>
<p><h:outputLabel for="invite" value="#{i18n['user.invitemail']}" /></p>
<h:inputText id="invite" value="#{inviteView.invitemail}" size="40" required="true" />
<p><h:message for="invite" /></p>
<h:commandButton action="#{inviteView.invite()}" value="#{i18n['user.invite']}" />
</h:form>
......
code/moya-web/WebContent/voting/compolist.xhtml
......@@ -14,7 +14,7 @@
<h1>#{i18n['voting.allcompos.header']}</h1>
<p>#{i18n['voting.allcompos.description']}</p>
<h:form>
<h:form id="compolist" styleClass="moya_datatable2">
<h:dataTable styleClass="bordertable" rowClasses="roweven,rowodd" id="compolisttable" value="#{compoView.compos}" var="compo">
<h:column>
<f:facet name="header">
......
code/moya-web/WebContent/voting/myEntries.xhtml
......@@ -13,7 +13,7 @@
<h1>My entries</h1>
<h:form>
<h:form id="myEntries" styleClass="moya_datatable2">
<h:dataTable styleClass="bordertable" rowClasses="roweven,rowodd" id="compolisttable" value="#{voteListView.entries}" var="entry">
<h:column>
<f:facet name="header">
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!