jqwidgets-framework
Version:
jQWidgets is an advanced Angular, Vue, Blazor, React, Web Components, jquery, ASP .NET MVC, Custom Elements and HTML5 UI framework.
97 lines • 4.12 kB
HTML
<jqxDocking [orientation]='"horizontal"' [width]='getWidth()' [mode]='"docked"' [rtl]="true">
<div>
<div id="window1" style="height: 220px;">
<div>
Date and Time
</div>
<div style="overflow: hidden;">
<jqxCalendar [width]='180' [height]='180' [rtl]="true" style="float: left; margin-right: 10px;">
</jqxCalendar>
<h3 style="text-align: center; color: #787878;">Sunny</h3>
<div style="float: left; margin-left: 30px; text-align: center;">
<img src="./../../../images/sun-icon.png" alt="Sunny" />
</div>
<div style="text-align: left; margin-left: 5px; margin-top: 10px; font-size: 10px; float: right; margin-right: 20px;">
Mo: 23 °C<br />
To 25 °C<br />
We: 27 °C
</div>
</div>
</div>
<div id="window2" style="height: 220px">
<div>
News
</div>
<div style="overflow: hidden;">
<jqxTabs [width]='325' [height]='181' [selectedItem]='1' [rtl]="true">
<ul style="margin-left: 30px">
<li>World</li>
<li>Local</li>
<li>Sports</li>
</ul>
<div>
<div style="padding: 3px; margin: 10px; width: 150px; height: 84px; float: left;">
<img src="./../../../images/news_ie6.jpg" alt="IE6" title="IE6" />
</div>
<span style="font-size: 11px;">
Microsoft is set to get a little more pushy ensuring
you have an up-to-date browser and will automatically update Internet Explorer...
<span style="font-size: 8px;">(BBC)</span>
</span>
</div>
<div>
<div style="padding: 3px; margin: 10px; width: 144px; height: 81px; float: left;">
<img src="./../../../images/local.jpg" alt="Tennis" title="Tennis" />
</div>
<span style="font-size: 11px;">
The High Court has dismissed a challenge to laws that
require immigrant spouses to be able to speak English in order to live in the UK...
<span style="font-size: 8px;">(BBC)</span>
</span>
</div>
<div>
<div style="padding: 3px; margin: 10px; width: 130px; height: 73px; float: left;">
<img src="./../../../images/tennis.jpg" alt="Tennis" title="Tennis" />
</div>
<span style="font-size: 11px;">
British number one Elena Baltacha says Judy Murray is
a "fantastic" appointment as Great Britain's new Fed Cup captain... <span style="font-size: 8px;">(BBC)</span>
</span>
</div>
</jqxTabs>
</div>
</div>
</div>
<div>
<div id="window3" style="height: 220px">
<div>
Zodiac
</div>
<div style="overflow: hidden;">
<jqxPanel [width]='"100%"' [height]='180' [rtl]="true">
<div style="padding-left: 20px;">
<div style="padding: 3px; width: 150px; height: 110px; float: left; margin: 10px;">
<img src="./../../../images/leo.jpg" alt="Leo" title="Leo" />
</div>
<h4 style="text-align: right; color: #787878;">Leo</h4>
<span style="text-align: right; direction: rtl; font-size: 12px">
Individuals born under the zodiac sign of Leo are very
good looking and have a healthy physique, with a broad forehead. Leo are very intelligent,
extremely courageous, love their freedom and live by their own rules. Indulgence
and extravagance is like second nature to them and they love to...
</span>
</div>
</jqxPanel>
</div>
</div>
<div id="window4" style="height: 220px;">
<div>
E-mail
</div>
<div style="overflow: hidden;">
<jqxListBox [width]='"100%"' [height]='181' [source]='source' [rtl]="true">
</jqxListBox>
</div>
</div>
</div>
</jqxDocking>