I have two layouts and both are working in index page, but when I give to another the second one doesn't work. I don't know what the problem is, I'm new to tapestry.
my code is
<html t:type="layout1" title="accountInfo VideoClub"
xmlns:t="http://tapestry.apache.org/schema/tapestry_5_1_0.xsd"
xmlns:p="tapestry:parameter">
<head>
<meta content="yes" name="apple-mobile-web-app-capable"/>
<meta content="black" name="apple-mobile-web-app-status-bar-style"/>
<meta content="text/html; charset=UTF-8" http-equiv="content-type"/>
<meta content="width=device-width; initial-scale=1.0; maximum-scale=1.0;
user-scalable=0;" name="viewport" />
<title>Video Club</title>
<link href="./layout/layout.css" type="text/css" rel="stylesheet" />
</head>
<body>
<div id="wrap">
<div id="scroll">
<ul id="thelist">
<div style="text-align:center;">
<p><h1>Account info</h1>
<t:actionlink t:id="getStatus"> <img src="../layout/images
/sub.png"/>
</t:actionlink><br/><br/>
<t:actionlink t:id="getStatuss"> <img src="../layout/images
/cancel_sub.png"/> </t:actionlink><br/></p>
</div>
</ul>
</div>
</div>
</body>
</html>
Without the entire code (tml and java) we can't help you much.
Layout components in tapestry are plain components, which render their body with some content around it.
Please paste your code here.
Related
index.html:
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<link rel="icon" href="<%= BASE_URL %>favicon.ico" />
<title><%= htmlWebpackPlugin.options.title %></title>
</head>
<body>
<noscript>
<strong
>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work
properly without JavaScript enabled. Please enable it to
continue.</strong
>
</noscript>
<div id="app" class="bg-red-300"></div>
<!-- built files will be auto injected -->
</body>
</html>
App.vue:
<template>
<div class="flex flex-col md:flex-row">
<Nav class="bg-gray-300 md:w-1/4" />
<router-view class="bg-yellow-400" />
</div>
</template>
<script>
import Nav from './components/nav_components/Nav.vue';
export default {
name: 'App',
components: {
Nav,
},
};
</script>
<style></style>
640px Tailwind's small breakpoint (sm)
768px Tailwind's medium breakpoint (md)
Until 768px I use flex-col, and for bigger screen sizes I use flex-row as you can see in my code as well.
RESULT: (0-768px width, flex-col):
Between 640px and 768px the width of both my Nav and router-view containers stop expanding and I can see the red background of my where I mount my App.
RESULT: (>768px width, flex-row):
After 2050px, my container stops expanding which leads to the same result as mentioned before.
What can i do to workaround this behaviour?
Max width was by default 1536px. Setting max-w-full to my router-view container fixed the problem.
I can schedule events using gMail markup, but...
If I attempt to reschedule an event, it just makes a second copy at the new time, and leaves the original event intact.
If I attempt to cancel an event, nothing happens.
An example of what my confirmation looks like:
<div itemscope="" itemtype="http://schema.org/EventReservation">
<meta itemprop="reservationId" content="Example967585">
<link itemprop="reservationStatus" href="http://schema.org/ReservationConfirmed">
<div itemprop="underName" itemscope="" itemtype="http://schema.org/Person">
<meta itemprop="name" content="Sam Brown">
</div>
<div itemprop="reservationFor" itemscope="" itemtype="http://schema.org/Event">
<meta itemprop="name" content="The Return of the Sam Exclusive Experience">
<meta itemprop="eventStatus" content="http://schema.org/EventScheduled">
<meta itemprop="startDate" content="2019-12-20T10:00:00-08:00">
<meta itemprop="endDate" content="2019-12-20T11:00:00-08:00">
<div itemprop="location" itemscope="" itemtype="http://schema.org/Place">
<meta itemprop="name" content="851 81st Avenue">
<div itemprop="address" itemscope="" itemtype="http://schema.org/PostalAddress">
<meta itemprop="streetAddress" content="851 81st Avenue">
<meta itemprop="addressLocality" content="San Francisco">
<meta itemprop="addressRegion" content="CA">
<meta itemprop="postalCode" content="94105">
<meta itemprop="addressCountry" content="SE">
</div>
</div>
</div>
</div>
Here's a sample reschedule markup:
<div itemscope="" itemtype="http://schema.org/EventReservation">
<meta itemprop="reservationId" content="Example967585">
<link itemprop="reservationStatus" href="http://schema.org/ReservationConfirmed">
<div itemprop="underName" itemscope="" itemtype="http://schema.org/Person">
<meta itemprop="name" content="Sam Brown">
</div>
<div itemprop="reservationFor" itemscope="" itemtype="http://schema.org/Event">
<meta itemprop="name" content="The Return of the Sam Exclusive Experience">
<meta itemprop="eventStatus" content="http://schema.org/EventRescheduled">
<meta itemprop="startDate" content="2019-12-21T10:00:00-08:00">
<meta itemprop="endDate" content="2019-12-21T11:00:00-08:00">
<div itemprop="location" itemscope="" itemtype="http://schema.org/Place">
<meta itemprop="name" content="851 81st Avenue">
<div itemprop="address" itemscope="" itemtype="http://schema.org/PostalAddress">
<meta itemprop="streetAddress" content="851 81st Avenue">
<meta itemprop="addressLocality" content="San Francisco">
<meta itemprop="addressRegion" content="CA">
<meta itemprop="postalCode" content="94105">
<meta itemprop="addressCountry" content="SE">
</div>
</div>
</div>
<meta itemprop="modifiedTime" content="2019-12-19T15:15:40-08:00">
</div>
Finally, a sample cancellation markup:
<div itemscope="" itemtype="http://schema.org/EventReservation">
<meta itemprop="reservationId" content="Example967585">
<link itemprop="reservationStatus" href="http://schema.org/ReservationCancelled">
<div itemprop="underName" itemscope="" itemtype="http://schema.org/Person">
<meta itemprop="name" content="Sam Brown">
</div>
<div itemprop="reservationFor" itemscope="" itemtype="http://schema.org/Event">
<meta itemprop="name" content="The Return of the Sam Exclusive Experience">
<meta itemprop="eventStatus" content="http://schema.org/EventCancelled">
<meta itemprop="startDate" content="2019-12-21T10:00:00-08:00">
<meta itemprop="endDate" content="2019-12-21T11:00:00-08:00">
<div itemprop="location" itemscope="" itemtype="http://schema.org/Place">
<meta itemprop="name" content="851 81st Avenue">
<div itemprop="address" itemscope="" itemtype="http://schema.org/PostalAddress">
<meta itemprop="streetAddress" content="851 81st Avenue">
<meta itemprop="addressLocality" content="San Francisco">
<meta itemprop="addressRegion" content="CA">
<meta itemprop="postalCode" content="94105">
<meta itemprop="addressCountry" content="SE">
</div>
</div>
</div>
<meta itemprop="modifiedTime" content="2019-12-19T15:26:23-08:00">
</div>
Other than being run through a translator to take them out of Quoted Printable format, those are live examples, cut&pasted directly from the eMails they were sent through.
All three markups pass the testing tool at:
https://search.google.com/structured-data/testing-tool#
A subset of the things I've tried:
Using the sample code from the markup page.
Updating that code to the newest versions I can find at schema.org.
** e.g. Changing reservationNumber to reservationId.
** e.g. Changing the reservation status to match the ReservationStatus types shown on schema.org rather than the versions from the markup tutorial page.
Testing by eMailing the markup to myself, using the markup email testing script at https://developers.google.com/gmail/markup/apps-script-tutorial and the sample code from the markup eventReservation page.
Swapping from the microdata example to the json+ld example when using that self test script.
I'm stumped for more things to try.
Google has confirmed via eMail that cancelling events and removing duplicate events after a reschedule was removed as a feature in December.
I've asked them to update their documentation.
I'm new to flexbox, and I've tried applying align-center to the row class but, the h1 will not center. Could someone give me a hand with this, and explain to me why the align center is not working? Here is a code pen Codepen
<!doctype html>
<html class="no-js" lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Foundation for Sites</title>
<link rel="stylesheet" href="css/foundation.css">
<link rel="stylesheet" href="css/app.css">
</head>
<body>
<div class='header-section'>
<div class='title-bar' data-responsive-toggle='menu' data-hide-for='medium'>
<button class='menu-icon' type='button' data-toggle></button>
<div class='title-bar-title'>Menu</div>
</div>
<div class='top-bar' id='menu'>
<div class='top-bar-left'>
<ul class='dropdown vertical medium-horizontal menu' data-dropdown-menu>
<li class='menu-text'>The American Dream</li>
<li>Home</li>
<li>About</li>
<li>Contact</li>
</ul>
</div>
</div>
</div>
<div class='main-content'>
<div class='row'>
<div class='small-12 column'>
<h1>And...Then, ZANG!</h1>
</div>
</div>
</div>
<script src="js/vendor/jquery.js"></script>
<script src="js/vendor/what-input.js"></script>
<script src="js/vendor/foundation.js"></script>
<script src="js/app.js"></script>
</body>
</html>
I was creating code at google scripts https://goo.gl/pKUc7D to test order / invoice reciept markup from Google's own documentation at https://developers.google.com/gmail/markup/reference/order
It did not work. I could be missing something? The structured data testing tool gave me green checks for everything in the script textarea. I'm going to github the results to share with anyone else who runs whmcs billing software.
I'm not familiar with WHMCS billing software and how it works. I checked out your sample and I was a little confused. I see you're using:
http://schema.org/Invoice
This isn't supported in Gmail/Inbox. You'll have to follow the microdata example(s) for Order on the documentation. I noticed that even though your markup checks out with the Email Markup Tester, it doesn't mean it will be supported.
I extracted the details from your sample data and created an example for you.
<div itemscope itemtype="http://schema.org/Order">
<div itemprop="merchant" itemscope itemtype="http://schema.org/Organization">
<meta itemprop="name" content="StrikeHawk eCommerce, Inc."/>
</div>
<meta itemprop="orderNumber" content="8360"/>
<meta itemprop="priceCurrency" content="USD"/>
<meta itemprop="price" content="10.71"/>
<div itemprop="acceptedOffer" itemscope itemtype="http://schema.org/Offer">
<div itemprop="itemOffered" itemscope itemtype="http://schema.org/Product">
<meta itemprop="name" content="Hosting" />
<link itemprop="image" href="https://lh4.googleusercontent.com/-U20_IAhRras/Uuqtev8Na3I/AAAAAAAAAIc/ptToUbM6cAY/s250-no/google-plus-photo.png"/>
</div>
<meta itemprop="price" content="5.35"/>
<meta itemprop="priceCurrency" content="USD"/>
<div itemprop="eligibleQuantity" itemscope itemtype="http://schema.org/QuantitativeValue">
<meta itemprop="value" content="1"/>
</div>
</div>
<div itemprop="acceptedOffer" itemscope itemtype="http://schema.org/Offer">
<div itemprop="itemOffered" itemscope itemtype="http://schema.org/Product">
<meta itemprop="name" content="Addon" />
<link itemprop="image" href="https://lh4.googleusercontent.com/-U20_IAhRras/Uuqtev8Na3I/AAAAAAAAAIc/ptToUbM6cAY/s250-no/google-plus-photo.png"/>
</div>
<meta itemprop="price" content="5.35"/>
<meta itemprop="priceCurrency" content="USD"/>
<div itemprop="eligibleQuantity" itemscope itemtype="http://schema.org/QuantitativeValue">
<meta itemprop="value" content="1"/>
</div>
</div>
<div itemprop="billingAddress" itemscope itemtype="http://schema.org/PostalAddress">
<meta itemprop="name" content="Denver Prophit Jr" />
<meta itemprop="streetAddress" content="P.O. Box 0595" />
<meta itemprop="addressLocality" content="New Smyrna Beach" />
<meta itemprop="addressRegion" content="FL" />
<meta itemprop="addressCountry" content="United States" />
</div>
<link itemprop="orderStatus" href="http://schema.org/OrderProcessing"/>
<meta itemprop="isGift" content="false"/>
<meta itemprop="discount" content="0.00"/>
<meta itemprop="discountCurrency" content="USD"/>
<link itemprop="url" href="https://www.google.com/+StrikehawkeComm"/>
<div itemprop="customer" itemscope itemtype="http://schema.org/Person">
<meta itemprop="name" content="Denver Prophit Jr"/>
</div>
This will trigger a View Order button that will direct your customer to the "invoice/receipt." Also note, I used the discount property, which I noticed in your microdata, the discount was being recognized as an item purchased.
Oh, also, if you're trying to send a bill, set the orderStatus as:
<link itemprop="orderStatus" href="http://schema.org/OrderPaymentDue"/>
I hope this helps.
I'm following this tutorial: http://www.thymeleaf.org/doc/layouts.html (got to Thymeleaf Layout Dialect section).
In there you can find an example:
<!DOCTYPE html>
<html>
<head>
<!--/* Each token will be replaced by their respective titles in the resulting page. */-->
<title layout:title-pattern="$DECORATOR_TITLE - $CONTENT_TITLE">Task List</title>
...
</head>
<body>
<!--/* Standard layout can be mixed with Layout Dialect */-->
<div th:replace="fragments/header :: header">
...
</div>
<div class="container">
<div layout:fragment="content">
...
</div>
<div th:replace="fragments/footer :: footer">© 2014 The Static Templates</div>
</div>
</body>
</html>
Footer and header are replaced by th:replace tag in above example, while <head> has <title> tag in layout file.
Basically, I want to replace whole <head> tag with th:replace.
Therefore, I have:
My layout file:
<!DOCTYPE html>
<html>
<head th:replace="/html/components/head :: head">
</head>
<body>
<div layout:fragment="content">
</div>
...
<div th:replace="/html/components/footer :: footer" />
</body>
<html>
My content file:
<!DOCTYPE html>
<html layout:decorator="/html/layouts/layout">
<head>
<title>My content title</title>
</head>
<body>
<div layout:fragment="content">
...
</div>
</body>
</html>
And finally my /html/components/head.htm file:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout">
<head th:fragment="head">
<meta charset="utf-8" />
<title layout:title-pattern="$CONTENT_TITLE">Layout Title should be replaced by Content Title!</title>
...
</head>
<body>
</body>
</html>
Content is alright. Footer and head are included (replaced) from files as expected but page title is blank!
I get:
<!DOCTYPE html>
<head>
<meta charset="utf-8" />
<title></title>
...
What's wrong?
Finally, I've found a way to achieve what I wanted.
In layout file <title> tag must stay. All other tags I grouped with <object> tag and annotated it as follows:
<head>
<title layout:title-pattern="$CONTENT_TITLE">Layout Title will be replaced by Page Title!</title>
<object th:include="/html/components/head :: head" th:remove="tag" />
</head>
In my html/components/head.htm file I had to remove <title> tag so it won't be duplicated after include.
<head th:fragment="head">
<meta charset="utf-8" />
<!-- NO TITLE TAG HERE -->
...
</head>
This way head fragment is included in <object> tag and thanks to th:remove="tag" <object> tag gets removed and my final HTML output is:
<head>
<title>My content title</title>
<meta charset="utf-8" />
<!-- NO TITLE TAG HERE -->
...
</head>
Obviously, I removed NO TITLE TAG HERE message too, once I got it working.
I think I found a slightly less verbose way to for using th:replace and th:fragment together, e.g. to include common <head> metadata and static resource includes in your pages.
Put the th:remove="tag" in the fragment definition, so you don't have to repeat the th:remove="tag" everytime including it.
fragment_head.html
<thymeleaf xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"
th:fragment="head" th:remove="tag">
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" th:href="#{/css/vendor/bootstrap.min.css}"/>
</thymeleaf>
mypage.html
<head>
<thymeleaf th:replace="fragment_head :: head" />
</head>
You can replace whole head tag.
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head lang="pl" th:replace="fragments/head :: head">
</head>
<body>
...
</body>
</html>
resources/templates/fragments/head.html:
<head lang="pl">
<title>Title</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<link href="http://cdn.jsdelivr.net/webjars/bootstrap/3.3.5/css/bootstrap.min.css"
th:href="#{/webjars/bootstrap/3.3.5/css/bootstrap.min.css}"
rel="stylesheet" media="screen" />
<script src="http://cdn.jsdelivr.net/webjars/jquery/2.1.4/jquery.min.js"
th:src="#{/webjars/jquery/2.1.4/jquery.min.js}"></script>
<link href="../static/css/mycss.css"
th:href="#{css/mycss.css}" rel="stylesheet" media="screen"/>
</head>