Страница на основе семантического пользовательского интерфейса некорректно работает в Tide SDK

Я пытаюсь создать приложение в TideSDK, используя Semantic-UI (http://semantic-ui.com/). Когда я открываю свою страницу в Chrome, она работает правильно:

http://krakow45.pl/test/chrome.png

но когда я запускаю свой код с помощью TideSDK, это выглядит так:

http://krakow45.pl/test/tide.png

Как видите, некоторые элементы отсутствуют, и это работает некорректно.

Вот мой HTML:

<!DOCTYPE html>
<html>
<head>
    <!-- JavaScript includes -->
    <script src="vendor/jquery.js"></script>
    <script src="js/app.js"></script>
    <script src="vendor/semantic/semantic.js"></script>
    <!-- /JavaScript includes -->

    <!-- CSS includes -->
    <link rel="stylesheet" type="text/css" href="vendor/semantic/semantic.css">
    <link rel="stylesheet" type="text/css" href="css/main.css">
    <!-- /CSS includes -->

    <title>xxx</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
    <!-- PAGE: NEW_REPORT -->
    <div id="NEW_REPORT_fieldsContainer" class="ui segment">
        <div class="ui input">
            <input id="NEW_REPORT_firstName" type="text" placeholder="Imię">
        </div><br /><br />
        <div class="ui input">
            <input id="NEW_REPORT_lastName" type="text" placeholder="Nazwisko">
        </div><br /><br />
        <div class="ui left icon input">
            <input id="NEW_REPORT_date" type="text" placeholder="26/03/2015">
            <i class="calendar icon"></i>
        </div><br /><br />
        <div id="NEW_REPORT_buttonNext" class="ui animated button">
            <div class="visible content">Dalej</div>
            <div class="hidden content">
                <i class="right arrow icon"></i>
            </div>
        </div>
    </div>
    <!-- /PAGE: NEW_REPORT -->
</body>


javascript html semantic-ui tidesdk
person Dawid Góra    schedule 17.03.2015    source источник
comment
Я не уверен, но версия mybe webkit в TideSDK слишком старая?   -  person Dawid Góra    schedule 17.03.2015
comment
Пожалуйста, включите свой CSS. Fiddle поможет.   -  person bpeterson76    schedule 17.03.2015

Ответы (2)


arrow_upward
2
arrow_downward

Помните, что TideSDK использует старую версию webkit. Я почти уверен, что вам придется использовать префикс для правил CSS3 (-webkit-). Но также имейте в виду, что все правила CSS3 не могут быть использованы, но на данный момент я не сталкивался с серьезными проблемами CSS3. Только одно меня беспокоит, это старая консоль разработчика ...

person zEd.    schedule 18.03.2015
comment
Я решил использовать NW.js вместо TideSDK. NW.js использует более новую (или новейшую) версию webkit. Всем спасибо :) - person Dawid Góra; 23.03.2015

arrow_upward
0
arrow_downward

TideSDK, похоже, уже не лучший выбор для разработки этих приложений :( К сожалению, после того, как они начали разрабатывать TideKit, никакой поддержки не было. Эта последняя версия должна поддерживать все элементы CSS 3, но на самом деле это не так.

Рад, что ты нашел выход :)

person Matheus Moretti Rangel    schedule 27.03.2015