I've created a new AWS amplify application and just followed the guide to add a login validator, the guide I used is this, which is the official one, but when I start the application what I've got is this:
What's wrong???
My styles.css file has the following content
/* You can add global styles to this file, and also import other style files */
That guide is outdated. Please use this onehttps://ui.docs.amplify.aws/react/getting-started/installation
In short, add this line to your styles.css:
#import "#aws-amplify/ui-react/styles.css";
Related
I have a css file to change field color in a form but I have no idea which bundle should contain it.
You can read in the Bundles documentation that the web.assets_backend bundle contain the code specific to the web client (notably the web client/action manager/views):
web.assets_backend: this bundle contains the code specific to the web client (notably the web client/action manager/views)
Example (taken from the web module):
'assets': {
'web.assets_backend': [
'web/static/src/legacy/scss/fields.scss',
],
}
In odoo 15 CSS, SCSS, and JS files path is added in manifest file check website module manifest file for reference,
Odoo documentation for different bundle selection.
It is best to check which CSS file is affecting the view you want to enhance and check its file path and add your CSS accordingly, so the question about assets backend or frontend depends on where you want to enhance. check the documentation that might also give you a better idea
I'm trying to deploy my tailwind site to Netlify. I've been able to deploy it but it only comes out as plain html, no css. My guess is that its because the styles.css is in a src folder but I'm not very sure.
I used tailwind without PostCSS so that could also be a problem.
Any help is appreciated;
Github: https://github.com/JojoDuke/Insure-LandingPage-Design
Site-preview: https://naughty-ptolemy-d0f425.netlify.app/
It looks like your link tags in your HTML aren't pointing to the same location as the output of your tailwindcss build command, causing the CSS to not be pulled through.
Try recloning your repo from scratch, and running the build command you put in your netlify settings, and seeing whether that generates the file in the right location, then update the HTML to match that location.
I am tying to integrate a custom theme into an angular4/aspdotnetcore application.
The template for the spa I use can be found here (https://github.com/asadsahi/AspNetCoreSpa)
I included my custom theme files in the wwwroot/assets folder and added an import statement to include the css files into the application. The theme uses a custom font that is also located in a subfolder of the assets folder. But, since webpack moves all css files into the dist folder, the font can't be resolved when running the application.
I tried adding an import statement for the font but this doesn't solve my problem. As the theme searches the font at a relative path '../fonts/theme-custom-font.ttf'
When running the application I get an exception that says the font can't be resolved.
I'm sure I need to add something in the webpack config to help it resolve the font but I can't figure it out.
Can anybody help?
While building large applications with meteor, we do face the regular problem of editing the stylesheets files. Once a file is edited, the whole application reloads which takes time each time a little change is made. A large project implicitly implies complex css files. For this reason I chosen to use the sass in order to structure them and be more efficient in the development processing. What I'm looking for is a workflow where I can change the .scss files in an editor and watch the result in real time in my meteor app.
Here is what you need (it looks fastidious but do not be afraid, it worth it):
Setup your project to externalise .css files
Meteor compiles all the .css files into one monolithic one, most of the css editors are not expecting this behaviour. For the development phase, I do recommend to use the traditional approach of including the stylesheet to the html page itself. to do so:
Create a public folder in the root of your meteor project: meteorProject/public
Add a css file into this folder: meteorProject/public/style.css
Import the stylesheet in your main html code <link rel="stylesheet" type="text/css" href="/style.css" />
What you did ? You created a public repository accessible through the path localhost:3000/ then you added the stylesheet style.css to this repository, that one became available through the relative path /style.css. By using this technique, meteor will not compile neither include by itself the stylesheet to your project, you just load it manually in the regular way using the link tag. Now it is time to configure an editor.
Now that the styles are imported the way they were 10 year ago, you can use compatible tools which will override the style to allow live editing. A simple one but only for css is the well known Espresso (formerly CSSEdit), open the page and override the styles… but that one is currently not supporting .scss files.
Editing .scss files in realtime with meteor:
To achieve this, you will need to use Sublime Text 2 or 3 as the editor, you can get it here: http://www.sublimetext.com/3 it is not free but there is no feature nor time restriction. So if you continue using it, just buy it to support the developers team.
You will need the awesome tool to allow the live edition which is takana, get it here: https://github.com/mechio/takana
That takana is freaking awesome! the concept is the following: Once installed and ran it will create a server interacting with the sublimetext editor, then you are requested to add a js snippet to your code so that the browser will get connected with the takana server and reload the .css or .scss files in realtime without having to reboot meteor.
To setup the meteor project with takana just do the following:
open the terminal
sudo npm install -g takana (enter your password if requested)
start takana in another terminal by providing it the absolute path of the meteorProject/public folder created above is might look something like: takana /Users/aUser/meteorProject/public
Add to your main html page the js snippet <script type="text/javascript" src="http://localhost:48626/takana.js"></script>
You are all set, now to use it
Start your meteor project in a second terminal. command meteor from the right path…
Open any browser to your meteor page i.e. probably http://localhost:3000
Open sublimetext, try editing your style.css file, the css changes are automatically displayed on the browser page without saving anything.
This is also working with .scss file. Just rename the style.css to style.css.scss and edit it within sublime text. Here the magic happen, you are editing a scss file with live result on a meteor application without having to reload anything.
Once you are satisfied with the result you can either compile the .scss to a .css file and add it the regular way to the project, or use the meteor .scss package which will do this for you at each restart. Note: Don't forget to remove the js and style snippet one to your code once in production.
Last but not least: you can open the project in several browsers and see them be refreshed in live while you edit the file in SublimeText, also it worked fine with Safari, FF but for some reasons I had to use "Google Chrome Canary" instead of "Chrome". Please comment if you made it work on other browsers such as IE, Opera or even if it worked with the regular "Chrome" on your computer.
Currently, I'm working with the IvoryCkEditorBundle, I read the doc but I didn't understand how can I upload pictures when I submit the Ckeditor area. I saw you can add specifics options like : "filebrowserBrowseRoute" but I don't understand how it work.
See the doc here: the doc
You need an filebrowser, thirdparty, or written by yourself.
As a example you can use Elfinder, configured by yourself or via bundle, like FMElfinderBundle
The readme explains how to configure bundle to work with trsteel CKeditor bundle, but configuration for Ivory should be almost the same