Hey yoyo,
Bootstrap is super easy to use: https://getbootstrap.com/css/#grid
When specifying the divs you provide multiple sizes for different screen
sizes (xs=mobile, sm=tablet, md=small monitor, lg=large monitor).
So an example (1/3 left, 2/3 right) for a large monitor would be:
<div class="container">
<div class="row">
<div class="col-lg-4">left</div>
<div class="col-lg-8">right</div>
</div>
</div>
If you wanted to specify multiple screen views you would do something like:
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">left</div>
<div class="col-xs-12 col-sm-6 col-md-8 col-lg-8">right</div>
Best regards,
CM.
On 13/11/16 20:00, yoyo wrote:
Hello,
to test it I switched to the bootstrap branch here
https://yafu.myfirewall.org/yafu/.
1) On the index.php the right column with the news section has much more
content than the left column. How can I make the right column 2/3 and
the left 1/3 of the page size?
2) In the past I used black.css. But with it it looks very ugly?
yoyo
David Anderson schrieb:
I revised the BOINC web code (PHP) to use Bootstrap CSS
rather than our own ad-hoc CSS (main.css, white.css).
This is on Github in a branch named "bootstrap".
You can try it out on your project,
and see it in action on the BOINC message boards.
* The revised code uses exclusively Bootstrap classes.
* Pages with multiple columns (such as the sample home page) use
Bootstrap grids
to be "responsive" (i.e. to show a single column on small displays).
* I added support for a navbar with drop-down menus. This can be fixed
or not.
* You can use the standard Bootstrap CSS (black on white) or one of the
many
"themes" (google "bootstrap free theme"; there are many sources). If
you have
your own custom CSS (based on white.css) you can still use it, though
it may
need tweaking.
To use the new code:
* Check out the "bootstrap" branch
* In tools/, do upgrade --web_only project
* In PROJECT/html/user, copy sample_bootstrap.min.css to
bootstrap.min.css;
similarly with bootstrap.min.js and jquery.min.js
* If you want to use a theme, put it in
PROJECT/html/user/bootstrap.min.css
* In PROJECT/html/project, edit your project_banner() to use the navbar
if you
want. Use boinc/html/project.sample/project.inc as a basis.
There are some rough edges - for example, in dark-background themes,
<select> options don't display correctly. (Anyone know how to fix this?).
Please send me comments/feedback.
I plan to merge this to master when it's stable.
-- David
_______________________________________________
boinc_dev mailing list
boinc_dev@ssl.berkeley.edu
http://lists.ssl.berkeley.edu/mailman/listinfo/boinc_dev
To unsubscribe, visit the above URL and
(near bottom of page) enter your email address.
_______________________________________________
boinc_projects mailing list
boinc_proje...@ssl.berkeley.edu
http://lists.ssl.berkeley.edu/mailman/listinfo/boinc_projects
To unsubscribe, visit the above URL and
(near bottom of page) enter your email address.
_______________________________________________
boinc_dev mailing list
boinc_dev@ssl.berkeley.edu
http://lists.ssl.berkeley.edu/mailman/listinfo/boinc_dev
To unsubscribe, visit the above URL and
(near bottom of page) enter your email address.
