I wasn't able to find this anywhere, so...
This is my first Doxygen attempt.
I have a code in C and use Doxygen to generate the HTML documentation.
However, when I mix block and line comments, the resulting source code is not formatted correctly. Some comments (not doxygen) are rendered as acutal comments and some are shown as preprocessor lines.
This is a MWE source code:
#ifdef __DEFINES_H_
#define __DEFINES_H_
// this comment looks like a comment
/** error */
#define ERROR -1
// this is also ok
/** This is zero */
#define ZERO 0
// and so is this one
#define FIRST 1 /**< the first */
// but this comment is listed with class="preprocessor"
#define TEN 10 /**< just 10 */
// and this comment also looks like a preprocessor line
/** error */
#define ANOTHER_ERROR -1
// here the comment looks like a comment again
/** This is zero */
#define ANOTHER_ZERO 0
#endif // __DEFINES_H_
The HTML source code for this file is the following (sorry for the long lines).
<div class="line"><a name="l00002"></a><span class="lineno"> 2</span> <span class="preprocessor">#define __DEFINES_H_</span></div>
<div class="line"><a name="l00003"></a><span class="lineno"> 3</span> </div>
<div class="line"><a name="l00004"></a><span class="lineno"> 4</span> <span class="comment">// this comment looks like a comment</span></div>
<div class="line"><a name="l00006"></a><span class="lineno"> 6</span> <span class="comment"></span><span class="preprocessor">#define ERROR -1</span></div>
<div class="line"><a name="l00007"></a><span class="lineno"> 7</span> </div>
<div class="line"><a name="l00008"></a><span class="lineno"> 8</span> <span class="comment">// this is also ok</span></div>
<div class="line"><a name="l00010"></a><span class="lineno"> 10</span> <span class="comment"></span><span class="preprocessor">#define ZERO 0</span></div>
<div class="line"><a name="l00011"></a><span class="lineno"> 11</span> </div>
<div class="line"><a name="l00012"></a><span class="lineno"> 12</span> <span class="comment">// and so is this one</span></div>
<div class="line"><a name="l00013"></a><span class="lineno"> 13</span> <span class="preprocessor">#define FIRST 1 </span></div>
<div class="line"><a name="l00015"></a><span class="lineno"> 15</span> <span class="preprocessor">// but this comment is listed with class="preprocessor"</span></div>
<div class="line"><a name="l00016"></a><span class="lineno"> 16</span> <span class="preprocessor">#define TEN 10 </span></div>
<div class="line"><a name="l00018"></a><span class="lineno"> 18</span> <span class="preprocessor">// and this comment also looks like a preprocessor line</span></div>
<div class="line"><a name="l00019"></a><span class="lineno"> 19</span> </div>
<div class="line"><a name="l00020"></a><span class="lineno"> 20</span> <span class="preprocessor">#define ANOTHER_ERROR -1</span></div>
<div class="line"><a name="l00021"></a><span class="lineno"> 21</span> </div>
<div class="line"><a name="l00022"></a><span class="lineno"> 22</span> <span class="comment">// here the comment looks like a comment again</span></div>
<div class="line"><a name="l00024"></a><span class="lineno"> 24</span> <span class="comment"></span><span class="preprocessor">#define ANOTHER_ZERO 0</span></div>
<div class="line"><a name="l00025"></a><span class="lineno"> 25</span> </div>
<div class="line"><a name="l00026"></a><span class="lineno"> 26</span> <span class="preprocessor">#endif // __DEFINES_H_</span></div>
And this is how the browser shows it.
Lines 15 and 18 use <span class="preprocessor"> when should use <span class="comment">.
As I can see, it happens after /**< */ comments.
But how to fix this?
I checked it with the doxygen 1.8.13 version and here I can see the problem as indicated.
With the current 1.9.1 version the problem is gone.
In the 1.8.13 version the line 18 was marked as "preprocessor" and in version 1.9.1 it is marked as "comment"
This bug has been fixed between 1.8.13 and 1.9.1, so to fix it is to upgrade to newer version.
(it was actually fixed in 1.9.0, but it is better not to use 1.9.0 but 1.9.1).
Related
I’m having this issue, I searched in the forum but didn’t find anything related.
I am trying to use justify-center for small screens and justify-end for large screens. Reading the docs I found this:
So I tried to use it as justify-sm-center and justify-lg-end but haven’t been able to make it work. I made this fiddle to demonstrate it:
https://jsfiddle.net/leoprada/3b40vn6g/
<div class="row">
<p>Class: justify-center applied when BP lg (justify-lg-center) and justify-end on BP sm (justify-sm-end) </p>
<div class="row col-12 justify-sm-end justify-end-sm justify-lg-center bg-black">
<div class="col-sm-4 col-lg-6 bg-blue q-py-md text-center">
col-4
</div>
<div class="col-4 bg-green q-py-md text-center">
Col-4
</div>
</div>
</div>
I don’t really know if I am doing something wrong.
(I know how to make it work by my own using CSS but I’d rather use the predefined quasar class, of course)
You need to enable the cssAddon / flex-addon. If you didn't install quasar via its native CLI and thus don't have a quasar.conf, you need to import the flex-addon.sass file.
main.js/ts
import ...
// Import Quasar css
import "quasar/src/css/index.sass"
import "quasar/src/css/flex-addon.sass" // <--- NEW
createApp...
I don’t think the breakpoints work on rows (only items within rows), so I think to do what you want, you would have to use the Vue Class Bindings with breakpoints or platform detection. Something like:
<div class="row">
<div :class="$q.platform.is.mobile ? 'justify-end' : 'justify-center'" class="row col-12 bg-black">
<div class="col-sm-4 col-lg-6 bg-blue q-py-md text-center">
col-4
</div>
</div>
</div>
I've been using Bootstrap for a while (specifically, version 3) and have noticed that I still am unsure whether I should always close columns with a that has a class of .row assigned to it after every 12 columns OR can I wait and apply that closing .row at the end of my code as long as I understand that any columns that add up to more than 12 columns in a single row will simply wrap automatically onto a new line. The benefit of the latter option is that it would be less code and less chances of forgetting to add that closing div tag for each 12 column row.
In other words, is it better to do this?
<div class="row">
<div class="col-md-8">
<p>some content here</p>
</div>
<div class="col-md-4">
<p>some content here too</p>
</div>
</div><!--/.row-->
<div class="row">
<div class="col-md-6">
<p>some content here</p>
</div>
<div class="col-md-6">
<p>some content here too</p>
</div>
</div><!--/.row-->
OR, is this method more efficient?
<div class="row">
<div class="col-md-8">
<p>some content here</p>
</div><!--/.col-md-8-->
<div class="col-md-4">
<p>some more content here</p>
</div><!--/.col-md-4-->
<div class="col-md-6">
<p>some content here</p>
</div>
<div class="col-md-6">
<p>some content here too</p>
</div>
</div><!--/one .row div to close them all-->
...well, it actually depends on the design - I am using both depending on the circumstance.
The difference lies in the height of the elements. If the two cols in the first row had different heights, closing the row would essentially mean that the two bottom columns would be aligned starting from the same top position.
However if the cols have different heights NOT closing the row can have different results.
edit: ...this is because of the way float works on the cols elements. Closing a row clears the float.
edit2: here is an example of both cases:
not closing row:
<div class="row">
<div class="col-">
content
</div>
<div class="col-">
content
</div>
<div class="col-">
content
</div>
<div class="col-">
content
</div>
</div>
http://jsfiddle.net/b2rkgd5w/1/
closing row:
http://jsfiddle.net/1krj49pm/2/
besides closing the row element the rest of the code is exactly the same.
How to get Emmet codding to get html structure from this code:
.header>.logo+.lang.+.menu+.container+.row>+.col-md-6+.col-md-6
I need to get container element outside of header element.
Use grouping or climb-up syntax
Grouping: ()
(.header>.logo+.lang.+.menu)+.container+.row>+.col-md-6+.col-md-6
Climb-up: ^
.header>.logo+.lang.+.menu^.container+.row>+.col-md-6+.col-md-6
<div class="header">
<div class="logo"></div>
<div class="lang "></div>
<div class="menu"></div>
</div>
<div class="container"></div>
<div class="row">
<div class="col-md-6"></div>
<div class="col-md-6"></div>
</div>
See Emmet Documentation: Abbreviation Syntax
Edit: Answer updated to include climb-up syntax alternative
I am using bootstrap 3 and noticed that my left margin gets indented little by little for each row.
Here's a snapshot depicted the issue I'm having, please check here
The code looks something like this for the first two rows in the image:
<div class="row">
<div class="col-sm-12 col-md-12">
<div class="btn-toolbar well" role="toolbar">
...
<div class="row">
<div class="col-sm-12 col-md-12">
<div class="row">
<div class="col-sm-6 col-md-6">
<div id="accordion2" class="panel panel-default">
You are putting a div inside a div and bootstrap applies a margin or padding (I forgot which one) to it.
test this out : In your style.css or equivelant do this :
.nopadtest{margin: 0px; padding: 0px;}
apply that class to your div's and see what happens. On a side note, you never closed any of the div's ! so you keep putting them in each other.
So this totally works (goes from 4 columns to 2 on small screens):
<div class="row">
<div class="col-lg-3 col-sm-6"> 1</div>
<div class="col-lg-3 col-sm-6"> 2</div>
<div class="col-lg-3 col-sm-6"> 3</div>
<div class="col-lg-3 col-sm-6"> 4</div>
</div>
As does my 3-column, however the middle column gets stacked on top of the third one (which by then is the right/2nd column).
<div class="row" id="footer">
<div class="col-lg-3 col-sm-6">
1
</div>
<div class="col-lg-3 col-sm-6">
2
</div>
<div class="col-lg-6 col-sm-6">
3
</div>
</div>
How can I tell the middle column to stack above or underneath the first column? col-sm-pull-6 doesn't work for example.
Desired result:
1 - 3
2 - ..
The problem with switching 2 and 3 and then using push and pull, is that the 2nd column still goes a top of the 3rd column. And I need them to be like in my desired result 'diagram'.
Edit: What I can do is give the first column col-sm-12. This will push the other 2 down. That way the order is good, and since it's for a footer, the fact that the paragraph column is at the complete bottom, isn't bad either. But I'm still open for better suggestions.
The grid now looks like this:
1
2 - 3
Be sure to watch out for divs that have different heights. Those will cause things to not wrap all the way to the left like you might expect.
You can address this using the bootstrap clearfix (even conditionally) with something like:
<div class="clearfix visible-sm"></div>
Put that after a div where you'd want to start a new row at the -sm size. Repeat as needed.
So here goes,
first of all you should use the designs for smaller screens BEFORE larger screens like so:
<div class="col-sm-6 col-lg-3"> (...)
Now for your design to happen you need to to this:
<div class="col-sm-6 col-lg-3">
1
</div>
<div class="col-sm-6 col-lg-3 col-lg-push-3">
3
</div>
<div class="col-sm-6 col-lg-3 col-lg-pull-3">
2
</div>
...what I did is that I reversed the 2nd with 3rd column so that they fit my needs for the smaller screen and then by using push and pull I adjusted for the larger screens.
edit: here is a working fiddle:
http://jsfiddle.net/ujrwyrbr/2/