semantic-ui

Semantic-UI sidebar with fixed top menu

由 会有一股神秘感。 提交于 2020-01-02 10:05:37
问题 Semantic-UI forewarns on its sidebar page that "Fixed position content may have issues changing its position when a sidebar appears." It then provides two possible solutions to the problem. Surprisingly, on that very same page and throughout the site, Semantic-UI's website uses a fixed top menu that adjusts just fine when the left sidebar is triggered. I want to simply create a fixed top menu like the one Semantic-UI's site uses that adjusts properly when the sidebar is opened. However, this

Webpack 2 issues with Semantic UI

由 孤者浪人 提交于 2020-01-02 07:19:27
问题 Been struggling to get semantic-ui setup using Webpack 2. I a few errors relating to the fonts in the default semantic-ui theme and another error regarding image-webpack-loader : ERROR in ./~/css-loader?{"lessPlugins":[{"options":{"paths":{"../../theme.config":"/Users/djthomps/Desktop/demo/theme.config"}}}]}!./~/less-loader!./semantic/src/semantic.less Module not found: Error: Can't resolve './themes/themes/default/assets/fonts/icons.eot' in '/Users/djthomps/Desktop/demo/semantic/src' @ ./~

Auto-complete or type-ahead search box using the semantic-ui framework and an ajax request

由 北慕城南 提交于 2020-01-01 06:31:47
问题 I'm using the semantic-ui framework to create a simple search form that uses auto-complete information generated by calling an api via an ajax request. The server endpoint generates a simple JSON array e.g. http://data.nzor.org.nz/names/lookups?query=lu gives ["Lubbockia","Lubbockia aculeata","Lubbockia squillimana","Lucanidae"] I can see the search making the request but I'm not sure how to get the results to display. I have created a jsfiddle at http://jsfiddle.net/6ojkdvnn/4/ $(document)

change default font in semantic-ui with @font-face

由 ≡放荡痞女 提交于 2020-01-01 01:01:08
问题 i want to change semantic-ui default font with @font-face but no matter... i tried change in less file(site.variables) but I do not know how change it i tried add my font with other custom css file but it not work @font-face { font-family: 'fontname'; src:url('themes/basic/assets/fonts/fontname.eot'); src:url('themes/basic/assets/fonts/fontname.eot?#') format('eot'), url('themes/basic/assets/fonts/fontname.woff') format('woff'); } body{ font-family: 'fontname'; } 回答1: I know two ways to

How can I separate generated artifacts from the main build with semantic UI?

由 醉酒当歌 提交于 2019-12-29 04:22:04
问题 I am trying to figure out how to integrate Semantic UI with my gulp-based frontend toolchain. The npm artifact semantic-ui includes an interactive installer that will write a semantic.json file to the root of my project and install the less files, gulp tasks and some configuration into my project. All of these files will be put in subdirectories of a single base directory specified in semantic.json. I do not want any dependency implementation files or any generated files in the git repository

How can I separate generated artifacts from the main build with semantic UI?

由 做~自己de王妃 提交于 2019-12-29 04:22:04
问题 I am trying to figure out how to integrate Semantic UI with my gulp-based frontend toolchain. The npm artifact semantic-ui includes an interactive installer that will write a semantic.json file to the root of my project and install the less files, gulp tasks and some configuration into my project. All of these files will be put in subdirectories of a single base directory specified in semantic.json. I do not want any dependency implementation files or any generated files in the git repository

How to import jquery using ES6 syntax?

由 余生颓废 提交于 2019-12-27 10:37:30
问题 I'm writing a new app using (JavaScript) ES6 syntax through babel transpiler and the preset-es2015 plugins, as well as semantic-ui for the style. index.js import * as stylesheet from '../assets/styles/app.scss'; import * as jquery2 from '../dist/scripts/jquery.min'; import * as jquery3 from '../node_modules/jquery/dist/jquery.min'; console.log($('my-app')); index.html <!DOCTYPE html> <html lang="fr"> <head> <body> <script src="dist/app.js"></script> </body> </html> Project structure . ├── app

Move logo to right

由 三世轮回 提交于 2019-12-25 08:17:58
问题 I am trying to move logo to right but it doesn't move. HTML: <div class="ui fixed stackable borderless blue inverted menu grid"> <div class="item three wide column"> <img src="http://semantic-ui.com/images/logo.png" class="logoright"> </div> <div class="item ui search eight wide column"> <div class="ui icon input"> <input class="prompt" placeholder="Common passwords..." type="text"> <i class="search icon"></i> </div> <div class="results"></div> </div> </div> CSS: .logoright { text-align:

Semantic Ui Modal duplicated on repeated calls

由 ￡可爱￡侵袭症＋ 提交于 2019-12-25 07:06:16
问题 I have a piece of jquery code which load a file as $(".data_container").load(base_path+"sign_up/signup.php?trigger_id=random"); Signup.php contains <?php include_once("../libs/php_header/php_header.php"); ?> <div class="ui modal s_umodal"> <i class="close icon"></i> <div class="header"> Modal Title </div> <div class="image content"> <div class="image"> An image can appear on left or an icon </div> <div class="description"> A description can appear on the right </div> </div> <div class=

How to “stop” closing modal if form invalid

由 浪尽此生 提交于 2019-12-25 06:02:42
问题 I have a form in a Semantic UI Modal, and I use the jQuery Form Plugin (http://malsup.com/jquery/form/#validation) to submit the form via ajax. The "submit" process of the form is triggered by the modal "ok" button. But if the form is invalid, the modal is still closed. How can I "stop" the modal close procecedure? Thanks a lot! edit Code snippets: the modal: <div class="ui modal" id="add-item-modal"> <i class="close icon"></i> <div class="header"> Eintrag hinzufügen </div> <div class=
订阅 semantic-ui